做网站的时候如何通过CSS控制图片宽度

     做网站的时候，网站样式的控制是非常重要的一个环节，好的样式布局才会让人看着舒服，但是我们经常会遇到素材图片过宽，把页面撑变形的情况，除了手工剪裁之外，有没有更简单的方法呢？下面，石家庄网络公司就为大家介绍一种CSS控制方法。

     第一种：

    #content img{width: 450px;height:450px;}

    如果限制一个800*600的图片，那依然是显示为450*450，如果不确定全部都是正方形的图片，该方法有待商榷。

   第二种：

   #content img{

max-width: 450px;

height:auto;

width:expression(this.width > 450 ? "450px" : this.width);

}

    宽度width的最大值为450px，而高度height则随着宽度的变化而变化，保持原图比例，推荐使用这种方法。

    第三种：

    {img,a img{border:none;max-width:95%;}

    img,a img定义图片，和有链接的图片；border:none;没有边框，如果去掉该定义，现象就是带有链接的图片会有一个蓝色的边框，就像如果不定义文字链接的样式浏览器会默认显示一条蓝色的下划线；最后max-width:95%;这是本文的关键，意思是图片的最大宽度为该图片所处容器的95%，当然这个数字具体你可以修改，最好不超过100%否则也就没有达到自动控制图片尺寸的意义了。

    以上三种CSS控制方法，不但简单，而且对搜索引擎来说更加有好。石家庄网络公司专业为企业提供网站建设服务。

实搜网络为您提供网络推广，网络营销，网站建设，SEO优化，微信开发，网站托管等服务，服务热线：0311-66697360