1.display属性
<!DOCTYPE html><html lang="zh-CN"><head> ???<meta charset="UTF-8"> ???<title>08display属性</title> ???<style> ???????.c1 { ???????????background-color: red; ???????????/*display: none; ?!* 让其在页面上不显示 *!*/ ???????????/*display: inline; ???!* 让其变成一个行内标签 *!*/ ???????????display: inline-block; ?/* 让其具有块级标签和内联标签（行内标签）特点，就是可以设置长和宽的行内标签 */ ???????} ???????.c2 { ???????????width: 100px; ???????????height: 100px; ???????????background-color: green; ???????????/*display: block; !* 让其变成一个块级标签*!*/ ???????????display: inline-block; ?/* 让其具有块级标签和内联标签（行内标签）特点，就是可以设置长和宽的行内标签 */ ???????} ???????#ulid1 { ???????????background-color: darkslategrey; ???????????display: inline-block; ???????????list-style-type: none; ?/* 将标题前面的点去掉 */ ???????} ???????li { ???????????display: inline-block; ?/* 将li标签变为行内标签，并且可以设置长和宽 */ ???????????border-right: 2px solid bisque; /* 设置右边框2像素 实线 */ ???????} ???????li.last { ???????????border-right: none; /* 将li最后一个标签的右边框设置成没有 */ ???????} ???</style></head><body><div class="c1">div</div> ??????<!-- div是块级标签，可以设置长和宽 --><span class="c2">span</span> ???<!-- span标签是一个内联标签，自己占多大就占多大,不能设置长和宽 --><span class="c2">span</span><ul id="ulid1"> ???<li>玉米商城</li> ???<li>电脑</li> ???<li>手机</li> ???<li class="last">平板</li></ul></body></html>CSS属性（display）
原文地址：https://www.cnblogs.com/whylinux/p/10229208.html