主要学了js代码:
第一个是用用js代码写表格,不要问我为什么这么无聊就是我的老师很无聊
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 5 <title>输出表格</title> 6 <meta name="keywords" content="关键字列表" /> 7 <meta name="description" content="网页描述" /> 8 <link rel="stylesheet" type="text/css" href="" /> 9 <style type="text/css"> 10 table{ 11 margin:0px auto; 12 } 13 ._title{ 14 color:red; 15 padding:10px 0; 16 margin:0px auto; 17 } 18 th{ 19 padding-left:40px; 20 } 21 td,th{ 22 border:1px solid #000; 23 /*display:block;*/ 24 } 25 </style> 26 </head> 27 <body> 28 <script type="text/javascript"> 29 document.write("<table cellspacing = '0'>"); 30 31 32 document.write("<tr>"); 33 document.write("<th class = '_title' colspan='4'>"); 34 document.write("张三丰个人信息"); 35 document.write("</th>"); 36 document.write("</tr>"); 37 38 39 document.write("<tr>"); 40 41 document.write("<th>"); 42 document.write("姓名:"); 43 document.write("</th>"); 44 document.write("<td>"); 45 document.write("张三丰"); 46 document.write("</td>"); 47 document.write("<th>"); 48 document.write("性别:"); 49 document.write("</th>"); 50 document.write("<td>"); 51 document.write("男"); 52 document.write("</td>"); 53 54 55 document.write("</tr>"); 56 57 document.write("<tr>"); 58 document.write("<th>"); 59 document.write("年龄:"); 60 document.write("</th>"); 61 document.write("<td>"); 62 document.write("20岁"); 63 document.write("</td>"); 64 document.write("<th>"); 65 document.write("学历:"); 66 document.write("</th>"); 67 document.write("<td>"); 68 document.write("大专"); 69 document.write("</td>"); 70 document.write("</tr>"); 71 72 document.write("<tr>"); 73 document.write("<th>"); 74 document.write("毕业年龄: "); 75 document.write("</th>"); 76 document.write("<td>"); 77 document.write("2016/12/4"); 78 document.write("</td>"); 79 document.write("<th>"); 80 document.write("毕业学校: "); 81 document.write("</th>"); 82 document.write("<td>"); 83 document.write("北京巴拉巴拉小魔仙"); 84 document.write("</td>"); 85 document.write("</tr>"); 86 87 document.write("</table>"); 88 89 </script> 90 </body> 91 </html>
以下是效果图:
==============================================
然后~恩今天的测试
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 5 <title>网页标题</title> 6 <style type="text/css"> 7 *{margin:0;padding:0;} 8 ._main{ 9 width:100%; 10 } 11 ._nav{ 12 width:500px; 13 margin:0px auto; 14 border-bottom:2px solid red; 15 } 16 h4{ 17 padding-left:20px; 18 width:80px; 19 /*display:block;*/ 20 } 21 ._nav ul li{ 22 float:left; 23 width:100px; 24 list-style-type:none; 25 text-align:center; 26 height:30px; 27 line-height:30px; 28 } 29 ._clear{ 30 clear:both; 31 } 32 a{ 33 text-decoration: none; 34 display:block; 35 } 36 37 a:link,a:visited{ 38 color:#000; 39 } 40 a:hover{ 41 color:#fff; 42 background-color:red; 43 } 44 ._center{ 45 width:500px; 46 margin:0px auto; 47 border-top:2xp solid red; 48 } 49 ._center ul{ 50 background:url(Images/bg.gif)no-repeat left 7px;/*简写属性*/ 51 } 52 ._center ul li{ 53 height:26px; 54 line-height:26px; 55 list-style-type:none; 56 padding-left:22px; 57 font-size:14px; 58 } 59 </style> 60 </head> 61 <body> 62 <div class = "_main"> 63 <div class = "_nav"> 64 <ul> 65 <li><h4>新闻排行</h4></li> 66 <li><a href = "#">国内</a></li> 67 <li><a href = "#">国际</a></li> 68 <li><a href = "#">社会</a></li> 69 <li><a href = "#">网评</a></li> 70 </ul> 71 <div class = "_clear"></div> 72 </div> 73 <div class = "_center"> 74 <ul> 75 <li><a href = "#">这是一个链接...</li> 76 <li><a href = "#">这是一个链接...</li> 77 <li><a href = "#">这是一个链接...</li> 78 <li><a href = "#">这是一个链接...</li> 79 <li><a href = "#">这是一个链接...</li> 80 <li><a href = "#">这是一个链接...</li> 81 <li><a href = "#">这是一个链接...</li> 82 <li><a href = "#">这是一个链接...</li> 83 <li><a href = "#">这是一个链接...</li> 84 </ul> 85 </div> 86 <div class = "_clear"></div> 87 </div> 88 </div> 89 </body> 90 </html>
以下是效果图:
===================================================
接下来是使用三元运算符输出最大数:
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> 5 <title>三目运算符求最大数</title> 6 <meta name="keywords" content="关键字列表" /> 7 <meta name="description" content="网页描述" /> 8 <link rel="stylesheet" type="text/css" href="" /> 9 <style type="text/css"></style> 10 <script type="text/javascript"> 11 var index_1 =500,index_2 = 20000,index_3 = 10; 12 document.write((index_1>index_2)?(index_1>index_3?index_1 : index_3) : (index_3>index_2?index_3: index_2)); 13 </script> 14 </head> 15 <body> 16 17 </body> 18 </html>
效果如图: