侧边栏壁纸
博主头像
落叶人生博主等级

走进秋风,寻找秋天的落叶

  • 累计撰写 130555 篇文章
  • 累计创建 28 个标签
  • 累计收到 9 条评论
标签搜索

目 录CONTENT

文章目录

我的第一个页面html

2024-05-10 星期五 / 0 评论 / 0 点赞 / 7 阅读 / 6829 字

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <link rel="stylesheet" type="text/css"charset="utf-8" href="css2.css">
 </head>
 <body class="body">
 <div class="topnavi">
    <div class="topnavi1 db fl">
    <ul>
    <li>首页 |</li>
    <li style="color:red;">会员</li>
    <li>保真房</li>
    <li style="color:#45B035;">APP下载</li>
    <li>服务热线:400-999-3535 9:00-20:00</li>
    </ul>
    </div>
        <div class="topnavi2 rt">
        <a><span>登录<span></a>
        <a><span>注册<span></a>
        </div>
 </div>
    <div class="ad">
    <img src="ad.png">
    </div>
        <!--第三个导航-->
        <div class="navi_1">
        <img class="navi_img" src="d.png">
            <div class="open db">
            <a class="openb db" href="#" onmouseover="tableb.style.display='block';"onmouseout="tableb.style.display='none';">北京</a>
            </div>
                <div id="tableb">
                <span>城市选择</span>
                <ul><li>北京</li><li>北京</li><li>北京</li><li>北京</li><li>北京</li></ul>
                <ul><li>北京</li><li>北京</li><li>北京</li><li>北京</li><li>北京</li></ul>
                <ul><li>北京</li><li>北京</li><li>北京</li><li>北京</li><li>北京</li></ul>
                <ul><li>北京</li><li>北京</li><li>北京</li><li>北京</li><li>北京</li></ul>
                <ul><li>北京</li><li>北京</li><li>北京</li><li>北京</li><li>北京</li></ul>
                <ul><li>北京</li><li>北京</li><li>北京</li><li>北京</li><li>北京</li></ul>
                </div>
            </div>
 </body>
</html>
--------------------------------------------------------------------------------------------分割-------css--------------

/*重置*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0;padding:0;}
table {border-collapse:collapse;border-spacing:0;}
fieldset,img { border:0;}
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}
q:before,q:after {content:'';}
abbr,acronym { border:0;}
/*通用样式*/
.fl{
 float:left;
}
.rt{
float:right;
}
.db{
 display:inline-block;
}
/*body背景*/
.body{
 background-color:#EEEEEE;
}
/*用户登录*/
.topnavi{
 position:relative;
 width:1920px;
 height:30px;
 border:1px solid white;
 background-color:white;
 
}
/*span1*/
# span1{
font-size:50px;
}
.topnavi1{
 position:absolute;
 left:463px;
 top:9px;

}
.topnavi1 li{
 float:left;
 font-size:13px;
 font-family:"黑体";
 display:inline-block;
 margin-left:8px;
 }
.topnavi2 a span{
 font-size:13px;
 font-family:"黑体";
 display:inline-block;
 margin-left:8px;
 }
 .topnavi2{
  position:absolute;
  left:1360px;
  top:7px;
 }
 /*第二个导航栏*/
.navi_1{
 position:relative;
 width:1920px;
 height:88px;
 background-color:white;
}
.navi_1 img{
 position:absolute;
 left:464px;
 top:11px;
}
.openb{
 position:absolute;
 text-decoration:none;
 left:797px;
 top:43px;
 font-size:15px;
 color:black;
 font-family:"微软雅黑"
}
/*表格*/
#tableb span{
 display:block;
 font-size:14px;
 font-family:"微软雅黑"

}
#tableb{
 position:relative;
 box-sizing:border-box;width:292px;height:187px;
 border:2px solid #EEEEEE;
 background-color:white;
 float:left; 
 left:680px;
 top:66px;
 display:none;

}
#tableb ul{
float:left;


}
#tableb li{
 line-height:23px;
 font-family:"微软雅黑";
 font-size:15px;
 margin-left:14px;

}
 

广告 广告

评论区