CSS基础笔记——图片样式

图片大小

在CSS中，我们也是使用width和height这两个属性来定义图片大小的

img{
    width:像素值;
    height:像素值;
}

在实际开发中，你需要多大的图片，就用Photoshop制作多大的图片，不建议使用一张大图片，然后再借助width和height来改变其大小，因为一张大图片体积更大，会使页面加载速度变慢，这是性能优化方面的考虑

---

图片边框

对于图片的边框，我们也是使用border属性来定义的

img{
    width:60px;
    height:60px;
    border:1px solid red;
}

---

图片对齐

在CSS中，我们可以使用text-align属性来定义图片的水平对齐方式

text-align的取值有三个：left（默认左对齐），center（居中对齐），right（右对齐）

---

垂直对齐

在CSS中，我们可以使用vertical-align属性来定义图片的垂直对齐方式

vertical-align:取值;

vertical指的是垂直的，align指的是使排列整齐，属性取值有：top，middle，baseline，bottom四个

---

文字环绕

在CSS中，我们可以使用float属性来实现文字环绕图片的效果

float:取值;

float属性的取值只有：left和right