雅虎中国首页新闻选项卡显示效果-JS特效-爱易网页

雅虎中国首页新闻选项卡显示效果

日期：2014-05-18　浏览次数：20138 次

以下是程序代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="X-UA-Compatible" content="IE=7">
<title>中国雅虎首页,zzjs.net收集</title>
 <link href="http://cn.yimg.com/hp/0910/css/core1.css" rel="stylesheet" type="text/css" media="all">

 <link rel="stylesheet" type="text/css" href="http://cn.yimg.com/i/yui/2.5.1/build/autocomplete/assets/skins/sam/autocomplete.css"/>
<style>
/*mycss*/
.nvxing li{*line-height:22px;}
/*common*/
a{color:#03b;text-decoration:none;outline:none;}
a:hover{text-decoration:underline;}
.cf{zoom:1;}
.cf:after,.mod .hd:after,.mod-a .bd:after,.mod-b .stru-a:after{content:".";display:block;height:0;visibility:hidden;clear:both;}
.dr,.dr a{color:#c03;}
.hot,.hot a{color:#c03;}
.die,.die a{color:#000;}
.none{display:none;}
img{vertical-align:middle;}
.dotbottom{border-bottom:1px dashed #ccc;}
.content-a .mod{height:286px;*height:295px;}
.mod{border:1px solid #9cb8c6;margin:10px 0 0;}
.mod .hd{border-bottom:1px solid #9cb8c6;height:23px;zoom:1;background:url(http://cn.yimg.com/hp/0910/img/bg1.gif) repeat-x 0 -820px;line-height:23px;padding:0 10px;}
.mod .hd h2{float:left;font-size:14px;font-weight:800;}
.mod .hd h2 a{color:#000;}
.mod .hd div{float:right;font-size:12px;color:#333;}
.mod .hd a,.mod .hd span{margin-left:6px;}
.tuiguang a{margin-left:10px;}
.content-a .tuiguang{margin-bottom:2px;}
.tuiguang b{font-weight:normal;color:#fff;background:url(http://cn.yimg.com/hp/0910/img/imglib1.gif) no-repeat -300px -80px;padding:0 5px;}
/*yhd*/
#yhd{position:relative;}
#weather{position:absolute;right:3px;top:2px;z-index:99;width:174px;border:1px solid #ccc;background:#fff ;font-size:12px;line-height:1.5;}
#weather .hd{padding-left:10px;}
#weather .bd{border:1px solid #c0c5e2;margin:4px;background:#fff url(http://cn.yimg.com/hp/0910/img/bg1.gif) repeat-x 0 -1090px;padding-bottom:3px;}
#weather .bd a{margin-left:7px;}
#ywp{width:950px;margin:0 auto;line-height:1.7;}
.hdwp{border:1px solid #9cb8c6;background:#fff url(http://cn.yimg.com/hp/0910/img/bg1.gif) repeat-x;font-size:12px;}
.mainnav{width:740px;_width:760px;margin:18px auto 8px;}
.mainnav li{float:left;text-align:center;margin:0 15px;}
.mainnav li a{background:url(http://cn.yimg.com/hp/0910/img/imglib1.gif) no-repeat;padding-top:42px;display:block;}
.mainnav .physical a{background-position:0 -70px;width:38px;}
.mainnav .entertainment a{background-position:-37px -70px;width:61px;}
.mainnav .finance a{background-position:-97px -70px;width:42px;}
.mainnav .car a{background-position:-140px -70px;width:51px;}
.mainnav .fashion a{background-position:-190px -70px;width:48px;}
.mainnav .bbs a{background-position:-237px -70px;width:44px;}
.mainnav .ycnlogo a{padding-top:0;background:none;position:relative;}
.ytoplinks{font-size:12px;position:relative;}
.yops{float:left;}
.yops a{margin-left:6px;}
.yfuncs{float:right;width:270px;}
.yfuncs img,#weather .hd img{margin-right:5px;}
.yfuncs .date{margin-right:20px;}
.yfuncs .city,#weather .city{padding-right:15px;background:url(http://cn.yimg.com/hp/0910/img/imglib1.gif) no-repeat right -87px;margin-right:8px;*background-position:right -89px;}
#weather .city{background-position:right -68px;*background-position:right -69px;}
.search{width:530px;margin:0 auto;padding-bottom:14px;}
.search a{margin-right:10px;}
.search .searchform{border:1px solid #c9dbe5;background:#f0f5f9;padding:3px;position:relative;margin-top:3px;}
.search input{border:0 none;height:18px;padding-top:1px;width:392px;}
.</div></div>

<div class="clearfix"></div>
                    </div>
                    <nav aria-label="...">
                        <ul class="pager">
                            <li class="previous"><a href="4667">上一篇：狡猾的按钮特效</a></li>

<li class="next"><a href="3869">下一篇：鼠标经过弹出下拉菜单js脚本</a></li>
                        </ul>
                    </nav>

<div class="alert alert-warning" role="alert">
                        <strong>免责声明：</strong> 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
                    </div>

<div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34282' title='亚马逊推特价闪购纪念入华十周年 总裁一职仍空缺' target="_blank">
                        亚马逊推特价闪购纪念入华十周年 总裁一职仍空缺</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34423' title='聚美向左，唯品向右，怎能耐得住高跟和红唇的诱惑！' target="_blank">
                        聚美向左，唯品向右，怎能耐得住高跟和红唇的诱惑！</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34436' title='华为、小米和联想在中国手机市场上演“三国杀”' target="_blank">
                        华为、小米和联想在中国手机市场上演“三国杀”</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/10818' title='AMD Q1净亏1.46亿美元 转战SOC拥抱ARM求变 ' target="_blank">
                        AMD Q1净亏1.46亿美元 转战SOC拥抱ARM求变 </a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/6914' title='App Store严禁推送广告 运用面临大清洗' target="_blank">
                        App Store严禁推送广告 运用面临大清洗</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/6903' title='联想架构调整后：Think品牌或推智能手机' target="_blank">
                        联想架构调整后：Think品牌或推智能手机</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34403' title='罗永浩工匠形象坍塌,锤子产能再跳水逃离用户超两成' target="_blank">
                        罗永浩工匠形象坍塌,锤子产能再跳水逃离用户超两成</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34165' title='魅族黄章惹怒芙蓉姐姐 将跨界推女神手机' target="_blank">
                        魅族黄章惹怒芙蓉姐姐 将跨界推女神手机</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34240' title='微软不会被颠覆' target="_blank">
                        微软不会被颠覆</a></li></div>
                   
                
        </ol>
    </div>
</div>

</div>

</div>
            </div>
            <div class="clearfix"></div>

<footer class=" footer navbar-bottom">
<em>友情链接：</em>
    
      <a href="http://www.aiyiweb.com/" target="_blank">爱易网 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">云虚拟主机技术 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">云服务器技术 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">程序设计技术 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">开发网站 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">APP开发教程 </a>            
    
<br />
<script type="text/javascript">(function(){document.write(unescape('%3Cdiv id="bdcs"%3E%3C/div%3E'));var bdcs = document.createElement('script');bdcs.type = 'text/javascript';bdcs.async = true;bdcs.src = 'http://znsv.baidu.com/customer_search/api/js?sid=15239353030108964139' + '&plate_url=' + encodeURIComponent(window.location.href) + '&t=' + Math.ceil(new Date()/3600000);var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(bdcs, s);})();</script>

Copyright © 2013-2024 爱易网页 当前在线：225人　
        网站在2时17分1秒内访问总人数：38886人
    当前 11.53%
　<a href="https://beian.miit.gov.cn" target="_blank">粤ICP备18100884号-2 </a>
<script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js"></script>
<script>LA.init({ id: "JszEmKrtpbU59dY5", ck: "JszEmKrtpbU59dY5" })</script>

</footer>

</div>
   
</body>
</html>