【聊代码】第三十五集 css样式（之五）

聊代码（第三十九集）css样式（之五）        上两集说的都是关于文字的代码，本集展示的是关于图片的代码。请看下面效果。                   上图代码实例： ＜style type="text/css"＞img.a { height: 100px } img.b { height: 250px } img.c { height: 180px } img.汉 { border:red solid thin; outline:#00ff00 dotted thick;height: 250px } img.字 { height: 250px } ＜/style＞ ＜p＞＜img class="a" src="http://www.oldkids.cn/upload/2018/08/10/blog_ 20180810203823429.gif" /＞ ＜img class="b" src="http://www.oldkids.cn/upload/2018/08/10/blog_ 20180810210253607.jpg" / ＞ ＜img class="c" src="http://www.oldkids.cn/upload/2018/08/10/blog_ 20180810203823429.gif" /＞＜/p＞ ＜p＞＜/p＞ ＜p＞＜img class="汉" src="http://www.oldkids.cn/upload/2018/08/10/blog_ 20180810214831665.png" / ＞     ＜img class="字" src="http://www.oldkids.cn/upload/2018/08/10/blog_ 20180810213605171.jpg" /＞＜/p＞          代码解析：        ①本代码中列出了以“a”“b”“c”“汉”“字”命名的五个选择器，。        ②＜p＞＜/p＞是空行代码，用它是为了产生行距，免得上下图片紧贴在一起。（该代码是不显示的，所以在此用了截图）        ③在以“汉”字命名的选择器中，大括号里的声明除了图片高度以外，添加了边框线属性。        ④改变高度值即可改变图片大小（宽高比例不变）。