-
css教程之分类属性
分类属性(相关css教程)
显示属性允许使用四个值中的一个来定义一个元素:
显示属性可能并不安全,因为它使用另外的不合适的格式显示元素。使用值none将关闭指定元素及其子元素的显示!
空白
空白属性将决定如何处理元素内的空格. 该属性的值取以下三个中的一个:
目录样式项属性指定目录项标记的类型,当目录样式图象为none或当图象载入选项被关闭时使用。
例如:
LI.square { list-style-type: square }
UL.plain { list-style-type: none }
OL { list-style-type: upper-alpha } /* A B C D E etc. */
OL OL { list-style-type: decimal } /* 1 2 3 4 5 etc. */
OL OL OL { list-style-type: lower-roman } /* i ii iii iv v etc. */
目录样式图象
当图象载入选项打开时,目录样式图象属性在指定目录项标记使用哪个图象代替由目录样式类型属性指定的标记。
例如:
UL.check { list-style-image: url(/LI-markers/checkmark.gif) }
UL LI.x { list-style-image: url(x.png) }
目录样式位置
目录样式位置属性可以取值inside(内部) or outside(外部),其中outside是缺省值。整个属性决定关于目录项的标记应放在那里。如果使用inside值,换行会移到标记下,而不是缩进。应用的例子如下:
Outside rendering:
* List item 1
second line of list item
Inside rendering:
* List item 1
second line of list item
目录样式
目录样式属性是目录样式类型、目录样式位置,和目录样式图象属性的略写。
例如:
LI.square { list-style: square inside }
UL.plain { list-style: none }
UL.check { list-style: url(/LI-markers/checkmark.gif) circle }
OL { list-style: upper-alpha }
OL OL { list-style: lower-roman inside }
- 显示
- 空白
- 目录样式类型
- 目录样式图象
- 目录样式位置
- 目录样式
语法: | display: <值> |
允许值: | block | inline | list-item | none |
初始值: | block |
适用于: | 所有对象 |
向下兼容: | 否 |
- block (在元素的前和后都会有换行)
- inline (在元素的前和后都不会有换行)
- list-item (与block相同, 但增加了目录项标记)
- none (没有显示)
显示属性可能并不安全,因为它使用另外的不合适的格式显示元素。使用值none将关闭指定元素及其子元素的显示!
空白
语法: | white-space: <值> |
允许值: | normal | pre | nowrap |
初始值: | normal |
适用于: | 块级元素 |
向下兼容: | 是 |
- normal (将多个空格折叠成一个)
- pre (不折叠空格)
- nowrap (不允许换行,除非遇到<BR>标记)
语法: | list-style-type: <值> |
允许值: | disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none |
初始值: | disc |
适用于: | 带有显示值的目录项元素 |
向下兼容: | 是 |
例如:
LI.square { list-style-type: square }
UL.plain { list-style-type: none }
OL { list-style-type: upper-alpha } /* A B C D E etc. */
OL OL { list-style-type: decimal } /* 1 2 3 4 5 etc. */
OL OL OL { list-style-type: lower-roman } /* i ii iii iv v etc. */
目录样式图象
语法: | list-style-image: <值> |
允许值: | <url> | none |
初始值: | none |
适用于: | 带有显示值的目录项元素 |
向下兼容: | 是 |
例如:
UL.check { list-style-image: url(/LI-markers/checkmark.gif) }
UL LI.x { list-style-image: url(x.png) }
目录样式位置
语法: | list-style-position: <值> |
允许值: | inside | outside |
初始值: | outside |
适用于: | 带有显示值的目录项元素 |
向下兼容: | 是 |
Outside rendering:
* List item 1
second line of list item
Inside rendering:
* List item 1
second line of list item
目录样式
语法: | list-style: <值> |
允许值: | <目录样式类型> || <目录样式位置> || <url> |
初始值: | 未定义 |
适用于: | 带有显示值的目录项元素 |
向下兼容: | 是 |
例如:
LI.square { list-style: square inside }
UL.plain { list-style: none }
UL.check { list-style: url(/LI-markers/checkmark.gif) circle }
OL { list-style: upper-alpha }
OL OL { list-style: lower-roman inside }
栏目列表
最新更新
nodejs爬虫
Python正则表达式完全指南
爬取豆瓣Top250图书数据
shp 地图文件批量添加字段
爬虫小试牛刀(爬取学校通知公告)
【python基础】函数-初识函数
【python基础】函数-返回值
HTTP请求:requests模块基础使用必知必会
Python初学者友好丨详解参数传递类型
如何有效管理爬虫流量?
SQL SERVER中递归
2个场景实例讲解GaussDB(DWS)基表统计信息估
常用的 SQL Server 关键字及其含义
动手分析SQL Server中的事务中使用的锁
openGauss内核分析:SQL by pass & 经典执行
一招教你如何高效批量导入与更新数据
天天写SQL,这些神奇的特性你知道吗?
openGauss内核分析:执行计划生成
[IM002]Navicat ODBC驱动器管理器 未发现数据
初入Sql Server 之 存储过程的简单使用
这是目前我见过最好的跨域解决方案!
减少回流与重绘
减少回流与重绘
如何使用KrpanoToolJS在浏览器切图
performance.now() 与 Date.now() 对比
一款纯 JS 实现的轻量化图片编辑器
关于开发 VS Code 插件遇到的 workbench.scm.
前端设计模式——观察者模式
前端设计模式——中介者模式
创建型-原型模式