51网络科技专业提供

香港空间

美国空间

国内免备案空间

月付空间

免备案虚拟主机

,支持免费试用2天
联系51网络科技
产品快讯:
售前客服
在线咨询
在线咨询
在线咨询
在线咨询
售后服务
在线咨询
在线咨询
财务问题
在线咨询
代理加盟
在线咨询
 
推荐产品
    300M国内免备案空间
    300M网站空间,送60M数据库!
    现价只要:22元/月
    500M国内免备案空间
    500M网站空间,送100M数据库!
    现价只要:29元/月
    1G国内免备案空间
    1G网站空间,送300M数据库!
    现价只要:39元/月
    500M香港免备案空间
    500M网站空间,送160M数据库!
    现价只要:26元/月
    1G香港免备案空间
    1G网站空间,送300M数据库!
    现价只要:36元/月
    100M美国空间
    100M网站空间,送30M数据库!
    现价只要:12.8元/月
 
您的当前位置:首页 > 常见问题 > 建站常见问题 > 正文
css图片大小自适应高度并垂直对齐
文章来源:51网络科技  点击数:  更新时间:2017-7-21 11:12:52
购买国内免备案空间购买香港空间【不限iis】宽屏网站制作【还送手机网站】
香港云主机/99元/月国内空间【免费备案】 特价网站空间
.Net专用空间香港独立IP空间 游戏空间【支持月付】

做网站的朋友可能经常遇到网站上面展示的图片显示变形的问题,那么我们如何处理这个问题呢

首先我们分析一下,一般都是固定宽度,高度自动,这样显示比较好看些,如下图所示:

 

css图片大小自适应高度并垂直对齐

 

经过实验总结,将代码附出来大家可以参考下:

.resize { width:218px; height:218px;vertical-align:middle;line-height:218px;  }  //固定容器的高度和宽度,并设置上下对齐

.resize img { width:218px; height:auto !important;max-height:218px;vertical-align:middle;line-height:218px;  }  // 图片宽度固定,高度自适应

再将样式标签加到你的模板中去就行了。

有需要做企业网站的朋友,可以找我们了解一下宽屏网站制作,专业建网站公司为您做出精美的网站。


国内、香港、美国、全免备案www.mrzyw.com--51网络科技,专业免备案空间提供商!
相关文章