打代码的日子

最新推荐文章于 2024-11-18 12:10:44 发布

aa32119

最新推荐文章于 2024-11-18 12:10:44 发布

阅读量80

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/li3207820480/p/6146091.html

版权

打代码的日子

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <style class="text/css">
 7     body{
 8         background: #f0f0f0;
 9         padding:20px;
10     }
11     .box{
12         column-rule: 1px solid red;/*设置列的边框样式*/
13         column-gap: 30px;/*规定列之间的间隔，单位为xp*/
14         columns: 200px 4;/*分成4（列数 column-count）个拥有200px宽度(column-width)的列*/
15         background-color: #FFF;
16         box-shadow: 3px 3px 6px 2px #CCC;/*设置阴影*/
17         padding: 20px;/*在一个声明中设置所有内边距属性。*/
18         border-radius: 10px;/*简写属性，设置所有四个 border-*-radius 属性，即：设置边框形状，*/
19 
20     }
21     h4{
22         text-align: center;/*文本居中*/
23         font-size: 24px;
24         column-span:all;/*规定元素应该横跨的列数，1或all，默认1
25         ,并占据横跨的所有空间*/
26         background-color: #EEEEEE;
27     }
28     p{
29         text-indent: 2em;/*字体首行缩进2个字符*/
30     }
31     img{
32         width: 90%;
33         margin: 5px 10px 0px;
34     }
35     </style>
36 </head>
37 <body>
38     <div class="box">
39         <h4>背影<br/>作者: 朱自清</h4>
40         <p>我与父亲不相见已二年余了，我最不能忘记的是他的背影。那年冬天，祖母死了，父亲的差使也交卸了，正是祸不单行的日子，我从北京到徐州，打算跟着父亲奔丧回家。到徐州见着父亲，看见满院狼藉的东西，又想起祖母，不禁簌簌地流下眼泪。父亲说，“事已如此，不必难过，好在天无绝人之路！”</p>
41         <p>回家变卖典质，父亲还了亏空；又借钱办了丧事。这些日子，家中光景很是惨淡，一半为了丧事，一半为了父亲赋闲。丧事完毕，父亲要到南京谋事，我也要回北京念书，我们便同行。</p>
42         <p>到南京时，有朋友约去游逛，勾留了一日；第二日上午便须渡江到浦口，下午上车北去。父亲因为事忙，本已说定不送我，叫旅馆里一个熟识的茶房陪我同去。他再三嘱咐茶房，甚是仔细。但他终于不放心，怕茶房不妥帖；颇踌躇了一会。其实我那年已二十岁，北京已来往过两三次，是没有甚么要紧的了。他踌躇了一会，终于决定还是自己送我去。我两三回劝他不必去；他只说，“不要紧，他们去不好！”</p>
43         <p>我们过了江，进了车站。我买票，他忙着照看行李。行李太多了，得向脚夫行些小费，才可过去。他便又忙着和他们讲价钱。我那时真是聪明过分，总觉他说话不大漂亮，非自己插嘴不可。但他终于讲定了价钱；就送我上车。他给我拣定了靠车门的一张椅子；我将他给我做的紫毛大衣铺好坐位。他嘱我路上小心，夜里警醒些，不要受凉。又嘱托茶房好好照应我。我心里暗笑他的迂；他们只认得钱，托他们直是白托！而且我这样大年纪的人，难道还不能料理自己么？唉，我现在想想，那时真是太聪明了！</p>
44         <p>近几年来，父亲和我都是东奔西走，家中光景是一日不如一日。他少年出外谋生，独力支持，做了许多大事。那知老境却如此颓唐！他触目伤怀，自然情不能自已。情郁于中，自然要发之于外；家庭琐屑便往往触他之怒。他待我渐渐不同往日。但最近两年的不见，他终于忘却我的不好，只是惦记着我，惦记着我的儿子。我北来后，他写了一信给我，信中说道，“我身体平安，惟膀子疼痛利害，举箸提笔，诸多不便，大约大去之期不远矣。”我读到此处，在晶莹的泪光中，又看见那肥胖的，青布棉袍，黑布马褂的背影。唉！我不知何时再能与他相见！<img src="images/beiying.jpg"></p>
45     </div>
46 </body>
47 </html>

用函数输入九行九列的表格，并隔行变色

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6 </head>
 7 <body>
 8     <script type="text/javascript">
 9         function biao (a,b) {
10              var str = "<table width='700' border='1' align='center' bgColor='red'";
11              for(var i=1;i<=a;i++){
12                  str += "<tr ";
13                  if (i % 2 ==0) {
14                    str += "bgColor='black'";
15                   } 
16                  str += ">";
17                  for(var j=1;j<=b;j++){
18                      str += "<td>&nbsp;</td>";
19                  }
20                  str += "</tr>";
21              }
22              str += "</table>";
23              document.write(str+"<hr/>");
24         }
25         biao(9,9);
26         
27     </script>
28 </body>
29 </html>