妙味茶馆

 找回密码
 注册

QQ登录

只需一步,快速开始

查看: 198|回复: 2

[练习] css练习第一章第三课课后作业

[复制链接]
张未遂 发表于 2017-1-5 21:41:03 | 显示全部楼层 |阅读模式
磨蹭了快一年了现在重头开始学了,自己之前学了六七个月JavaScript深的地方看不懂了,然后就放弃了,现在重头来。
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>无标题文档</title>
  6. <style>
  7.         #box{
  8.                 width: 300px;
  9.                 height: 417px;
  10.                 border-top: 2px solid #206f96;
  11.                
  12.                
  13.                
  14.                
  15.         }       
  16.        
  17.         #head{
  18.                
  19.                 width: 298px;
  20.                 height: 29px;
  21.                 border:1px solid #cfcfcf;
  22.                 border-top:none;
  23.                
  24.         }
  25.         #body{
  26.                 height: 386px;
  27.                 width: 298px;
  28.                 border:1px solid #cfcfcf;
  29.                 border-top:none;
  30.         }
  31.         #k1{
  32.                
  33.                 height:56px;
  34.                 border-bottom:1px solid #cfcfcf;
  35.                
  36.         }
  37.         #k2{
  38.                
  39.                 height:125px;
  40.                 border-bottom: 1px solid #cfcfcf;
  41.                
  42.                
  43.         }
  44.         #k3{
  45.                
  46.                 height: 75px;
  47.                 border-bottom:  1px solid #cfcfcf;
  48.                
  49.                
  50.                
  51.         }
  52.        
  53. </style>
  54. </head>

  55. <body>
  56. <div id="box">
  57.         <div id="head"></div>
  58.         <div id="body">
  59.                 <div id="k1"></div>
  60.                 <div id="k2"></div>
  61.                 <div id="k3"></div>
  62.                 <div id="k4"></div>
  63.                
  64.         </div>
  65. </div>
  66. <!--
  67.          嵌套关系( 父子级关系)
  68.           并列关系(兄弟标签)
  69.           同一个元素两条相交的地方是斜线
  70. -->
  71. </body>
  72. </html>
复制代码




回复

使用道具 举报

多多 发表于 2017-1-9 11:27:22 | 显示全部楼层
非常不错哈,解决了相邻的两条边颜色不一样时所出现的非矩形。
继续加油噢~
回复 支持 反对

使用道具 举报

why0510 发表于 2017-1-9 11:30:23 | 显示全部楼层
同学你好:
      基础打好,后面的知识才能学好。既然你从头开始学习,那自然要比其他零基础的学员要求高,你可以看看标签嵌套规则,命名规则等。k1这样没有语义的名字一般是不会用的,还有body,你可以换成main;还有你可以使用h5标签布局,header,section标签
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|Archiver|小黑屋|妙味课堂 ( 京ICP备08102442号

GMT+8, 2017-9-25 05:00 , Processed in 0.316889 second(s), 22 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表