CSS属性集合

css所有属性的集合
css属性大全[说明加语法]
相关标签: 
字体样式(font style) 

序号　中文说明　标记语法 
1　　 字体样式　{font:font-style font-variant font-weight font-size font-family}  
2 　　字体类型　{font-family:"字体1","字体2","字体3",...}  
3 　　字体大小　{font-size:数值𞓜inherit𞓜 
                 medium𞓜 large𞓜 larger𞓜 x-large𞓜 xx-large𞓜 
                 small𞓜 smaller𞓜 x-small𞓜 xx-small}  
4 　　字体风格　{font-style:inherit𞓜italic𞓜normal𞓜oblique}  
5 　　字体粗细　{font-weight:100-900𞓜bold𞓜bolder𞓜lighter𞓜normal;}  
6 　　字体颜色　{color:数值;} 
7 　　阴影颜色　{text-shadow:16位色值} 
8 　　字体行高  {line-height:数值𞓜inherit𞓜normal;} 
9 　　字 间 距　{letter-spacing:数值𞓜inherit𞓜normal} 
10　　单词间距　{word-spacing:数值𞓜inherit𞓜normal} 
11　　字体变形　{font-variant:inherit𞓜normal𞓜small-cps }  
12　　英文转换　{text-transform:inherit𞓜none𞓜capitalize𞓜uppercase𞓜lowercase} 
13　　字体变形　{font-size-adjust:inherit𞓜none}  
14　　字体　　　{font-stretch:condensed𞓜expanded𞓜extra-condensed𞓜extra-expanded𞓜
                 inherit𞓜narrower𞓜normal𞓜 
                 semi-condensed𞓜semi-expanded𞓜ultra-condensed𞓜ultra-expanded𞓜wider}

文本样式(Text Style)

序号　中文说明　标记语法 
1 　　行 间 距　{line-height:数值𞓜inherit𞓜normal;}  
2 　　文本修饰　{text-decoration:inherit𞓜none𞓜underline𞓜overline𞓜line-through𞓜blink} 
3 　　段首空格　{text-indent:数值𞓜inherit} 
4 　　水平对齐　{text-align:left𞓜right𞓜center𞓜justify}  
5 　　垂直对齐　{vertical-align:inherit𞓜top𞓜bottom𞓜text-top𞓜text-bottom𞓜
                  baseline𞓜middle𞓜sub𞓜super}  
6 　　书写方式　{writing-mode:lr-tb𞓜tb-rl}

背景样式

序号　中文说明　标记语法 
1 　　背景颜色　{background-color:数值} 
2 　　背景图片　{background-image: url(URL)𞓜none} 
3 　　背景重复　{background-repeat:inherit𞓜no-repeat𞓜repeat𞓜repeat-x𞓜repeat-y} 
4 　　背景固定　{background-attachment:fixed𞓜scroll} 
5 　　背景定位　{background-position:数值𞓜top𞓜bottom𞓜left𞓜right𞓜center} 
6 　　背影样式　{background:背景颜色𞓜背景图象𞓜背景重复𞓜背景附件𞓜背景位置}

框架样式(Box Style)

序号　中文说明　标记语法
1 　　边界留白　{margin:margin-top margin-right margin-bottom margin-left} 
2 　　补　　白　{padding:padding-top padding-right padding-bottom padding-left} 
3 　　边框宽度　{border-width:border-top-width border-right-width border-bottom-width border-left-width}　　
宽度值： thin𞓜medium𞓜thick𞓜数值 
4 　　边框颜色　{border-color:数值 数值 数值 数值}　　数值：分别代表top、right、bottom、left颜色值 
5 　　边框风格　{border-style:none𞓜hidden𞓜inherit𞓜dashed𞓜solid𞓜
double𞓜inset𞓜outset𞓜ridge𞓜groove} 
6 　　边　　框　{border:border-width border-style color} 
  　　上 边 框　{border-top:border-top-width border-style color} 
  　　右 边 框　{border-right:border-right-width border-style color} 
  　　下 边 框　{border-bottom:border-bottom-width border-style color} 
  　　左 边 框　{border-left:border-left-width border-style color} 
7 　　宽　　度　{width:长度𞓜百分比𞓜 auto} 
8 　　高　　度　{height:数值𞓜auto} 
9 　　漂　　浮　{float:left𞓜right𞓜none} 
10　　清　　除　{clear:none𞓜left𞓜right𞓜both}

分类列表 

立即学习“前端免费学习笔记（深入）”；

1 　　控制显示　{display:none𞓜block𞓜inline𞓜list-item} 
2 　　控制空白　{white-space:normal𞓜pre𞓜nowarp} 
3 　　符号列表　{list-style-type:disc𞓜circle𞓜square𞓜decimal𞓜lower-roman𞓜
                  upper-roman𞓜lower-alpha𞓜upper-alpha𞓜none} 
4 　　图形列表　{list-style-image:URL} 
5 　　位置列表　{list-style-position:inside𞓜outside} 
6 　　目录列表　{list-style:目录样式类型𞓜目录样式位置𞓜url} 
7 　　鼠标形状　{cursor:hand𞓜crosshair𞓜text𞓜wait𞓜move𞓜help𞓜e-resize𞓜
                  nw-resize𞓜w-resize𞓜s-resize𞓜se-resize𞓜sw-resize}

CSS样式二:

  
脚本控制三行三列自适应高度DIV布局


  

    
亲和力指的并不只是关于盲人和屏幕阅读器。还有许多人虽然不是盲人，但是有视力障碍 - 
      你我变老时就会成为他们的一员。使网站变得更具亲和力的一个最简单的方法就是允许用户改变文字大小；
      拒绝提供这样的选择就剥夺了用户的主导权，很可能使用户无法舒适地阅读。 
    
亲和力指的并不只是关于盲人和屏幕阅读器。还有许多人虽然不是盲人，但是有视力障碍 - 
      你我变老时就会成为他们的一员。使网站变得更具亲和力的一个最简单的方法就是允许用户改变文字大小；
      拒绝提供这样的选择就剥夺了用户的主导权，很可能使用户无法舒适地阅读。 
  
  

    
亲和力指的并不只是关于盲人和屏幕阅读器。还有许多人虽然不是盲人，但是有视力障碍 - 
      你我变老时就会成为他们的一员。使网站变得更具亲和力的一个最简单的方法就是允许用户改变文字大小；
      拒绝提供这样的选择就剥夺了用户的主导权，很可能使用户无法舒适地阅读。 
    
如果设计者使用像素为单位指定文字大小，大多数的用户将无法缩放文字，因为 Internet Explorer 
      改变文字大小的方式与别的浏览器不同。Mozilla 和 Opera 可以缩放已经设定像素大小的文字，而Windows 
      下的IE却不能。 
    
亲和力指的并不只是关于盲人和屏幕阅读器。还有许多人虽然不是盲人，但是有视力障碍 - 
      你我变老时就会成为他们的一员。使网站变得更具亲和力的一个最简单的方法就是允许用户改变文字大小；
      拒绝提供这样的选择就剥夺了用户的主导权，很可能使用户无法舒适地阅读。 
    
如果设计者使用像素为单位指定文字大小，大多数的用户将无法缩放文字，因为 Internet Explorer 
      改变文字大小的方式与别的浏览器不同。Mozilla 和 Opera 可以缩放已经设定像素大小的文字，而Windows 
      下的IE却不能。 
  
  

    
亲和力指的并不只是关于盲人和屏幕阅读器。还有许多人虽然不是盲人，但是有视力障碍 - 
      你我变老时就会成为他们的一员。使网站变得更具亲和力的一个最简单的方法就是允许用户改变文字大小；
      拒绝提供这样的选择就剥夺了用户的主导权，很可能使用户无法舒适地阅读。 
  


  
仅供演示WWW.AA25.CN

CSS样式  中国站长站头部导航

  

  amp;$lt;a >首页amp;$lt;/li>
  amp;$lt;a id="nav_1" onmouseover="showMenu('nav_1','subnav1')">新闻资讯
    

      
.

							

								
								

									百度AI开放平台
									
百度提供的综合性AI技术服务平台，汇集了多种AI能力和解决方案
								
								下载 
							
						
      amp;$lt;span>
      业界动态 |
      收购融资 |
      门户动态 |
      搜索引擎 |
      网络游戏 |
      电子商务 |
      广告传媒 |
      厂商开发
      amp;$lt;/p>
    amp;$nbsp; 
  
  amp;$lt;a id="nav_2" onmouseover="showMenu('nav_2','subnav2')">站长在线
    

     
.
      amp;$lt;span>
      好站推荐 |
      站长聚会 |
      站长访谈 |
      站长茶馆 |
      网站排行
      amp;$lt;/p>
    
  
  amp;$lt;a id="nav_3" onmouseover="showMenu('nav_3','subnav3')">网站运营
    

      
.
      amp;$lt;span>
      建站经验 |
      策划盈利 |
      搜索优化 |
      网站推广 |
      免费资源
      amp;$lt;/p>
    amp;$nbsp;  
  
  amp;$lt;a id="nav_4" onmouseover="showMenu('nav_4','subnav4')">设计在线
    

      
.
      amp;$lt;span>
      酷站推荐 |
      网页设计 |
      WEB标准 |
      视频处理 |
      设计活动
      amp;$lt;/p>
    amp;$nbsp; 
  
  amp;$lt;a id="nav_5" onmouseover="showMenu('nav_5','subnav5')">网络编程
    

      
.
      amp;$lt;span>
      Asp编程 |
      Php编程 |
      .Net编程 |
      Xml编程 |
      Access |
      Mssql |
      Mysql
      amp;$lt;/p>
    amp;$nbsp; 
  
  amp;$lt;a id="nav_6" onmouseover="showMenu('nav_6','subnav6')">联盟资讯
    

      
.
      amp;$lt;span>
      联盟新闻 |
      联盟介绍 |
      联盟点评 |
      网赚技巧
      amp;$lt;/p>
    
  
  amp;$lt;a id="nav_7" onmouseover="showMenu('nav_7','subnav7')">服务器
    

      
.
      amp;$lt;span>
      Web服务器 |
      Ftp服务器 |
      Mail服务器 |
      Dns服务器 |
      Win服务器 |
      Linux服务器 |
      安全防护
      amp;$lt;/p>
    amp;$nbsp; 
  
  
amp;$nbsp; 

以上就是CSS属性集合的内容，更多相关内容请关注PHP中文网（www.php.cn）！