百度的搜索结果页面_百度搜索结果界面开发-CSDN博客

本文链接：https://blog.csdn.net/Jackson27/article/details/100637266

在这里插入图片描述

 <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>百度搜索页面</title>
        <style>
            .input {
                width: 600px;
                height: 30px;
                background-position: right;
                background-size: 23px;
                border: 1px solid #59aaff;
                font-size: 20px;
                vertical-align: middle;
                float: left;
            }
    
            .btn {
                height: 34px;
                width: 100px;
                background-color: #59aaff;
                border-color: #59aaff;
                color: white;
                font-size: 15px;
                vertical-align: middle;
                float: left;
            }
    
            .a {
                font-size: 13px;
                line-height: 34px;
                margin-right: 10px;
                color: black;
            }
    
            .a2 {
                font-size: 15px;
                margin-right: 12px;
                line-height: 38px;
                width: 54px;
                height: 36px;
                color: gray;
                text-decoration: none;
            }
    
            .a2:hover {
                color: black;
            }
            .a3{
                font-size: 12px;
                color: #222eff;
            }
            .a4{
                font-size: 13px;
                color: #A9A9A9;
            }
        </style>
    </head>
    <body>
    <div style="height: 500px;margin: auto">
        <div style="height: 45px;">
            <div style="position: relative;height: 34px;float:left;">
                <img src="pic2.png" style="height: 34px;width: 100px;float: left">
                <input type="text" name="baidu" value="" class="input" >
                <input type="button" name="ensure" value="百度一下" class="btn">
            </div>
            <div style="position: relative;height: 34px;float:right;">
                <a href="" class="a">百度首页</a>
                <a href="" class="a">设置</a>