css基础知识小案例

Original 2018-11-01 10:57:19 226
abstract:<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>学习css第一节课 —— CSS基础知识</title>    <link
<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <title>学习css第一节课 —— CSS基础知识</title>
   <link rel="shortcut icon" type="image/x-icon" href="images/smallpic.png">
   <link rel="stylesheet" type="text/css" href="css/index.css">
   <style type="text/css">
*{padding:0px;margin:0px;}
       p{color:red;}
       #box{width:100px;height: 100px;background:red;}
       .main{width:100px;height: 100px;background: blue;}
       p i{font-weight: bold;font-size:60px;}
       a[href="#"]{color:#ccc;}
       a[href="//m.sbmmt.com"]{color:red;}
       span{padding: 10px;background:red;/*padding-left:20px;padding-right:20px;*/}
       div{width:100px;height:100px;background: pink;margin:30px auto;}
       .box{width:100px;height:100px;border:1px /*solid double dashed*/dotted #ccc;border-radius:50px;}
       .main{width:100px;height:100px;border-top:1px solid red;background: #cccccc;border-left:1px solid red;}
       button{border:none;}
       .shadow{width:300px;height:40px;box-shadow: 0px 5px 20px #ccc inset;}
   </style>
</head>
<body>
   <div></div>
   <div></div>
   <button>登录</button>
   <div></div>
   <span>php中文网</span><br>
   <div></div>
   <p style="font-weight: bold;">大家好,我是学生</p>
   <div id="box"></div>
   <div></div>
   <p>学习<i>css</i>第一节课</p>
   <h1>学习<i>css</i>第一节课</h1>
   <a href="#">链接1</a>
   <a href="//m.sbmmt.com">链接2</a>
</body>
</html>

总结:学到了边框和阴影参数含义以及他们的使用,感觉又进步了一点点。


Correcting teacher:韦小宝Correction time:2018-11-02 11:18:51
Teacher's summary:好好学习……每天都有小进步呐……关于html和css的学习主要就是多练习,将学习到的html标签和css样式控制,熟练的运用的自己的布局案例中去,加油……我会关注你成长的每一步,学习到有疑问可以反馈哦

Release Notes

Popular Entries