HTML+CSS百度网页制作 2.0

最新推荐文章于 2024-07-11 14:41:43 发布

白菜豆腐干

最新推荐文章于 2024-07-11 14:41:43 发布

阅读量195 css html webview

本文链接：https://blog.csdn.net/weixin_65717727/article/details/124912577

 <!DOCTYPEhtml>
<html lang="ch_CN">

<head>
    <meta charset="UTF-8">
    <title>百度首页</title>
    <style type="text/css">
        .top {
            width: 45%;
            height: 64px;
        }
        
        .top>.title {
            height: 64px;
            float: center;
        }
        
        .top>.title>span {
            line-height: 10px;
        }
        
        .top>.title>span>a {
            color: black;
            font-size: 15px;
            font-family: "宋体";
            text-decoration: none;
        }
        
        .top>.title>span>.body {
            font-weight: bold;
        }
        
        .body>.picture {
            text-align: center;
            margin-top: 10px;
        }
        
        .body>.search {
            text-align: center;
        }
        
        .body>.search>.abc>.input {
            width: 540px;
            height: 36px;
            margin-top: 0px;
        }
        
        .body>.search>.abc>.btn {
            text-align: center;
            width: 100px;
            height: 40px;
            margin-top: 10px;
            background: blue;
            color: white;
            font-size: 13px;
        }
        
        .foot {
            width: 100%;
            position: absolute;
            bottom: 0px;
        }
        
        .foot>.link {
            text-align: center;
            margin-bottom: 0px;
        }
        
        .foot>.link>a {
            font-size: 15px;
            font-family: "宋体";
            text-decoration: none;
        }
        
        .foot>.footer {
            text-align: center;
            font-size: 15px;
            font-family: "宋体";
        }
        
        .font>.footer>a {
            text-decoration: none;
            color: blue;
        }
        
        #yjbk {
            border: 2px solid blue;
            padding: 5px 15px;
            background: beige;
            width: 10px;
            border-radius: 15px;
        }
        
        
    </style>
</head>

<body>
    <div class="top">
        <div class="title">
            <span>
            <a class="body" href="https://www.baidu.com" >新闻</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a class="body" href="https://www.baidu.com">hao123</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a class="body" href="https://www.baidu.com">地图</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a class="body" href="https://www.baidu.com">直播</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a class="body" href="https://www.baidu.com">视频</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a class="body" href="https://www.baidu.com">贴吧</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a class="body" href="https://www.baidu.com">学术</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a href="https://www.baidu.com">更多</a>&nbsp;&nbsp;&nbsp;&nbsp;
            <a>设置</a>&nbsp;&nbsp;
            <a id="yjbk" >登录</a>
          </span>
        </div>
    </div>
    <div class="body">
        <div class="picture">
            <image src="C:\Users\86166\Desktop\前端基础案例\2\baidu.jpg.jpg" "widht="540 " height="258 " />
        </div>
        <div class="search ">
            <from class="abc " action="https://www.baidu.com/?tn=21002492_16_hao_pg ">
                <label for="search "></label>
                <input class="input " type="text " name="search " id="search " value=" " />
                <input class="btn " type="submit " value=" 百度一下 " name="submit " />
            </from>
        
    <div class="foot ">
        <div class="link ">
    
        
            <a href=" ">关于百度</a>
            <a href=" ">About Baidu</a>
            <a href=" ">使用百度前必读</a>
            <a href=" ">帮助中心</a>
            <a href=" ">京公网安备11000002000001号</a>
            <a href=" ">把百度设为主页</a>
            <a href=" ">意见反馈</a>
            <a href=" ">京ICP证030173号</a> 
            <a href=" ">@2022baidu</a>
        </div>
 </div>
</body>

</html>