CSS操作图片大小
width属性和height属性可以用于定义图片大小。width属性和hieght属性的属性值都是像素。CSS操作图片边框
border-width属性用于定义<img>标签的边框宽度。border-style属性用于定义<img>标签的边框样式,如:solid、dashed。border-color属性用于定义<img>标签的边框颜色。CSS操作图片对齐方式
text-align属性用于定义图片对齐方式,如:center、left、right。text-align属性只能用于<img>标签的父标签,因为text-align属性相当于定义了<img>标签在父标签中的水平方向上的对齐方式。text-align属性直接对<img>标签使用无效。<!DOCTYPE html><html><head><meta charset="utf-8"/><style yupe="text/css">img{width:50px;height:100px;border-width:5px;border-style:none;border-color:red;}#div1{text-align:center;} ##只有对父标签定义text-align属性才能使得图片的对齐方式有所改变。.div2{text-align:right;}</style></head><body><div id="div1"><img src="8C52A09A073693FCC58E4E646220AE35.jpg" alt=""/></div><div class="div2"><img src="8C52A09A073693FCC58E4E646220AE35.jpg" alt=""/></div></body></html>
CSS控制文字环绕图片效果
float属性用于实现文字环绕图片效果。float属性是针对<img>标签定义。<!DOCTYPE html><html><head><meta charset="utf-8"/><style yupe="text/css">img{float:left} ##\<img>标签向左浮动</style></head><body><img src="8C52A09A073693FCC58E4E646220AE35.jpg" alt=""/><p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p></body></html>