首页 > 代码库 > H5 57-文章界面

H5 57-文章界面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>57-文章界面</title>
    <style>
        body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{
            margin:0;padding:0
        }
        body{
            background-color: #efefef;
        }
        div{
            margin:0 auto;
            box-sizing: border-box;
            width: 372px;
            height: 232px;
            border: 1px solid #666;
            padding: 15px;
        }
        h1{
            font-family:"微软雅黑";
            font-size: 18px;
            border-bottom: 1px solid #666;
            padding-bottom: 10px;
        }
        span{
            font-size: 14px;
        }
        ul{
            list-style: none;
            margin-top: 10px;
        }
        ul li{
            line-height: 30px;
            border-bottom: 1px dashed #666;
            font-family:"微软雅黑";
            font-size: 12px;
            color: #242424;
            padding-left: 20px;
        }
    </style>
</head>
<body>
<!--
1.清空所有的边距
2.从外向内, 从上至下的编写网页
-->
<div>
    <h1>最新文章<span>/New Articles</span></h1>
    <ul>
        <li>问中国:经济新活力篇 治国理政 长征</li>
        <li>问中国:民生保障不是"清谈馆"国平 国庆节</li>
        <li>李克强不忘棚户区改造10日至12日将视察澳门
        </li>
        <li>王岐山监督中央部委五大抓手:关键少数要加码</li>
        <li>李南江老师免费公开H5+跨平台开发教学视频</li>
    </ul>
</div>
</body>
</html>

 

H5 57-文章界面