html 图片控制,DIV CSS对img图片控制

咱们经常会碰到下列状况:

1、img图片多了边框,分外是链接后的图片带边框

2、图片越过撑破DIV

查抄 CSS设置图片宽度高度

上面我们经由CSS来设计这2个标题。

1、img图片多了边框,格外是链接后的图片带边框

77bd0e0907508078396446a91b45c48c.png

有边框的图片

按照以上图,咱们对图片加链接,结果图片涌现了边框,

图谋方法:

我们只需在初始化IMG标签CSS便可

img{ padding:0; border:0;} 介入此CSS就可消除边框

ca976acc9c274baccf71fd00236f6e76.png

CSS去掉图片边框功效

2、图片赶过撑破DIV

咱们时常会碰着由于一个图片过宽过大,撑破了咱们设置装备摆设的宽度。

规划方法

运用CSS管制改对象IMG标签宽度便可,要是该对象为.yangshi设置装备摆设宽度为500px,那我们就只需设置.yangshi img{max-width:500px;}然则在IE6中max-width是生效的,那咱们最佳贪图法子,在上传图片的时分加倍设置宽度,让图片本身宽度小于该中央配置宽度便可,何等感受很穷苦,然而不少大的站点凡是何等经管,一大要防止撑破设置宽度,二大约降低图片大小让浏览器更快翻开网页。

总结:

1、一个网页中未免有图片,这时我们必要初始化img标签即:img{ padding:0; border:0;}

2、防止图片过宽撑破网页,我们建议在上传图片刻候将图片剪切来比配置宽度小,同时还能够对该对象到场overflow:hidden属性,即潜藏赶过内容搜聚图片。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值