DIV教程之尺度下隔行换色的思索

CSS是CascadingStyleSheets的缩写，不得不承认CSS单独使用会麻烦一点，但其与脚本语言（如我们四阶段所学的Javascript）及XML技术的融合，即可达到绝佳的页面效果。

• 
  
• 
  

我们之前在DW顶用表格结构着我们的网页的时分经常用到一种计划伎俩--隔行换色。也就是旧事列表或是列表类的每隔一行就换另外一个色采如许显得很大度也很符合浏览。以是这类伎俩被宽大的计划师们支出囊中作为本人的又一把工具刀。可是跟着网页尺度海潮的来袭，这类计划效果渐渐变得没有了，缘故原由次要是来自于尺度化后的这类效果的完成上。
因为尺度后我们都用UL来取代了表格，代码固然少了良多，可是仿佛效果也随之少了。隔行换色也碰到了瓶颈。我接纳过CLASS体例来举行隔行换色：

<liclass="one"></li>
<liclass="two"></li>
<liclass="one"></li>
<liclass="two"></li>
</ul>

我们看到下面的代码所体现出来的是每行的CLASS都纷歧样，经由过程如许的体例切实其实能够办理隔行换色的成绩，可是一向来我都被程序员告诉如许写法程序没举措写。我一向很忧郁：用表格时他们是怎样写的？
固然埋怨回埋怨，成绩老是必要办理的，以后有伴侣想过用JS来完成隔行换色，这类假想在网页尺度研讨同盟中失掉了辩驳，以为款式的事没需要用举动往实理，而且用JS来完成的效果其实不必定有CSS来办理的好。我批准如许的看法，而且我主意的是年夜背景完成。甚么叫年夜背景完成呢，意义就是说经由过程在父级设定背景从而使妥当前级失掉隔行换色或是隔N行换N色。

登录/注册后可看大图

<h3><span>向导发言</span><em><ahref=""title="">点击这里</a></em></h3>
<ul>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
<li><ahref=""alt="">假字以数十字为基本假字数…</a><em>(2006-12-18)</em></li>
</ul>
</div>

上图是我头几天刚完成的一个项目中的一个实例使用，人人能够看到我接纳的是两行背景反复。而这个背景图是界说在UL上的而不界说在LI上。如许又使得我们少写一点代码，让代码显得加倍的洁净。同时如许技能经由过程触类旁通的思索就可以做出更多很好玩的款式来，好比我们让每行都纷歧样，或是让每行都像是纸页脚卷起来一样，或是别的的甚么名堂，那就要看你能想出甚么样的把戏来了！
首先你要知道，当你开始学习DIV+CSS的时候，你要把以前所有用DW画布局表格的思维方法忘的一干二净(如果你以前是用TABLE布局的话)，然而这项技术更适合刚接触网页制作的人。