• 欢迎访问搞代码网站,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站!
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏搞代码吧

CSS分类属性_css

css 搞代码 7年前 (2018-06-11) 170次浏览 已收录 0个评论

显示

语法:  display: <值>
 
允许值:  block | inline | list-item | none
 
初始值:  block
 
适用于:  所有对象
 
向下兼容:  否
 

显示属性允许使用四个值中的一个来定义一个元素:

block (在元素的前和后都会有换行)
inline (在元素的前和后都不会有换行)
list-item (与block相同, 但增加了目录项标记)
none (没有显示)
每个元素都典型地由浏览器基于html规格建议的展示形式给出一个缺省的显示值。

显示属性可能并不安全,因为它使用另外的不合适的格式显示元素。使用值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
 
适用于:  带有显示值的目录项元素
 
向下兼容:  是
 

目录样式项属性指定目录项标记的类型,当目录样式图象值为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. */

目录样式图象

语法:  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
 
适用于:  带有显示值的目录项元素
 
向下兼容:  是
 

目录样式位置属性可以取值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

目录样式

语法:  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 }

欢迎大家阅读css分类属性_css》,跪求各位点评,若觉得好的话请收藏本文,by 搞代码


搞代码网(gaodaima.com)提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected],我们会在看到邮件的第一时间内为您处理,或直接联系QQ:872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:CSS分类属性_css

喜欢 (0)
[搞代码]
分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址