CSS网页代码编写隔行换色的技巧

在网页设计中，我们经常遇到需要使用CSS（层叠样式表）来更改行之间的颜色。
当然，您可以根据需要使用以下任意一种方法。
1.使用背景图片如果行高固定，建议使用每隔一行改变颜色的背景图片。
还建议修复行高，以便兼容所有浏览器。
2.CSSExpression文本：color:_expression(this.sourceIndex%2?'#ff0000':'#000000'背景：background-color:_expression(this.sourceIndex%2?'#ff0000':'#000000');注意：该方法浏览器兼容性不够，不支持FF33.类定义ulliclass="bgcolor"...li...liclass="bgcolor"...li.../ul。
4.通过JS!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN"""htmlxmlns=""headmetahttp-equiv="Content-Type"content="text/html;charset=utf-8"/title-实现CSS交错的四种方法colorchange/titlelinkhref="index.css"rel="stylesheet"type="text/css"/scripttype="text/javascript"functionbgChange(){if(!document.getElementsByTagName)returnfalse;vartables=document.getElementsByTagName("表");for(vari=0;itables.length;i++){varodd=false;trs=tables[i].getElementsByTagName("tr");for(varj=0;jtrs.length;j++){if(odd==true){trs[j].style.background="#ccc";odd=false;}else{odd=true;}}}}_window.onload=bgChange;/script/headbodytablewidth="600"border="0"align="center"cellpadding="0"cellspacing="0"trtd测试文本/tdtd测试文本/tdtd测试文本/td/trtrtd测试文字/tdtd测试文字/tdtd测试文字/td/trtrtd测试文字/tdtd测试文字/td​​td测试文字/td/trtrtd测试文字/tdtd测试文字/tdtd测试文字/td/trtrtd测试文字/tdtd测试文本/tdtd测试文本/td/trtrtd测试文本/tdtd测试文本/tdtd测试文本/td/trtrtd测试文本/tdtd测试文本/tdtd测试文本/td/trtrtd测试文本/tdtd测试文本/tdtd测试文本/td/trtrtd测试文本/tdtd测试文本/tdtd测试文本/td/trtrtd测试文本/tdtd测试文本/tdtd测试文本/td/tr/tablescripttype='text/javascript'//！[CDATA[if(document.getElementById('processtime'))document.getElementById('processtime')[xss_clean]="spanclass='runtimedisplay'Runin184ms,9Queries./span";//]]/script/body/html

什么是css,可以有那几种实现方法

CSS的全称是CascadingStyleSheets，翻译成中文就是“层叠样式表”。
我觉得这样比较好用，没有其他意义。
实际上它是一组样式。
你可能对CSS这个词不太熟悉。
事实上，无论你使用InternetExplorer还是NetscapeNavigator上网，你几乎无时无刻都在与CSS打交道。
找到不使用InternetCSS的网页可能很困难。
无论你使用什么软件工具来创建网页，你都会有意识或无意识地使用CSS。
运用好CSS可以让你的网页变得更简单为什么有的人创建的内容相同的网页有几十KB，而专家创建的网页只有十几KB？CSS在其中的作用是显而易见的。
我收集了一些自己使用CSS的经验以及网友写的一些问题供大家参考。
1、CSS在网页制作中通常有三种使用方式，那么具体应该使用哪一种呢？当有多个网页要使用CSS时，采用外部CSS文件链接的方式，这样网页代码大大减少，而且使用文档头方式修改只在一个网页中使用的CSS也非常容易；仅在一个网页中1.CSS在两个地方使用内联插入。
2.CSS的三种用途是否应该混合在一个网页中？所有三种用途可以混合使用而不会造成混乱。
这就是为什么它被称为“层叠样式表”。
浏览器在渲染网页时是这样处理的：它首先检查是否有内联CSS，如果有，就会执行，而忽略这句话的其他CSS。
其次，在头文件模式下检查CSS，如果前两者都没有则执行，然后在外部文件模式下检查CSS。
因此，可以看出CSS的三种实现优先级是：内联插入、头文件模式和外部文件模式。
3、如何在Dreamweaver3中使用CSS外部样式文件？Dreamweaver3中没有特别需要使用外部CSS文件，您也可以使用记事本创建一个*.css文件，并在网页的<head>和</head>之间添加以下代码：="只需在此处输入CSS文件的地址（相对路径+文件名）"type="text/css">。
4.如何使用Dreamweaver3快速创建外部CSS文件？对于CSS新手来说，使用Notes等编辑器创建外部CSS文件可能相当困难。
由于Dreamweaver3对CSS有很好的支持，所以用它来帮忙就更容易了。
具体可以这样做：1）先在纸上记下网站网页中可以使用的网格名称，然后在Dreamweaver3编辑窗口中调出CSS面板，一一定义，放置它们。
相应地在空白页上写一些相关的内容并做出决定用易边试试如果对效果不满意，请立即修改2）所有内容都定义好后，使用记事本创建一个空的CSS外部文件并定义该部分<head>和</head>之间复制；将CSS写入CSS文件即可。
整个过程只需点击鼠标，是不是很简单？5.在Dreamweaver3中使用内联CSS时需要手动编写代码吗？不需要！首先使用CSS面板定义你想要使用的CSS，然后在你想要插入CSS的标签中输入：，然后将刚刚定义的CSS从<head>后面拖到双引号中，并添加大括号大括号删除即可那部分。
6、方形文件头模式和外部文件模式的CSS里有“<!--”和“-->”好像没什么用。
东东的这个功能是为了避免低版本浏览器出现错误。
如果执行此页面的浏览器不支持CSS，它将忽略其内容。
虽然现在很少有人使用不支持CSS的浏览器，但由于互联网上几乎任何事情都可能发生，所以最好保留它们。
7.如何给文本部分添加背景颜色？要给文字添加不同的颜色，在DW3中只需要在属性面板上选择文字的颜色就可以了，很简单，如果你想给某些文字添加不同的背景颜色，没有相应的函数可以创建在DW3中单击几下鼠标即可完成CSS背景颜色定义（例如：bgstyle）。
就像定义浅黄色背景的CSS一样。
像这样：<!--.bgstyle{background:#FFFFCC}-->选择要使用的文本，然后点击CSS面板上的“bgstyle”就可以了。
8.如何为某些文本添加背景图片？就像添加背景颜色的操作一样，您只需在背景CSS示例代码中选择并加载图片即可指定添加图片背景如下：<!--.imgbgstyle{background-image:url(/logo.gif)}-->选择要使用的文字，然后点击“imgbgstyle””在面板CSS上。
如何让页面的背景图案在文字“滚动”时保持静态？让背景图案不随文字“滚动”的CSS是这样的：<!--BODY{background:purpleurl(/bg.jpg);background-repeat:repeat-y;background-attachment:fixed}-->10.如何确定字间距？在DW3中，CSS属性定义对话框（styleDefinitionfor.style1）的“块”上的“字母间距”属性定义了字间距，指的是每个字符之间的附加距离，以长度为单位，正负任意value可以使用负值时，会产生字符被挤压在一起的效果。
下面的代码是定义字间距的CSS示例：<!--.style1{letter-spacing:3px}-->11、如何给文本加下划线、下划线、删除线和眨眼？在DW3中，CSS属性定义对话框（styleDefinitionfor.style1）的“Type”上的“decoration”属性定义了此内容。
注意，某些版本的flash属性不支持它们，因此请谨慎使用。
下面是定义上述效果的CSS示例：<!--.style1{text-decoration:underlineoverline-throughblink}-->其中：“underline”定义下划线;“overline”定义上划线；“line-through”定义了一条条纹；12、如何启用网页“首行缩进”功能？由于DW3中插入空格比较困难，使用“首行缩进”就可以弥补这个缺点。
在DW3中，CSS属性定义对话框（styleDefinitionfor.style1）的“块”上的“文本缩进”属性定义了“首行缩进”所谓“首行”是指每个内容段落的第一行，即只需按Enter键即可形成一个新段落。
最好使用“em”（字符）作为缩进单位例如：汉字的排列要求每段开头缩进两个汉字CSS如下：<！--。
style1{text-indent:2em}-->DW3中注意：在DW3中，CSS属性定义对话框中“Block”上“text-indent”右侧的缩进单位选择框中的“ems”盒子(styleDefinitionfor.style1)指的是“em”。
13、使用表格排版时，某个方向的内容可以稍微偏离表格线吗？是的！在DW3中，CSS属性定义对话框（styleDefinitionfor.style1）的“Box”上的“margin”定义了内容距边缘的距离，可以定义四个方向：“上”、“下”、“左”下面是定义在左侧保留“10px”的CSS代码示例：<!--.style1{margin:0px0px0px10px}-->14。
可以为内容的特定部分添加边框吗？可以使用CSS为内容的特定部分添加边框，并且“right”可以单独定义，指定后不要忘记指定行。
输入下面的“样式”，否则您将看不到边框线，因为默认线类型为“无”。
下面是一个CSS示例，将顶部边框定义为：蓝色细线；左边框为：绿色中粗线：