欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
  <!DOCTYPEhtml>
 
  <htmllang="en">
 
  <head>
 
  <metacharset="UTF-8">
 
  <title>css讲解</title>
 
  <linkrel="stylesheet"href="style.css">
 
  <style>
 
  /*body{
 
  color:#000;
 
  background:#fff;
 
  margin:0;
 
  padding:0;
 
  font-family:Georgia,Palatino,serif;
 
  }*/
 
  div{
 
  width:200px;
 
  height:200px;
 
  background:blue;
 
  /*border:15pxsolidred;*/
 
  }
 
  #dd{
 
  width:300px;
 
  height:300px;
 
  background:red;
 
  }
 
  .xdd{
 
  color:yellow;
 
  }
 
  a{
 
  color:#000;
 
  font-size:30px;
 
  }
 
  a:hover{
 
  color:green;
 
  }
 
  .abc{
 
  color:blue;
 
  }
 
  ulli:first-child{
 
  color:orange;
 
  background:blue;
 
  }
 
  ulli:last-child{
 
  color:blue;
 
  background:orange;
 
  }
 
  ulli:nth-child(3){
 
  color:green;
 
  }
 
  ulli:only-child{
 
  color:red;
 
  }
 
  </style>
 
  </head>
 
  <body>
 
  <divstyle="border:20pxsolid#000;">
 
  <h2style="color:red;">css讲解</h2>
 
  </div>
 
  <formaction=""></form>
 
  <divid="dd"class="xdd">
 
  我的div标签
 
  <pid="mm"class="xdd">我是p标签</p>
 
  <aid="gg"href="http://www.baidu.com">baidu</a>
 
  <h1></h1>
 
  <span></span>
 
  </div>
 
  <div>
 
  <ahref="#">这是一个超链接</a>
 
  <p>今天气不错,大家有没有出游的计划</p>
 
  </div>
 
  <ul>
 
  <!--<h2>我的老大</h2>
 
  <h2>我的男孩子</h2>-->
 
  <liclass="abc">11111</li>
 
  <li>222222</li>
 
  <li>33333333</li>
 
  <li>4444444444</li>
 
  <li>555555555</li>
 
  <li>6666666</li>
 
  <li>7777777777</li>
 
  <li>8888888888</li>
 
  <li>9999999</li>
 
  <li>1000000000000</li>
 
  <ul>
 
  <<!--h1>我的哥哥</h1>-->
 
  <li>我的独生子女</li>
 
  <li>我不是生子女</li>
 
  </ul>
 
  <ul>
 
  <li>我的真正的独生子女</li>
 
  </ul>
 
  </body>
 
  </html>
 
  ————————————————
 
  版权声明:本文为CSDN博主「幸福诗歌」的原创文章,遵循CC4.0BY-SA版权协议,转载请附上原文出处链接及本声明。
 
  原文链接:https://blog.csdn.net/boke14122621/article/details/70990927

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/css-hack/c54598.shtml