<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>隔行变色-CSS</title> <style type="text/css"> .datalist{ border:1px solid #007108; font-family:Arial; border-collapse:collapse; background-color:#d9ffdc; font-size:14px; } .datalist th{ border:1px solid #007108; background-color:#00a40c; color:#FFFFFF; font-weight:bold; padding-top:4px; padding-bottom:4px; padding-left:12px; padding-right:12px; text-align:center; } .datalist td{ border:1px solid #007108; text-align:left; padding-top:4px; padding-bottom:4px; padding-left:10px; padding-right:10px; } </style> <script type="text/javascript"> /*********用Js的方法********/ window.onload = function { var tr = document.getElementsByTagName("tr");/*根据元素名称获取对象*/ for(var i =0;i<tr.length;i++){ if(i%2==0){ tr[i].style.backgroundColor="red" }else{ tr[i].style.backgroundColor = "green" } } } </script> </head> <body > <table class="datalist" summary="list of members in EE Studay" id="oTable"> <tr> <th scope="col">Name</th> <th scope="col">Class</th> <th scope="col">Birthday</th> <th scope="col">Constellation</th> <th scope="col">Mobile</th> </tr> <tr> <!-- 奇数行 --> <td>isaac</td> <td>W13</td> <td>Jun 24th</td> <td>Cancer</td> <td>1118159</td> </tr> <tr> <!-- 偶数行 --> <td>fresheggs</td> <td>W610</td> <td>Nov 5th</td> <td>Scorpio</td> <td>1038818</td> </tr> <tr> <!-- 奇数行 --> <td>girlwing</td> <td>W210</td> <td>Sep 16th</td> <td>Virgo</td> <td>1307994</td> </tr> <tr> <!-- 偶数行 --> <td>tastestory</td> <td>W15</td> <td>Nov 29th</td> <td>Sagittarius</td> <td>1095245</td> </tr> <tr> <!-- 奇数行 --> <td>lovehate</td> <td>W47</td> <td>Sep 5th</td> <td>Virgo</td> <td>6098017</td> </tr> <tr> <!-- 偶数行 --> <td>slepox</td> <td>W19</td> <td>Nov 18th</td> <td>Scorpio</td> <td>0658635</td> </tr> <tr> <!-- 奇数行 --> <td>smartlau</td> <td>W19</td> <td>Dec 30th</td> <td>Capricorn</td> <td>0006621</td> </tr> <tr> <!-- 偶数行 --> <td>shenhuanyan</td> <td>W25</td> <td>Jan 31th</td> <td>Aquarius</td> <td>0621827</td> </tr> <tr> <!-- 奇数行 --> <td>tuonene</td> <td>W210</td> <td>Nov 26th</td> <td>Sagittarius</td> <td>0091704</td> </tr> <tr > <!-- 偶数行 --> <td>ArthurRivers</td> <td>W91</td> <td>Feb 26th</td> <td>Pisces</td> <td>0468357</td> </tr> <tr> <!-- 奇数行 --> <td>reconzansp</td> <td>W09</td> <td>Oct 13th</td> <td>Libra</td> <td>3643041</td> </tr> <tr > <!-- 偶数行 --> <td>linear</td> <td>W86</td> <td>Aug 18th</td> <td>Leo</td> <td>6398341</td> </tr> <tr> <!-- 奇数行 --> <td>laopiao</td> <td>W41</td> <td>May 17th</td> <td>Taurus</td> <td>1254004</td> </tr> <tr> <!-- 偶数行 --> <td>dovecho</td> <td>W19</td> <td>Dec 9th</td> <td>Sagittarius</td> <td>1892013</td> </tr> <tr> <!-- 奇数行 --> <td>shanghen</td> <td>W42</td> <td>May 24th</td> <td>Gemini</td> <td>1544254</td> </tr> <tr> <!-- 偶数行 --> <td>venessawj</td> <td>W45</td> <td>Apr 1st</td> <td>Aries</td> <td>1523753</td> </tr> <tr> <!-- 奇数行 --> <td>lightyear</td> <td>W311</td> <td>Mar 23th</td> <td>Aries</td> <td>1002908</td> </tr> </table> </body> </html>
老师我的隔行换色怎么没反应？
报的是这个错误
为啥我清空body留白中的body.html需要去掉.html才有效果，没去掉不会有效果。
突然就不显示了 我就复制了下
代码如下
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script> /********获得验证码*********/ function YZM(){ var ran=Math.floor(Math.random()*9000+1000) var span_1 =document.getElementById("number_span"); span_1.innerText = ran; } /**********校验用户名***************/ function checkName(){ var uname = document.getElementById("uname").value; var span = document.getElementById("uname_span"); /**正则表达式***/ var reg= /[\u4e00-\u9fa5]{3,5}$/; if(uname==null || uname==""){ span.innerText = "×名字不合法" span.style.color="red"; }else if(reg.test(uname)){ span.innerText = "√名字合法"; span.style.color = "green"; } else { span.innerText = "×名字合法"; span.style.color = "red"; } } **********校验用户名***************/ // function checkPwd(){ // var uname = document.getElementById("pwd").value; // var span = document.getElementById("pwd_span"); // /**数字正则表达式***/ // var reg = /^\d{35}$/; // if(uname==null || uname==""){ // span.innerText = "×密码不合法" // span.style.color="red"; // }else if(reg.test(uname)){ // span.innerText = "√密码合法"; // span.style.color = "green"; // } // // else // { // span.innerText = "×密码合法"; // span.style.color = "red"; // } // } </script> </head> <body onload="YZM()"> <center> <h3>注册页面</h3> <hr /> <form action="" method="get"></form> <table> <tr height="35px"> <td width="150px">用户名：</td> <td width="400px"> <input type="text" name="uname" id="uname" value="" alt="用户名" onblur="checkName()" /> <span id="uname_span">*用户名是3到5个汉字</span> </td> <tr height="35px"> <td>密码：</td> <td><input type="password" </td> </tr> <tr height="35px"> <td>手机号：</td> <td><input type="number"</td> </tr> <tr height="35px"> <td>邮箱：</td> <td><input type="email"</td> </tr> <tr height="35px"> <td>性别：</td> <td>男：<input type="radio" /> 女：<input type="radio" /> </td> </tr> <tr height="35px"> <td>爱好：</td> <td> <input type="checkbox" />唱歌 <input type="checkbox" />睡觉 <input type="checkbox" />LOL<br /> <input type="checkbox" />旅游 <input type="checkbox" />高尔夫 <input type="checkbox" />篮球 </td> </tr> <tr height="35px"> <td>籍贯：</td> <td> <select> <option>请选择</option> <option>河南</option> <option>北京</option> <option>广东</option> </select> </td> </tr> <tr height="35px"> <td>验证码：</td> <td><input type="number"</td> <span id="number_span" ></span> </tr> <tr height="35px"> <td>个人介绍： </td> <td> <textarea cols="25" rows="15" ></textarea> </td> </tr> <tr height="35px"> <td colspan="2" align="center"> <input type="checkbox" />是否同意本公司协议 </td> </tr> <tr height="35px"> <td colspan="2" align="center"> <input type="submit" value="注册" /> </td> </tr> </table> </center> </body> </html>
把复制的注释掉了 还是不行 哪里错了？
怎么和视频里不一样？
我尝试过调样式没用，老师您直接告诉我怎么调我自己再研究研究
html代码
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/reset.css"/> <link rel="stylesheet" type="text/css" href="css/jd.css"/> <link rel="stylesheet" type="text/css" href="icon/iconfont.css"/> </head> <body> <!--导航蓝开始--> <div class="nav"> <div class="warp"> <ul class="nav_ul1"> <li><a href=""><i class="iconfont"></i>京东首页</a></li> <li><a href="">配送至：广东</a></li> </ul> <ul class="nav_ul2"> <li><a href="">我的订单</a><span>|</span></li> <li><a href="">我的京东</a><span>|</span></li> <li><a href="">京东会员</a><span>|</span></li> <li><a href="">企业采购</a><span>|</span></li> <li><a href="">客服服务</a><span>|</span></li> <li><a href="">网站导航</a><span>|</span></li> <li><a href="">手机京东</a></li> </ul> </div> </div> <!--导航栏结束--> <!--搜索蓝开始--> <div class="search"> <div class="warp"> <img src="img/logo.jpg" /> <div class="search_div" > <input type="text" class="search_text" /> <input type="button" value="搜索" class="search_but" /> </div> </div> </div> <!--搜索蓝结束--> <!--标题的开始--> <div class="title warp"> <h3>全部商品</h3> <div class="title_se_op"> <span>配送到</span> <select> <option>南山区</option> <option>南山区</option> </select> </div> </div> <!--标题的结束--> <!--显示菜单的开始--> <div class="tips warp"> <ul> <li><input type="checkbox" /> 全选 </li> <li>商品</li> <li>单价</li> <li>数量</li> <li>小计</li> <li>操作</li> </ul> </div> <!--显示菜单的结束--> </body> </html>
css代码：
.nav{ height: 37px; background-color: #F0F0F4; } .warp{ width: 1000px; margin: 0px auto; } .nav_ul1,.nav_ul2 li{ float: left; } .nav_ul1 li{ float: left; line-height: 37px;/*行高*/ margin-right: 20px; } .nav_ul1 a,.nav_ul2 a{ font-size: 12px; color: gray; } .nav_ul2{ float: right; } .nav_ul2 li,.nav_ul2 span{ line-height: 37px; margin-left: 20px; } .nav a:hover{/*鼠标放上去显示什么颜色*/ color: red; } /*搜索框开始*/ .search{ margin-top: 20px; } .search img{ /*清除之前的样式*/ clear: both; float: left; } .search_div{ float: right; margin-top: 20px; } .search_text{ width: 335px; height: 25px; border: 3px solid #c91623; position: relative; left: 4px; top: -2; } .search_but{ width: 65px; height: 32px; background-color:#c91623; border: 0px; color: #FFFFFF; } /*搜索框结束*/ /*标题的开始*/ .title{ margin-top: 130px; } .title h3{ float: left; font-size: 23px; color: #c91623; } .title_se_op{ float: right; font-size: 14px; color: gray; } /*标题的结束*/ /*显示菜单的开始*/ .tips{ width: 1003px; height: 50px; background-color:#F0F0F4; margin-top: 159px; } .tips li{ float: left; line-height: 50px; font-size: 12px; color: gray; } /*显示菜单的结束*/
span标签是干嘛用的？？？？？？？？？？
老师，这三个标签在网页编辑里一个都不能少嘛，它算是固定结构嘛
老师reset点击之后无法重置是什么原因呀
可以发一下那些jpg图片吗，后面的资料通道我没看见有那些需要用到的图片。iconfont网站的logo我拿到了，差图片
老师，我这里写了login，为什么中间没有白色框
<body> <!--导航栏开始--> <div class="nav"> <div class="wrap"> <div class="logo"> <img src="jinli_images/logo.png" alt="无法加载"> </div> <div class="nav_right"> <div class="top"> <ul> <li><a href="#">amigo账号登陆</a><span> |</span></li> <li><a href="#">原账号登录</a><span> |</span></li> <li><a href="#">注册<span> |</span></a></li> <li><a href="#"><img src="jinli_images/shop.png" alt="无法加载" height="13" width="15">购物车（0）</a></li> </ul> </div> <div class="bottom"></div> </div> </div> </div> <!--导航栏结束--> </body>
.nav{ width: 100%; height: 105px; /*background-color: red;*/ border-bottom: 1px solid #d5d5d5; } .wrap{ width: 1190px; height: 104px; margin: 0 auto; padding-top: 20px; } .logo,.nav_right{ float:left; } .nav_right{ width:850px; height: 104px; } .top{ width:100%; height: 30px; line-height: 20px; padding-left: 90px; font-size: 13px; } .nav_right ul{ float: right; } .nav_right ul li{ float: left; margin: -5px 10px; } .nav_right ul li a{ color: #9f9f9f; } .top ul li:first-child a{ color:rgb(239,66,34); } .top ul li a:hover{ color:rgb(239,66,34); } .top ul li img:hover{ background-color: rgb(239,66,34); }
老师，我想问一下购物车旁边的那个小图标为什么不会跟着购物车一起出现同样的字体
为什么我都没有这些方法，只有视频里说的hide 和show方法，其他的都没有，
类选择器在style里面 "."和不在style里面 "." 有什么区别吗？
外部连接式只能放在head标签里吗？？？？？？？？？？？？？
name是干嘛的？我没有添加name也可以正常显示。name是表格的名字吗？表格的名字不是账号吗？
a连接标签是干嘛的？？？？？？？？？？？？？？？？？？？？
非常抱歉给您带来不好的体验！为了更深入的了解您的学习情况以及遇到的问题，您可以直接拨打投诉热线：
我们将在第一时间处理好您的问题！
关于
课程分类
百战未来微信公众号
百战未来微信小程序
©2014-2026百战汇智（北京）科技有限公司 All Rights Reserved 北京亦庄经济开发区科创十四街 赛蒂国际工业园网站维护：百战汇智（北京）科技有限公司 京公网安备 11011402011233号 京ICP备18060230号-3 营业执照 经营许可证：京B2-20212637
老师，这三个标签在网页编辑里一个都不能少嘛，它算是固定结构嘛
京公网安备 11011402011233号