1. 定义图片边框
语法如下:
<img src="图片路径" border="数值">
border-style、border-color、border-width
参数名 | 含义 |
none | 无样式 |
solid | 实线 |
outset | 外凸 |
groove | 槽线 |
dotted | 点划线 |
dashed | 虚线 |
inset | 内凹 |
ridge | 脊线 |
double | 双线 |
PS:多个相同CSS属性但它们有不同参数值的情况下,都是最后一个CSS参数起作用
2. 定义图片大小
语法如下:
img{
width:
height:
}
3.通过CSS保证图片不变形
1)通过max-width :设置图片最大值
2)通过CSS的width和height:通过百分比来控制图片缩放的效果
example:
img :one{
max-width:500px;
}
img :two{
width:50%;
height:50%;
}
4.定义图片的对齐方式
1)横向对齐:通过CSS属性继承
example: <td style="text-align:center">......</td>
2)纵向对齐:当图片高度和文字不一致,可通过vertical-align来设置
语法如下:
{ vertical-align:参数}
参数名 | 含义 |
baseline | 默认值 |
sub | 垂直对齐文本的下标 |
super | 垂直对齐文本的上标 |
top | 顶端对齐 |
middle | 中部对齐 |
bottom | 底部对齐 |
text-top | 顶端对齐 |
text-botom | 底端对齐 |
example: