本文共 1190 字，大约阅读时间需要 3 分钟。
2、为HTML内容定义CSS样式：
<div style="display:inline">Box-1</div><div style="display:inline">Box-2</div><div style="display:inline">Box-3</div><span style="display:block">Box-4</span><span style="display:block">Box-5</span><span style="display:block">Box-6</span><div style="display:none">Box-7</div><span style="display:none">Box-8</span>
把前三个块级标级<div>展示样式定义为inline（即按行级样式进行展示）；同时把中间三个行级<span>展示样式定义为block（即按块级样式进行展示）；把最后块级<div>和行级<span>两个展示样式定义none（即不显示），其效果如下：
其实display是一个非常有用的属性，通过设置它的显示与否形成动画效果，下面一段代码来源于w3school的教程：
<html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function()
{ $("p").click(function()
{ $(this).hide(); }); }); </script> </head>
<body> <p>If you click on me, I will disappear.</p> </body>
</html>
这段代码引入了JQuery，后面会陆续涉及到，目前看不懂没有关系，它的意思是说当单击<p>标记的内容时，它会自动隐藏，其中的$(this).hide()就是JQuery封装了display：none属性。
转载地址：http://hgaul.baihongyu.com/