3 4 5 </ti"/><meta property="og:local" content="faq"> <meta property="og:title" content="Imitation of Sina's partial static page display-H5 Tutorial-php.cn"> <meta property="og:description" content="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></ti"> <meta property="og:url" content="https://m.php.cn/faq/374251.html"> <meta property="og:image" content="https://m.php.cn/static/images/logo.png"> <meta property="og:site_name" content="php.cn"> <meta property="og:type" content="website"> <link rel="canonical" href="https://www.php.cn/faq/374251.html"/> <link rel="alternate" hrefLang="zh-cn" href="https://m.php.cn/zh/faq/374251.html" /> <link rel="alternate" hrefLang="en" href="https://m.php.cn/faq/374251.html" /> <link rel="alternate" hrefLang="zh-tw" href="https://m.php.cn/zh-tw/faq/374251.html" /> <link rel="alternate" hrefLang="ja" href="https://m.php.cn/ja/faq/374251.html" /> <link rel="alternate" hrefLang="ko" href="https://m.php.cn/ko/faq/374251.html" /> <link rel="alternate" hrefLang="ms" href="https://m.php.cn/ms/faq/374251.html" /> <link rel="alternate" hrefLang="fr" href="https://m.php.cn/fr/faq/374251.html" /> <link rel="alternate" hrefLang="de" href="https://m.php.cn/de/faq/374251.html" /> <meta charset="utf-8" /><meta name=viewport content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover"><meta name="applicable-device" content="mobile" /><link rel="stylesheet" href="/static/css/style.css?4.5.31"><link href="/static/front/mobcss/newphpcommon.css?1.1" type="text/css" rel="stylesheet"/><link href="/static/front/mobcss/swiper.min.css" type="text/css" rel="stylesheet"/><link href="/static/front/mobcss/newphp.css?1.2" type="text/css" rel="stylesheet"/><link href="/static/css/global.css" type="text/css" rel="stylesheet"/><link href="/static/layui/css/layui.css" type="text/css" rel="stylesheet"/><link href="/static/mobcss/mobindex3.css" type="text/css" rel="stylesheet"/><script src="/static/front/mobjs/jquery-1.6.1.min.js"></script><script src="/static/front/mobjs/swiper.min.js"></script><script src="/static/front/mobjs/newphpcommon.js"></script><link rel="canonical" href="https://www.php.cn/faq/374251.html"/> <link rel="alternate" hrefLang="zh-cn" href="https://m.php.cn/zh/faq/374251.html" /> <link rel="alternate" hrefLang="en" href="https://m.php.cn/faq/374251.html" /> <link rel="alternate" hrefLang="zh-tw" href="https://m.php.cn/zh-tw/faq/374251.html" /> <link rel="alternate" hrefLang="ja" href="https://m.php.cn/ja/faq/374251.html" /> <link rel="alternate" hrefLang="ko" href="https://m.php.cn/ko/faq/374251.html" /> <link rel="alternate" hrefLang="ms" href="https://m.php.cn/ms/faq/374251.html" /> <link rel="alternate" hrefLang="fr" href="https://m.php.cn/fr/faq/374251.html" /> <link rel="alternate" hrefLang="de" href="https://m.php.cn/de/faq/374251.html" /> <script> var canshu = { SeeMore:'See more', FoldUp:'Fold up', Choice:'LANGUAGE', wait:'Loading, please wait~', LoginFirst:"Please log in first", needKeyword:'Enter keyword search', emailPhoneError:'Please enter the correct phone or email address', missPwd:'Please enter the password', emailError:'Please enter your correct email address', VerCode:"Please enter the verification code", getCode:'Sending', pwdError:'Incorrect password format', TwoPassNotMatch:'Two passwords do not match', Bindemail:'Bind email', resetpassword:'reset password', ConfirmPass:'Confirm Password', pwdCheck:'Please enter 6-18 letters or numbers', Editinfor: 'Edit personal information', trimContent:'Please enter content', titleCheck:'Title should be at least 5 words long', choiceLang:'Please select a language classification', Secondreply:'reply', NetWorkError:'Network error, please try again later!', keywordSearch:'Enter keyword search', all_lang_string:'zh|en|zh-tw|ja|ko|ms|fr|de', Next:'Next', Previous:'Previous' }; </script><!-- Google Tag Manager --><script> (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl; f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-WWVXRJPW'); </script><!-- End Google Tag Manager --><!-- Google tag (gtag.js) --><script async src="https://www.googletagmanager.com/gtag/js?id=G-H42EVCYBJC"></script><script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-H42EVCYBJC'); </script><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5902227090019525" crossorigin="anonymous"></script><!--<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-6267705206177514" crossorigin="anonymous"></script>--><script type="application/ld+json">{"@context":"https:\/\/schema.org","@type":"WebSite","url":"https:\/\/m.php.cn\/","potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/m.php.cn\/search?word={search_term_string}"},"query-input":"required name=search_term_string"}}</script><meta property="article:author" content="PHP中文网" /><meta property="article:published_first" content=",https://www.php.cn/faq/374251.html" /><link rel="stylesheet" href="/static/ueditor/third-party/SyntaxHighlighter/shCoreDefault.css?1"><link rel="stylesheet" href="/static/ueditor/third-party/SyntaxHighlighter/shCoreDefault1.css"><link href="/static/mobcss/newphp.css" type="text/css" rel="stylesheet"/><script src="/static/ueditor/third-party/SyntaxHighlighter/shCore.js"></script><script> var xnb_name = 'Virtual currency'; </script><script type="application/ld+json">{"@context":"https:\/\/schema.org","@type":"Article","headline":"Imitation of Sina's partial static page display","description":"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><\/ti","image":["img\/1.jpg"],"datePublished":"2017-07-14T18:15:14+8:00","author":{"url":"https:\/\/m.php.cn\/member\/1.html","name":"PHP中文网"},"mainEntityOfPage":{"@type":"WebPage","@id":"https:\/\/m.php.cn\/faq\/374251.html"},"url":"https:\/\/m.php.cn\/faq\/374251.html","articleBody":"<div class=\"cnblogs_code\">\n<pre><span style=\"color: #008080\"> 1<\/span> <span style=\"color: #800000\"><!DOCTYPE html>\n<\/span><span style=\"color: #008080\"> 2<\/span> <span style=\"color: #800000\"><html xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<\/span><span style=\"color: #008080\"> 3<\/span> <span style=\"color: #800000\"><head>\n<\/span><span style=\"color: #008080\"> 4<\/span> <span style=\"color: #800000\"><meta http-equiv=\"Content-Type\" content=\"text\/html; charset=utf-8\"\/>\n<\/span><span style=\"color: #008080\"> 5<\/span> <span style=\"color: #800000\"> <title><\/title>\n<\/span><span style=\"color: #008080\"> 6<\/span> <span style=\"color: #800000\"> <link href=\"css\/demo.css\" rel=\"stylesheet\" \/>\n<\/span><span style=\"color: #008080\"> 7<\/span> <span style=\"color: #800000\"><\/head>\n<\/span><span style=\"color: #008080\"> 8<\/span> <span style=\"color: #800000\"><body>\n<\/span><span style=\"color: #008080\"> 9<\/span> <span style=\"color: #800000\"> <div id=\"dnews\">\n<\/span><span style=\"color: #008080\">10<\/span> <span style=\"color: #800000\"> <div id=\"dhead\"><a href=\"#\" target=\"_blank\" >汽车\/在线购车<\/a><\/div>\n<\/span><span style=\"color: #008080\">11<\/span> <span style=\"color: #800000\"> <div id=\"news\">\n<\/span><span style=\"color: #008080\">12<\/span> <span style=\"color: #800000\"> <div id=\"newspic\"><a href=\"#\"><img src=\"img\/1.jpg\" \/><\/a><\/div>\n<\/span><span style=\"color: #008080\">13<\/span> <span style=\"color: #800000\"> <div id=\"newstitle\"><a href=\"#\">选贵的也要选对的 热销豪华中型SUV推荐<\/a><\/div>\n<\/span><span style=\"color: #008080\">14<\/span> <span style=\"color: #800000\"> <\/div>\n<\/span><span style=\"color: #008080\">15<\/span> <span style=\"color: #800000\"> <ul id=\"tabs\">\n<\/span><span style=\"color: #008080\">16<\/span> <span style=\"color: #800000\"> <li class=\"tab\"><a href=\"#\">新高尔夫百公里油耗为5L 奥迪Q4整体犀利<\/a><\/li>\n<\/span><span style=\"color: #008080\">17<\/span> <span style=\"color: #800000\"> <li class=\"tab\"><a href=\"#\">新高尔夫百公里油耗为5L 奥迪Q4整体犀利<\/a><\/li>\n<\/span><span style=\"color: #008080\">18<\/span> <span style=\"color: #800000\"> <li class=\"tab\"><a href=\"#\">新高尔夫百公里油耗为5L 奥迪Q4整体犀利<\/a><\/li>\n<\/span><span style=\"color: #008080\">19<\/span> <span style=\"color: #800000\"> <li class=\"tab\"><a href=\"#\">新高尔夫百公里油耗为5L 奥迪Q4整体犀利<\/a><\/li>\n<\/span><span style=\"color: #008080\">20<\/span> <span style=\"color: #800000\"> <li class=\"tab\"><a href=\"#\">新高尔夫百公里油耗为5L 奥迪Q4整体犀利<\/a><\/li>\n<\/span><span style=\"color: #008080\">21<\/span> <span style=\"color: #800000\"> <li class=\"tab\"><a href=\"#\">新高尔夫百公里油耗为5L 奥迪Q4整体犀利<\/a><\/li>\n<\/span><span style=\"color: #008080\">22<\/span> <span style=\"color: #800000\"> <li class=\"tab\"><a href=\"#\">新高尔夫百公里油耗为5L 奥迪Q4整体犀利<\/a><\/li>\n<\/span><span style=\"color: #008080\">23<\/span> <span style=\"color: #800000\"> <\/ul>\n<\/span><span style=\"color: #008080\">24<\/span> <span style=\"color: #800000\"> <\/div>\n<\/span><span style=\"color: #008080\">25<\/span> <span style=\"color: #800000\"><\/body>\n<\/span><span style=\"color: #008080\">26<\/span> <span style=\"color: #800000\"><\/html><\/span><\/pre>\n<\/div>\n<div class=\"cnblogs_code\">\n<pre><span style=\"color: #008080\"> 1<\/span> <span style=\"color: #800000\">a<\/span>{\n<span style=\"color: #008080\"> 2<\/span> <span style=\"color: #ff0000\"> text-decoration<\/span>:<span style=\"color: #0000ff\">none<\/span>;\n<span style=\"color: #008080\"> 3<\/span> }\n<span style=\"color: #008080\"> 4<\/span> <span style=\"color: #800000\">#dnews<\/span>{\n<span style=\"color: #008080\"> 5<\/span> <span style=\"color: #ff0000\"> width<\/span>:<span style=\"color: #0000ff\">320px<\/span>;\n<span style=\"color: #008080\"> 6<\/span> <span style=\"color: #ff0000\"> height<\/span>:<span style=\"color: #0000ff\">264px<\/span>;\n<span style=\"color: #008080\"> 7<\/span> \n<span style=\"color: #008080\"> 8<\/span> }\n<span style=\"color: #008080\"> 9<\/span> <span style=\"color: #800000\">#dhead<\/span>{\n<span style=\"color: #008080\">10<\/span> <span style=\"color: #ff0000\"> width<\/span>:<span style=\"color: #0000ff\">320px<\/span>;\n<span style=\"color: #008080\">11<\/span> <span style=\"color: #ff0000\"> height<\/span>:<span style=\"color: #0000ff\">30px<\/span>;\n<span style=\"color: #008080\">12<\/span> <span style=\"color: #ff0000\"> padding-left<\/span>:<span style=\"color: #0000ff\">10px<\/span>;\n<span style=\"color: #008080\">13<\/span> <span style=\"color: #ff0000\"> box-sizing<\/span>:<span style=\"color: #0000ff\">border-box<\/span>;\n<span style=\"color: #008080\">14<\/span> <span style=\"color: #ff0000\"> line-height<\/span>:<span style=\"color: #0000ff\">30px<\/span>;\n<span style=\"color: #008080\">15<\/span> <span style=\"color: #ff0000\"> background-color<\/span>:<span style=\"color: #0000ff\">rgba(76,255,0,0.1)<\/span>;\n<span style=\"color: #008080\">16<\/span> }\n<span style=\"color: #008080\">17<\/span> <span style=\"color: #800000\">#dnews #dhead a:hover<\/span>{\n<span style=\"color: #008080\">18<\/span> <span style=\"color: #ff0000\"> color<\/span>:<span style=\"color: #0000ff\">blue<\/span>;\n<span style=\"color: #008080\">19<\/span> }\n<span style=\"color: #008080\">20<\/span> <span style=\"color: #800000\">#news<\/span>{\n<span style=\"color: #008080\">21<\/span> <span style=\"color: #ff0000\"> width<\/span>:<span style=\"color: #0000ff\">320px<\/span>;\n<span style=\"color: #008080\">22<\/span> <span style=\"color: #ff0000\"> height<\/span>:<span style=\"color: #0000ff\">70px<\/span>; \n<span style=\"color: #008080\">23<\/span> <span style=\"color: #ff0000\"> margin-top<\/span>:<span style=\"color: #0000ff\">10px<\/span>;\n<span style=\"color: #008080\">24<\/span> }\n<span style=\"color: #008080\">25<\/span> <span style=\"color: #800000\">#news #newspic<\/span>{\n<span style=\"color: #008080\">26<\/span> <span style=\"color: #ff0000\"> float<\/span>:<span style=\"color: #0000ff\">left<\/span>;\n<span style=\"color: #008080\">27<\/span> <span style=\"color: #ff0000\"> width<\/span>:<span style=\"color: #0000ff\"> 36%<\/span>;\n<span style=\"color: #008080\">28<\/span> }\n<span style=\"color: #008080\">29<\/span> <span style=\"color: #800000\">#news #newstitle<\/span>{\n<span style=\"color: #008080\">30<\/span> <span style=\"color: #ff0000\"> width<\/span>:<span style=\"color: #0000ff\"> 64%<\/span>;\n<span style=\"color: #008080\">31<\/span> <span style=\"color: #008000\">\/*<\/span><span style=\"color: #008000\"> padding-left: 10px; <\/span><span style=\"color: #008000\">*\/<\/span>\n<span style=\"color: #008080\">32<\/span> <span style=\"color: #ff0000\"> font-size<\/span>:<span style=\"color: #0000ff\"> 16px<\/span>;\n<span style=\"color: #008080\">33<\/span> <span style=\"color: #008000\">\/*<\/span><span style=\"color: #008000\"> margin-left: 5px; <\/span><span style=\"color: #008000\">*\/<\/span>\n<span style=\"color: #008080\">34<\/span> <span style=\"color: #008000\">\/*<\/span><span style=\"color: #008000\"> padding-left: 4px; <\/span><span style=\"color: #008000\">*\/<\/span>\n<span style=\"color: #008080\">35<\/span> <span style=\"color: #ff0000\"> float<\/span>:<span style=\"color: #0000ff\"> left<\/span>;\n<span style=\"color: #008080\">36<\/span> }\n<span style=\"color: #008080\">37<\/span> <span style=\"color: #800000\">#news #newstitle a:hover<\/span>{\n<span style=\"color: #008080\">38<\/span> <span style=\"color: #ff0000\"> color<\/span>:<span style=\"color: #0000ff\">blue<\/span>;\n<span style=\"color: #008080\">39<\/span> }\n<span style=\"color: #008080\">40<\/span> <span style=\"color: #800000\">#tabs<\/span>{\n<span style=\"color: #008080\">41<\/span> <span style=\"color: #ff0000\"> list-style-type<\/span>:<span style=\"color: #0000ff\">none<\/span>;\n<span style=\"color: #008080\">42<\/span> <span style=\"color: #ff0000\"> color<\/span>:<span style=\"color: #0000ff\">black<\/span>;\n<span style=\"color: #008080\">43<\/span> <span style=\"color: #ff0000\"> font-size<\/span>:<span style=\"color: #0000ff\">14px<\/span>;\n<span style=\"color: #008080\">44<\/span> <span style=\"color: #ff0000\"> line-height<\/span>:<span style=\"color: #0000ff\">20px<\/span>;\n<span style=\"color: #008080\">45<\/span> <span style=\"color: #ff0000\"> float<\/span>:<span style=\"color: #0000ff\">left<\/span>;\n<span style=\"color: #008080\">46<\/span> <span style=\"color: #ff0000\"> margin<\/span>:<span style=\"color: #0000ff\"> 0px -40px<\/span>;\n<span style=\"color: #008080\">47<\/span> \n<span style=\"color: #008080\">48<\/span> }\n<span style=\"color: #008080\">49<\/span> <span style=\"color: #800000\">#tabs .tab a:hover<\/span>{\n<span style=\"color: #008080\">50<\/span> <span style=\"color: #ff0000\"> color<\/span>:<span style=\"color: #0000ff\">red<\/span>;\n<span style=\"color: #008080\">51<\/span> }\n<span style=\"color: #008080\">52<\/span> <span style=\"color: #800000\">.tab<\/span>{\n<span style=\"color: #008080\">53<\/span> <span style=\"color: #ff0000\"> background-image<\/span>:<span style=\"color: #0000ff\">url(..\/img\/2.png)<\/span>;\n<span style=\"color: #008080\">54<\/span> <span style=\"color: #ff0000\"> background-repeat<\/span>:<span style=\"color: #0000ff\">no-repeat<\/span>;\n<span style=\"color: #008080\">55<\/span> <span style=\"color: #ff0000\"> padding-left<\/span>:<span style=\"color: #0000ff\">20px<\/span>;\n<span style=\"color: #008080\">56<\/span> <span style=\"color: #ff0000\"> background-position-y<\/span>:<span style=\"color: #0000ff\">center<\/span>;\n<span style=\"color: #008080\">57<\/span> }<\/pre>\n<\/div>\n<p> <\/p>"}</script><script type="application/ld+json">{"@context":"https:\/\/schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"item":{"@id":"https:\/\/m.php.cn\/","name":"Home"}},{"@type":"ListItem","position":2,"item":{"@id":"https:\/\/m.php.cn\/web-designer.html","name":"Web Front-end"}},{"@type":"ListItem","position":3,"item":{"@id":"https:\/\/m.php.cn\/html5-tutorial.html","name":"H5 Tutorial"}},{"@type":"ListItem","position":4,"item":{"@id":"https:\/\/m.php.cn\/faq\/374251.html","name":"Imitation of Sina's partial static page display"}}]}</script></head><body><div class="bodyBg"><link rel="stylesheet" type="text/css" href="/static/csshwm/m_stylehw.css"><header><div class="head"><div class="haed_left"><div class="haed_logo"><a href="https://m.php.cn/" title="php.cn" class="haed_logo_a"><img src="/static/imghwm/logo.png" alt="php.cn" class="haed_logoimg"></a></div></div><div class="search_div search_div_top2"><input id="key_words" class="search-input" type="text" autocomplete="off" name="keywords" required="required" placeholder="Block,address,transaction,news" value="" onkeydown="if (event.keyCode == 13) searchs('en')"/><a onclick="searchs('en')" href="javascript:;" title="search"><img onerror="this.onerror=''; this.src='static/imghwm/default1.png'" src="/static/imghwm/find.png" alt="search"></a></div><div class="head_right"><button type="button" class="layui-btn layui-btn-primary headerlan headlanmax lan1" id="lan1sp" lay-on="test-offset-r"><img src="/static/imghwm/m_menu.png" alt=""></button><div id="m_menu" class="m_menu" style="display: none;"><div class="m_editormain12main_top"><img src="/static/imghwm/logo.png" alt="logo"><a href="javascript:;" class="m_editormain12main_topi" id="m_editormain12main_topi_sp"><i class="layui-icon layui-icon-close"></i></a></div><div class="layui-panel m_menu_main"><ul class="layui-menu" id="demo-menu"><li class="layui-menu-item-group layui-menu-item-up m_menus" lay-options="{type: 'group'}"><div class="layui-menu-body-title m_menus_title">Community<i class="layui-icon layui-icon-down"></i></div><ul class="m_menusnames"><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/article.html" title="Articles">Articles</a></div></li><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/faq/zt" title="Topics">Topics</a></div></li><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/wenda.html" title="Q&A">Q&A</a></div></li></ul></li><li class="layui-menu-item-divider"></li><li class="layui-menu-item-group layui-menu-item-up m_menus" lay-options="{type: 'group'}"><div class="layui-menu-body-title m_menus_title">Learn<i class="layui-icon layui-icon-down"></i></div><ul class="m_menusnames"><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/course.html" title="Course">Course</a></div></li><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/dic/" title="Programming Dictionary">Programming Dictionary</a></div></li></ul></li><li class="layui-menu-item-divider"></li><li class="layui-menu-item-group layui-menu-item-up m_menus" lay-options="{type: 'group'}"><div class="layui-menu-body-title m_menus_title">Tools Library<i class="layui-icon layui-icon-down"></i></div><ul class="m_menusnames"><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/toolset/development-tools" title="Development tools">Development tools</a></div></li><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/toolset/website-source-code" title="Website Source Code">Website Source Code</a></div></li><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/toolset/php-libraries" title="PHP Libraries">PHP Libraries</a></div></li><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/toolset/js-special-effects" title="JS special effects">JS special effects</a></div></li><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/toolset/website-materials" title="Website Materials">Website Materials</a></div></li><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/toolset/extension-plug-ins" title="Extension plug-ins">Extension plug-ins</a></div></li></ul></li><li class="layui-menu-item-divider"></li><li class="layui-menu-item-group layui-menu-item-up m_menus" lay-options="{type: 'group'}"><div class="layui-menu-body-title m_menus_title">Leisure<i class="layui-icon layui-icon-down"></i></div><ul class="m_menusnames"><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/game" title="Game Download">Game Download</a></div></li><li><div class="layui-menu-body-title m_menus_name"><a href="https://m.php.cn/mobile-game-tutorial/" title="Game Tutorials">Game Tutorials</a></div></li></ul></li><li class="layui-menu-item-divider"></li></ul></div><!-- <div class="m_menu_button">--><!-- <a href="javascript:;" title="singup">Create an account</a>--><!-- </div>--><div class="m_menu_button m_menu_button_login"><a href="https://m.php.cn/login" title="Login">Log in</a></div><div class="m_menu_button m_menu_button_lang"><button type="button" class="layui-btn layui-btn-primary headerlan headlanmax lan1" id="lan1" lay-on="page2">English<i class="layui-icon layui-icon-triangle-d"></i></button></div></div><div class="m_menu_lang" id="m_menu_lang" style="display: none;"><div class="m_editormain12main_top"><img src="/static/imghwm/logo.png" alt="logo"><a href="javascript:;" class="m_editormain12main_topi" id="m_editormain12main_topi_lan"><i class="layui-icon layui-icon-close"></i></a></div><div class="m_menu_lang_main"><a href="javascript:setlang('zh-cn');" class="m_menu_lang_mains">简体中文<span>zh-cn</span></a><a href="javascript:;" class="m_menu_lang_mains">English<span>en</span></a><a href="javascript:setlang('zh-tw');" class="m_menu_lang_mains">繁体中文<span>zh-tw</span></a><a href="javascript:setlang('ja');" class="m_menu_lang_mains">日本語<span>ja</span></a><a href="javascript:setlang('ko');" class="m_menu_lang_mains">한국어<span>ko</span></a><a href="javascript:setlang('ms');" class="m_menu_lang_mains">Melayu<span>ms</span></a><a href="javascript:setlang('fr');" class="m_menu_lang_mains">Français<span>fr</span></a><a href="javascript:setlang('de');" class="m_menu_lang_mains">Deutsch<span>de</span></a></div></div></div></div></header><script> document.getElementById('lan1sp').addEventListener('click', function (event) { event.preventDefault(); var elements = document.getElementsByClassName('m_menu'); for (var i = 0; i < elements.length; i++) { elements[i].style.display = 'block'; } }); document.getElementById('m_editormain12main_topi_sp').addEventListener('click', function (event) { event.preventDefault(); var elements = document.getElementsByClassName('m_menu'); for (var i = 0; i < elements.length; i++) { elements[i].style.display = 'none'; } }); document.getElementById('lan1').addEventListener('click', function (event) { event.preventDefault(); var elements = document.getElementsByClassName('m_menu_lang'); for (var i = 0; i < elements.length; i++) { elements[i].style.display = 'block'; } }); document.getElementById('m_editormain12main_topi_lan').addEventListener('click', function (event) { event.preventDefault(); var elements = document.getElementsByClassName('m_menu_lang'); for (var i = 0; i < elements.length; i++) { elements[i].style.display = 'none'; } }); </script><div class="bodyMain"><!--所在位置--><div class="nphpSize"><div class="nphpSizeIn"><b></b><p><a href="https://m.php.cn/" title="Home" class="bBlack">Home</a> ><a href="https://m.php.cn/web-designer.html" class="cBlack">Web Front-end</a> ><a href="https://m.php.cn/html5-tutorial.html" class="cBlack">H5 Tutorial</a> >Imitation of Sina's partial static page display</p><!-- <p><a href="https://m.php.cn/article.html" class="cBlack">Technical Articles</a>  >  <a href="https://m.php.cn/web-designer.html" class="cBlack">Web Front-end</a> > <a href="https://m.php.cn/html5-tutorial.html" class="cBlack">H5 Tutorial</a> > Imitation of Sina's partial static page display</p> --><div class="clear"></div></div></div><div class="nphpQianBox"><div class="nphpQianTitle"><h1>Imitation of Sina's partial static page display</h1><div class="nphpQianTitleIn"><span><img data-src="https://img.php.cn/upload/avatar/000/000/001/6251028808086368.png" alt="PHP中文网" class="lazyload" src="/static/front/mobimages/moren/moren.png" /></span><dl><dt><em>PHP中文网</em><i class='bg1'>Original</i><div class="clear"></div></dt><dd><em>2017-07-14 18:15:14</em><i>1638browse</i><div class="clear"></div></dd></dl><div class="clear"></div></div></div><div class="nphpQianCont wenda-list"><div class="cnblogs_code"> <pre class="brush:php;toolbar:false"><span style="color: #008080"> 1</span> <span style="color: #800000"><!DOCTYPE html> </span><span style="color: #008080"> 2</span> <span style="color: #800000"><html xmlns="http://www.w3.org/1999/xhtml"> </span><span style="color: #008080"> 3</span> <span style="color: #800000"><head> </span><span style="color: #008080"> 4</span> <span style="color: #800000"><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> </span><span style="color: #008080"> 5</span> <span style="color: #800000"> <title></title> </span><span style="color: #008080"> 6</span> <span style="color: #800000"> <link href="css/demo.css" rel="stylesheet" /> </span><span style="color: #008080"> 7</span> <span style="color: #800000"></head> </span><span style="color: #008080"> 8</span> <span style="color: #800000"><body> </span><span style="color: #008080"> 9</span> <span style="color: #800000"> <div id="dnews"> </span><span style="color: #008080">10</span> <span style="color: #800000"> <div id="dhead"><a href="#" target="_blank" >汽车/在线购车</a></div> </span><span style="color: #008080">11</span> <span style="color: #800000"> <div id="news"> </span><span style="color: #008080">12</span> <span style="color: #800000"> <div id="newspic"><a href="#"><img src="img/1.jpg" /></a></div> </span><span style="color: #008080">13</span> <span style="color: #800000"> <div id="newstitle"><a href="#">选贵的也要选对的 热销豪华中型SUV推荐</a></div> </span><span style="color: #008080">14</span> <span style="color: #800000"> </div> </span><span style="color: #008080">15</span> <span style="color: #800000"> <ul id="tabs"> </span><span style="color: #008080">16</span> <span style="color: #800000"> <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li> </span><span style="color: #008080">17</span> <span style="color: #800000"> <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li> </span><span style="color: #008080">18</span> <span style="color: #800000"> <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li> </span><span style="color: #008080">19</span> <span style="color: #800000"> <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li> </span><span style="color: #008080">20</span> <span style="color: #800000"> <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li> </span><span style="color: #008080">21</span> <span style="color: #800000"> <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li> </span><span style="color: #008080">22</span> <span style="color: #800000"> <li class="tab"><a href="#">新高尔夫百公里油耗为5L 奥迪Q4整体犀利</a></li> </span><span style="color: #008080">23</span> <span style="color: #800000"> </ul> </span><span style="color: #008080">24</span> <span style="color: #800000"> </div> </span><span style="color: #008080">25</span> <span style="color: #800000"></body> </span><span style="color: #008080">26</span> <span style="color: #800000"></html></span></pre> </div> <div class="cnblogs_code"> <pre class="brush:php;toolbar:false"><span style="color: #008080"> 1</span> <span style="color: #800000">a</span>{ <span style="color: #008080"> 2</span> <span style="color: #ff0000"> text-decoration</span>:<span style="color: #0000ff">none</span>; <span style="color: #008080"> 3</span> } <span style="color: #008080"> 4</span> <span style="color: #800000">#dnews</span>{ <span style="color: #008080"> 5</span> <span style="color: #ff0000"> width</span>:<span style="color: #0000ff">320px</span>; <span style="color: #008080"> 6</span> <span style="color: #ff0000"> height</span>:<span style="color: #0000ff">264px</span>; <span style="color: #008080"> 7</span> <span style="color: #008080"> 8</span> } <span style="color: #008080"> 9</span> <span style="color: #800000">#dhead</span>{ <span style="color: #008080">10</span> <span style="color: #ff0000"> width</span>:<span style="color: #0000ff">320px</span>; <span style="color: #008080">11</span> <span style="color: #ff0000"> height</span>:<span style="color: #0000ff">30px</span>; <span style="color: #008080">12</span> <span style="color: #ff0000"> padding-left</span>:<span style="color: #0000ff">10px</span>; <span style="color: #008080">13</span> <span style="color: #ff0000"> box-sizing</span>:<span style="color: #0000ff">border-box</span>; <span style="color: #008080">14</span> <span style="color: #ff0000"> line-height</span>:<span style="color: #0000ff">30px</span>; <span style="color: #008080">15</span> <span style="color: #ff0000"> background-color</span>:<span style="color: #0000ff">rgba(76,255,0,0.1)</span>; <span style="color: #008080">16</span> } <span style="color: #008080">17</span> <span style="color: #800000">#dnews #dhead a:hover</span>{ <span style="color: #008080">18</span> <span style="color: #ff0000"> color</span>:<span style="color: #0000ff">blue</span>; <span style="color: #008080">19</span> } <span style="color: #008080">20</span> <span style="color: #800000">#news</span>{ <span style="color: #008080">21</span> <span style="color: #ff0000"> width</span>:<span style="color: #0000ff">320px</span>; <span style="color: #008080">22</span> <span style="color: #ff0000"> height</span>:<span style="color: #0000ff">70px</span>; <span style="color: #008080">23</span> <span style="color: #ff0000"> margin-top</span>:<span style="color: #0000ff">10px</span>; <span style="color: #008080">24</span> } <span style="color: #008080">25</span> <span style="color: #800000">#news #newspic</span>{ <span style="color: #008080">26</span> <span style="color: #ff0000"> float</span>:<span style="color: #0000ff">left</span>; <span style="color: #008080">27</span> <span style="color: #ff0000"> width</span>:<span style="color: #0000ff"> 36%</span>; <span style="color: #008080">28</span> } <span style="color: #008080">29</span> <span style="color: #800000">#news #newstitle</span>{ <span style="color: #008080">30</span> <span style="color: #ff0000"> width</span>:<span style="color: #0000ff"> 64%</span>; <span style="color: #008080">31</span> <span style="color: #008000">/*</span><span style="color: #008000"> padding-left: 10px; </span><span style="color: #008000">*/</span> <span style="color: #008080">32</span> <span style="color: #ff0000"> font-size</span>:<span style="color: #0000ff"> 16px</span>; <span style="color: #008080">33</span> <span style="color: #008000">/*</span><span style="color: #008000"> margin-left: 5px; </span><span style="color: #008000">*/</span> <span style="color: #008080">34</span> <span style="color: #008000">/*</span><span style="color: #008000"> padding-left: 4px; </span><span style="color: #008000">*/</span> <span style="color: #008080">35</span> <span style="color: #ff0000"> float</span>:<span style="color: #0000ff"> left</span>; <span style="color: #008080">36</span> } <span style="color: #008080">37</span> <span style="color: #800000">#news #newstitle a:hover</span>{ <span style="color: #008080">38</span> <span style="color: #ff0000"> color</span>:<span style="color: #0000ff">blue</span>; <span style="color: #008080">39</span> } <span style="color: #008080">40</span> <span style="color: #800000">#tabs</span>{ <span style="color: #008080">41</span> <span style="color: #ff0000"> list-style-type</span>:<span style="color: #0000ff">none</span>; <span style="color: #008080">42</span> <span style="color: #ff0000"> color</span>:<span style="color: #0000ff">black</span>; <span style="color: #008080">43</span> <span style="color: #ff0000"> font-size</span>:<span style="color: #0000ff">14px</span>; <span style="color: #008080">44</span> <span style="color: #ff0000"> line-height</span>:<span style="color: #0000ff">20px</span>; <span style="color: #008080">45</span> <span style="color: #ff0000"> float</span>:<span style="color: #0000ff">left</span>; <span style="color: #008080">46</span> <span style="color: #ff0000"> margin</span>:<span style="color: #0000ff"> 0px -40px</span>; <span style="color: #008080">47</span> <span style="color: #008080">48</span> } <span style="color: #008080">49</span> <span style="color: #800000">#tabs .tab a:hover</span>{ <span style="color: #008080">50</span> <span style="color: #ff0000"> color</span>:<span style="color: #0000ff">red</span>; <span style="color: #008080">51</span> } <span style="color: #008080">52</span> <span style="color: #800000">.tab</span>{ <span style="color: #008080">53</span> <span style="color: #ff0000"> background-image</span>:<span style="color: #0000ff">url(../img/2.png)</span>; <span style="color: #008080">54</span> <span style="color: #ff0000"> background-repeat</span>:<span style="color: #0000ff">no-repeat</span>; <span style="color: #008080">55</span> <span style="color: #ff0000"> padding-left</span>:<span style="color: #0000ff">20px</span>; <span style="color: #008080">56</span> <span style="color: #ff0000"> background-position-y</span>:<span style="color: #0000ff">center</span>; <span style="color: #008080">57</span> }</pre> </div> <p> </p><p>The above is the detailed content of Imitation of Sina's partial static page display. For more information, please follow other related articles on the PHP Chinese website!</p></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>Statement:</span><div>The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn</div></div></div><div class="nphpSytBox"><span>Previous article:<a class="dBlack" title="Front-end framework-pop-up window research" href="https://m.php.cn/faq/374250.html">Front-end framework-pop-up window research</a></span><span>Next article:<a class="dBlack" title="Front-end framework-pop-up window research" href="https://m.php.cn/faq/374252.html">Front-end framework-pop-up window research</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Related articles</h2><em><a href="https://m.php.cn/article.html" class="bBlack"><i>See more</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="fluid" data-ad-layout-key="-6t+ed+2i-1n-4w" data-ad-client="ca-pub-5902227090019525" data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><ul class="nphpXgwzList"><li><b></b><a href="https://m.php.cn/faq/348281.html" title="AlloyTouch full-screen scrolling plug-in creates a smooth H5 page in 30 seconds" class="aBlack">AlloyTouch full-screen scrolling plug-in creates a smooth H5 page in 30 seconds</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/faq/348372.html" title="HTML5 actual combat and analysis of touch events (touchstart, touchmove and touchend)" class="aBlack">HTML5 actual combat and analysis of touch events (touchstart, touchmove and touchend)</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/faq/348373.html" title="Detailed explanation of image drawing examples in HTML5 canvas 9" class="aBlack">Detailed explanation of image drawing examples in HTML5 canvas 9</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/faq/348374.html" title="Regular expressions and new HTML5 elements" class="aBlack">Regular expressions and new HTML5 elements</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/faq/348469.html" title="How to combine NodeJS and HTML5 to drag and drop multiple files to upload to the server" class="aBlack">How to combine NodeJS and HTML5 to drag and drop multiple files to upload to the server</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({}); </script><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Public welfare online PHP training,Help PHP learners grow quickly!</p></div><div class="footermid"><a href="https://m.php.cn/about/us.html">About us</a><a href="https://m.php.cn/about/disclaimer.html">Disclaimer</a><a href="https://m.php.cn/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved </p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) { var _times = times || -1, //100次 _interval = interval || 20, //20毫秒每次 _self = this, _selector = this.selector, //选择器 _iIntervalID; //定时器id if( this.length ){ //如果已经获取到了,就直接执行函数 func && func.call(this); } else { _iIntervalID = setInterval(function() { if(!_times) { //是0就退出 clearInterval(_iIntervalID); } _times <= 0 || _times--; //如果是正数就 -- _self = $(_selector); //再次选择 if( _self.length ) { //判断是否取到 func && func.call(_self); clearInterval(_iIntervalID); } }, _interval); } return this; } $("table.syntaxhighlighter").wait(function() { $('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>"); }); $(document).on("click", ".cnblogs_code_footer",function(){ $(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide(); }); $('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}}); </script></body><!-- Matomo --><script> var _paq = window._paq = window._paq || []; /* tracker methods like "setCustomDimension" should be called before "trackPageView" */ _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); (function() { var u="https://tongji.php.cn/"; _paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setSiteId', '9']); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s); })(); </script><!-- End Matomo Code --></html>