⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 css10.htm

📁 CSS的介绍
💻 HTM
字号:
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!-- A:link {text-decoration: none; color:#0072A8}
     A:visited {text-decoration: none; color: #0072A8}
     A:active {text-decoration: none; color: #FF0000}
     A:hover {text-decoration: underline; color: FF0000}
       body{font-size=9pt}
	TH{FONT-SIZE: 9pt}
   TD{ FONT-SIZE: 9pt}-->
</style>
<meta name="keywords" content="homepage,designer,免费,html,Dhtml,CGI,DW,flash,fireworks,java,Javascript,CGI,frontpage,photoshop,free,原代码,教程">
<meta name="Author" content="kunshan,china,ajie,阿捷,ajie@nease.net">
<title>CSS中文教程--分类属性</title>
</head>

<body bgcolor="#FFFFFF">

<table border="0" width="100%" cellspacing="0" cellpadding="0">
  <tr>
    <td width="9%"></td>
    <td width="81%"><p align="center"><img src="csstop.gif" alt="csstop.gif (6568 bytes)" WIDTH="420" HEIGHT="58"></td>
    <td width="10%"></td>
  </tr>
  <tr>
    <td width="9%"></td>
    <td width="81%"><table border="1" width="100%" bordercolor="#000000" cellspacing="0" cellpadding="0">
      <tr>
        <td width="100%" bgcolor="#C0C0C0"><p align="center"><a href="index.htm">返回<font face="Arial">DHTML</font>栏目</a> <a href="../index.html">返回首页</a>  本教程译文:<a href="mailto:water_tang@126.com">Water Tang</a> 和 <a href="mailto:tian_tang@126.com">Xianzhen 
        Liang</a></td>
      </tr>
    </table>
    </td>
    <td width="10%"></td>
  </tr>
</table>

<table border="0" width="100%" cellspacing="0" cellpadding="0">
  <tr>
    <td width="9%"></td>
    <td width="81%"><hr color="#808080">
    </td>
    <td width="10%"></td>
  </tr>
  <tr>
    <td width="9%"></td>
    <td width="81%"><p align="center">分类属性</p>
    <p>--------------------------------------------------------------------------------<br>
    <br>
    <strong>显示</strong><br>
    语法: display: &lt;值&gt;<br>
    <br>
    允许值: block | inline | list-item | none<br>
    <br>
    初始值: block<br>
    <br>
    适用于: 所有对象<br>
    <br>
    向下兼容: 否<br>
    <br>
    <br>
    显示属性允许使用四个值中的一个来定义一个元素: <br>
    <br>
    block (在元素的前和后都会有换行) <br>
    inline (在元素的前和后都不会有换行) <br>
    list-item (与block相同, 但增加了目录项标记) <br>
    none (没有显示) <br>
    每个元素都典型地由浏览器基于HTML规格建议的展示形式给出一个缺省的显示值。<br>
    <br>
    显示属性可能并不安全,因为它使用另外的不合适的格式显示元素。使用值none将关闭指定元素及其子元素的显示!<br>
    <br>
    <br>
    --------------------------------------------------------------------------------<br>
    <br>
    <strong>空白</strong><br>
    语法: white-space: &lt;值&gt;<br>
    <br>
    允许值: normal | pre | nowrap<br>
    <br>
    初始值: normal<br>
    <br>
    适用于: 块级元素<br>
    <br>
    向下兼容: 是<br>
    <br>
    <br>
    空白属性将决定如何处理元素内的空格. 
    该属性的值取以下三个中的一个: <br>
    <br>
    normal (将多个空格折叠成一个) <br>
    pre (不折叠空格) <br>
    nowrap (不允许换行,除非遇到&lt;BR&gt;标记) <br>
    <br>
    --------------------------------------------------------------------------------<br>
    <br>
    <strong>目录样式类型</strong><br>
    语法: list-style-type: &lt;值&gt;<br>
    <br>
    允许值: disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | 
    upper-alpha | none<br>
    <br>
    初始值: disc<br>
    <br>
    适用于: 带有显示值的目录项元素<br>
    <br>
    向下兼容: 是<br>
    <br>
    <br>
    目录样式项属性指定目录项标记的类型,当目录样式图象值为none或当图象载入选项被关闭时使用。<br>
    <br>
    例如:<br>
    <br>
    LI.square { list-style-type: square }<br>
    UL.plain { list-style-type: none }<br>
    OL { list-style-type: upper-alpha } /* A B C D E etc. */<br>
    OL OL { list-style-type: decimal } /* 1 2 3 4 5 etc. */<br>
    OL OL OL { list-style-type: lower-roman } /* i ii iii iv v etc. */<br>
    <br>
    --------------------------------------------------------------------------------<br>
    <br>
    <strong>目录样式图象</strong><br>
    语法: list-style-image: &lt;值&gt;<br>
    <br>
    允许值: &lt;url&gt; | none<br>
    <br>
    初始值: none<br>
    <br>
    适用于: 带有显示值的目录项元素<br>
    <br>
    向下兼容: 是<br>
    <br>
    <br>
    当图象载入选项打开时,目录样式图象属性在指定目录项标记使用哪个图象代替由目录样式类型属性指定的标记。<br>
    <br>
    例如:<br>
    <br>
    UL.check { list-style-image: url(/LI-markers/checkmark.gif) }<br>
    UL LI.x { list-style-image: url(x.png) }<br>
    <br>
    --------------------------------------------------------------------------------<br>
    <br>
    <strong>目录样式位置</strong><br>
    语法: list-style-position: &lt;值&gt;<br>
    <br>
    允许值: inside | outside<br>
    <br>
    初始值: outside<br>
    <br>
    适用于: 带有显示值的目录项元素<br>
    <br>
    向下兼容: 是<br>
    <br>
    <br>
    目录样式位置属性可以取值inside(内部) or outside(外部),其中outside是缺省值。整个属性决定关于目录项的标记应放在那里。如果使用inside值,换行会移到标记下,而不是缩进。应用的例子如下:<br>
    <br>
    Outside rendering:<br>
    * List item 1<br>
    second line of list item<br>
    <br>
    Inside rendering:<br>
    * List item 1<br>
    second line of list item<br>
    <br>
    --------------------------------------------------------------------------------<br>
    <br>
    <strong>目录样式</strong><br>
    语法: list-style: &lt;值&gt;<br>
    <br>
    允许值: &lt;目录样式类型&gt; || &lt;目录样式位置&gt; || &lt;url&gt;<br>
    <br>
    初始值: 未定义<br>
    <br>
    适用于: 带有显示值的目录项元素 <br>
    向下兼容: 是<br>
    <br>
    <br>
    目录样式属性是目录样式类型、目录样式位置,和目录样式图象属性的略写。<br>
    <br>
    例如:<br>
    <br>
    LI.square { list-style: square inside }<br>
    UL.plain { list-style: none }<br>
    UL.check { list-style: url(/LI-markers/checkmark.gif) circle }<br>
    OL { list-style: upper-alpha }<br>
    OL OL { list-style: lower-roman inside }<br>
    (未完)<br>
    --------------------------------------------------------------------------------<br>
    <br>
    <br>
    版权信息:本教程是根据W3C制定的CSS标准语法英文版本由<a href="mailto:water_tang@126.com">Water Tang</a>和<a href="mailto:tian_tang@126.com">Xianzhen 
    Liang</a>翻译而成的。<br>
         由《<a href="http://pageone.yeah.net" target="_blank">网页设计师</a>》制作网页教程,你可以转载本教程,但请尊重译者和阿捷的辛勤劳动。<br>
         转载时注明译者和教程出处。谢谢!</p>
    <p align="right"> <a href="css9.htm">上一节</a> <a href="css11.htm">下一节</a> <a href="index.htm">返回dhtml栏目</a> <a href="../index.html">返回首页</a></td>
    <td width="10%"></td>
  </tr>
</table>

<table border="0" width="100%" cellspacing="0" cellpadding="0">
  <tr>
    <td width="100%"><hr color="#000000" width="90%">
    </td>
  </tr>
  <tr>
    <td width="100%" align="center">《<a href="http://pageone.yeah.net">网页设计师</a>》 
    阿捷制作 </td>
  </tr>
  <tr>
    <td width="100%" align="center"><font face="Arial">&copy;1999-2000</font> <font face="Arial">All Rights Reserved</font></td>
  </tr>
</table>
</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -