仿新浪部分静态页面展示

发布时间:2022-05-17 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了仿新浪部分静态页面展示脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
 1 <!DOCTYPE htML>
 2 <html XMlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <;meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
 5     <tITle></title>
 6     <link href="css/demo.css" rel="stylesheet" />
 7 </head>
 8 <body>
 9     <div id="dnews">
10         <div id="dhead"><a href="#" target="_blank" >汽车/在线购车</a></div>
11         <div id="news">
12             <div id="newspic"><a href="#"><img src="img/1.jpg" /></a></div>
13             <div id="newstitle"><a href="#">选贵的也要选对的 热销豪华中型SUV推荐</a></div>
14         </div>
15         <ul id="tabs">
16             <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li>
17             <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li>
18             <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li>
19             <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li>
20             <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li>
21             <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li>
22             <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li>
23         </ul>
24     </div>
25 </body>
26 </html>
 1 a{
 2     text-decoration:none;
 3 }
 4 #dnews{
 5     width:320px;
 6     height:264px;
 7   
 8 }
 9 #dhead{
10     width:320px;
11     height:30px;
12     padding-left:10px;
13     box-sizing:border-box;
14     line-height:30px;
15     background-color:rgba(76,255,0,0.1);
16 }
17 #dnews #dhead a:hover{
18     color:blue;
19 }
20 #news{
21     width:320px;
22     height:70px; 
23     margin-top:10px;
24 }
25 #news #newspic{
26     float:left;
27     width: 36%;
28 }
29 #news #newstitle{
30       width: 64%;
31     /* padding-left: 10px; */
32     font-size: 16px;
33     /* margin-left: 5px; */
34     /* padding-left: 4px; */
35     float: left;
36 }
37 #news #newstitle a:hover{
38     color:blue;
39 }
40 #tabs{
41     list-style-type:none;
42     color:black;
43     font-size:14px;
44     line-height:20px;
45     float:left;
46     margin: 0px  -40px;
47       
48 }
49 #tabs .tab a:hover{
50     color:red;
51 }
52 .tab{
53     background-image:url(../img/2.png);
54     background-repeat:no-repeat;
55     padding-left:20px;
56     background-position-y:center;
57 }

 

以上就是仿新浪部分静态页面展示的详细内容,更多请关注脚本宝典其它相关文章

脚本宝典总结

以上是脚本宝典为你收集整理的仿新浪部分静态页面展示全部内容,希望文章能够帮你解决仿新浪部分静态页面展示所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。