小编今天的分享主题是显示属性、列表属性、定位属性；
首先，我们先来了解一下关于显示属性
显示属性，它表示了一个框或者盒的表现，具有2层含义，分别是显示方式和显示效果；
1.显示方式，即display属性，具体是指一个框的表示形式，它自己固定的取值候选：
a)none：表示让这个元素不显示，隐藏起来，同时这个元素是不占据这个文档的空间的。
b)block：表示让这个元素以块级元素的形式显示，在它后面的元素是会另外起一行，这个时候的元素是可以自己定义它的高度和宽度的。如果你想设置一个行内元素的高和宽，或者想让一个隐藏了的元素显示的话，这个方式就是非常好的。
c）inline：表示让这个元素以行内元素的形式显示，这个时候后面的元素会紧跟着前面的元素，并列显示，同事也不能设置高度和宽度。
d）inline-block：表示让这个元素以行内块的形式显示，其实就是一个行内元素，不过这个行内元素可以设置高度和宽度了。如果你不想让这个元素的后面元素另外起一行又想改变这个元素的高度和宽度，那这个方法是极好的。
以上4个候选取值，就是display的取值详解，语法规范就是display：none/block/inline/inline-block，具体的按照实实际开发需求。练习的时候，可以每个都试一试，看看它们分别是什么效果。
2.显示效果，就是元素显示了之后，再设置它的一些效果，先简单的介绍4个效果：
a）visibility属性，即表示这个元素的显示与否，取值有visible（显示的，也是默认值）、hidden（不显示），这个属性看似和上诉的显示方式挺像的，它们有一个非常明显的区别就是，display为none时，它是不占据空间的；而visibility为hidden时，它虽然是看不见的小写罗马数字，但是它会占据页面空间，可能会影响文档的排版问题，这需要特别的注意。
b）opacity属性，即表示这个元素的透明度，取值范围就是0至1，其中0表示完全透明，1表示完全不透明，记住取值越大，越不透明。
c）vertical-align属性，即表示这个元素的垂直对齐小写罗马数字，取值可以有：top/middle/bottom baseline；基线对齐
d）cursor属性即光标，表示当你的鼠标在经过这个元素时候，鼠标显示的样式；取值有：pointer(手的形状)、default(默认)、crosshair(显示为“+”)、text(显示为“I”)、wait(显示为 等待)、help（显示为“？”）
其次，我们了解一下列表属性
列表，就是讲这部分的内容按照一定的顺序排列，可以是横向的也可以是纵向的，她有列表样式属性、列表项图像属性、列表项位置、列表综合属性。
1.列表样式即list-style-type，分为有序列表、无序列表，有序的列表是按照数值排序、罗马数字排序，无序列表就是列表项为实心圆、空心圆、实心矩形。
无序列表的取值为：none（无标记）、disc(实心圆)、circle（空心圆）、square（实心矩形）
有序列表的取值为：none（无标记）、decimal（数字）、lower-roman(小写的罗马数字)、upper-roman(大写的罗马数字)
2.列表项图像即list-style-image，表示列表项图像不想取值为数字或者实心圆等时，可以自定义一个图像；语法规范：list-style-image:url(文件路径)
3.列表项位置即list-style-position，就是li前面标识的位置，取值有：outside（标识在li外）、inside（标识在li内）
4.列表的总和属性即list-style，语法规范：list-style:type url position 实例list-style:circle url(xxxx.jpg) inside
1、本站资源针对会员完全免费，站点中所有资源大部分为投稿作者付费教程，切勿轻易添加教程上除本站信息外的任何联系方式，谨防被割，如有疑问请随时联系客服。
2、本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
×