css+html实现模拟百度首页(附源码)?dw网页作业_HTML

css+html实现模拟百度首页(附源码)?dw网页作业

作者：admin　发布时间：2023-02-15　点击数：

本篇文章给大家带来的内容是关于css+html实现模拟百度首页（附代码），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>百度</title>
    <link rel="stylesheet" type="text/css" href="css/css.css"/>
</head>
<body>
<div class="header">
    <ul>
        <li><a href="#">新闻</a></li>
        <li><a href="#">hao123</a></li>
        <li><a href="#">地图</a></li>
        <li><a href="#">视频</a></li>
        <li><a href="#">贴吧</a></li>
        <li><a href="#">学术</a></li>
        <li><a href="#">设置</a></li>
        <li><a href="#">登录</a></li>
        <li class="end"><a href="#">更多产品</a></li>
    </ul>
</div>

<div class="main">
    <div class="logo"><img src="img/logo.png" ></div>
    <div class="form">
        <form action="">
            <input type="text">
            <button>百度搜索</button>
        </form>
    </div>
</div>

<div class="footer">
    <div class="t"><img src="img/ewm.jpg" alt=""><p>百度</p></div>
    <div class="m">
        <ul>
            <li><a href="#">把百度设为主页</a></li>
            <li><a href="#">关于百度</a></li>
            <li><a href="#">About Baidu</a></li>
            <li><a href="#">百度推广</a></li>
        </ul>
    </div>
    <div class="b">©2019 Baidu <a href="#">使用百度前必须</a><a href="#">意见反馈</a> 京ICP证030173号 <img src="img/icon_01.jpg" > <a href="#">京公网安备11000002000001号 <img src="img/icon_02.jpg" alt=""></a></div>
</div>
</body>
</html>

运行效果截图如下：

百度.png