CSS基础知识介绍——CSS定义图片样式

1. 定义图片边框

语法如下：
<img src="图片路径" border="数值">
border-style、border-color、border-width

border-style的取值列表

参数名	含义
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：参数}

vertical-align取值列表

参数名	含义
baseline	默认值
sub	垂直对齐文本的下标
super	垂直对齐文本的上标
top	顶端对齐
middle	中部对齐
bottom	底部对齐
text-top	顶端对齐
text-botom	底端对齐

 

 

 

 

 

 

 

 

 

 

example：