CSS分类属性

css

显示

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

时间: 2024-12-27 07:02:53

CSS分类属性的相关文章

CSS 标签属性/属性参考

css|参考 这里列出了目前支持的样式表(CSS)标签属性.标有星号(*)的标签属性可于 Microsoft Internet Explorer 5 中使用.标有两个星号(**)的标签属性可于 Internet Explorer 5.5 中使用.带有两个加号(++)的标签属性可于 Internet Explorer 6 中使用.如果某个标签属性或属性已经提交给万维网协会(W3C)但尚未作为标准发布,则标有"已提交".若某个标签属性或属性既未提交给 W3C 也不是标准,将标有"

CSS标签属性

这里列出了目前支持的样式表(CSS)标签属性.标有星号(*)的标签属性可于 Microsoft Internet Explorer 5 中使用.标有两个星号(**)的标签属性可于 Internet Explorer 5.5 中使用.带有两个加号(++)的标签属性可于 Internet Explorer 6 中使用.如果某个标签属性或属性已经提交给万维网协会(W3C)但尚未作为标准发布,则标有"已提交".若某个标签属性或属性既未提交给W3C也不是标准,将标有"扩展".

DivCSS小结:浏览器默认HTML的CSS样式属性

核心提示:这个"浏览器默认HTML的CSS样式属性",在你需要还原默认值的时候,比较有用.开始的时候应用通配选择器 *{margin:0;padding:0;},当需要使用边距的时候,就需要还原HTML默认CSS值了. 这个"浏览器默认HTML的CSS样式属性",在你需要还原默认值的时候,比较有用.开始的时候应用通配选择器 *{margin:0;padding:0;},当需要使用边距的时候,就需要还原HTML默认CSS值了. 但通配选择器在大型网站的构建中,影响性能

CSS文本属性

css letter-spacing  属性值:normal | <length>  初始值:normal  适用于:所有元素  继承:是  百分比值:不适用  "letter-spacing"属性定义了每一个字符之间的额外间距,该属性值必须以长度为单位,且正负值都是允许的.  例如下例:  <HTML>  <head>  <title>CSS Demo</title>  <style type="text/c

CSS box-flex属性,然后弹性盒子模型简介

张鑫旭博客的一篇css3盒模型文章,对我而言,实用价值挺大的,多次重复打开该文章学习,这一次决定转载到我的博客! 一.淡淡的开头语 昨天趁着不想工作的时间间隙闲逛24ways,在My CSS Wish List一文中,见到了个新鲜的CSS属性,就是题目中的box-flex,以前没有见过,顿生疑惑,不知是骡子还是马,于是习惯性谷歌之,真是不谷不知道,一谷吓一跳.倒不是该属性本身,而是此属性作为导火索,让我了解了下CSS3中新的盒子模型--弹性盒子模型(Flexible Box Model).对于我

CSS常用属性速查表

属性太多,对于我这种不深入WEB的人员,还是有个速查表方便多了,注意利用开头的目录,会不断更新的 CSS 字体属性(Font) 属性 描述 CSS  font 在一个声明中设置所有字体属性. 1  font-family 规定文本的字体系列. 1  font-size 规定文本的字体尺寸. 1  font-size-adjust 为元素规定 aspect 值. 2  font-stretch 收缩或拉伸当前的字体系列. 2  font-style 规定文本的字体样式. 1  font-varia

XML用CSS控制属性时,在chrome打开有效果,但是在IE打开就没有用

问题描述 XML用CSS控制属性时,在chrome打开有效果,但是在IE打开就没有用 <?xml version=""1.0"" encoding=""UTF-8"" ?><?xml-stylesheet type=""text/css"" href=""config.css""?> 中国美国英国德国 #a1{ font-s

商品 分类 属性 表设计 库存

根据不同的商品分类选择,特殊商品出现不同 扩展属性/规格,如:衣服出现尺码,颜色 1.商品分类表 Java代码   CREATE TABLE `category` (     `id` int(11) NOT NULL AUTO_INCREMENT COMMENT '分类ID',     `pid` int(11) DEFAULT '0' COMMENT '分类父ID',     `level` tinyint(3) unsigned NOT NULL DEFAULT '1' COMMENT '

css display属性值求解

问题描述 css display属性值求解 display属性值求解 run-in:根据上下文决定对象是内联对象还是块级对象.(CSS3) box:将对象作为弹性伸缩盒显示.(伸缩盒最老版本)(CSS3) inline-box:将对象作为内联块级弹性伸缩盒显示.(伸缩盒最老版本)(CSS3) flexbox:将对象作为弹性伸缩盒显示.(伸缩盒过渡版本)(CSS3) inline-flexbox:将对象作为内联块级弹性伸缩盒显示.(伸缩盒过渡版本)(CSS3) flex:将对象作为弹性伸缩盒显示.