这里是网页的基本框架
这里是HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="css/as.css"/>
</head>
<body class="fd">
<div class="maodian"><a href="#ok"><img src="img/cvgjbnj.png" title="回到顶部" class="sc"/></a></div>
<div class="sd" id="ok">
<ul>
<li>
<p>主页</p>
</li>
<li>
<p class="uh">VTC</p>
</li>
<li>
<p class="rf">交通</p>
</li>
<li>
<p class="xc"><img src="img/搜索-copy.svg" class="jn"/></p>
</li>
</ul>
</div>
<div> </div>
<div class="qw"></div>
<div> </div>
<div class="dibu"></div>
</body>
</html>这里是CSS
.fd{
background-color: #e4e4e4;
}
.qw {
width: 1000px;
height: 1000px;
text-align: center;
background-color: #ffffff;
margin: 0 auto;
text-align: center;
text-shadow: 10px 10px 5px #999;
border-radius:25px;
}
.sd{
width: 1510px;
height: 50px;
background-color: #ffffff;
border-radius:20px;
text-indent: 15em;
}
.po{
width: 60px;
height: 60px;
}
.dibu{
width: 1510px;
height: 60px;
background-color: #ffffff;
border-radius:25px;
}
.jn{
width: 20px;
height: 20px;
text-align: right;
}
.sc{
width: 60px;
height: 60px;
}
.maodian {
position: fixed;
top: 50%;
right: 20px;
border-radius: 50%;
font-size: 0;
overflow: hidden;
cursor: pointer;
}
ul {
display: flex;
list-style-type: none;
}
li {
margin-right: 10px;
}
.uh{
text-indent: 750px;
}
.rf{
text-indent: 20px;
}
.xc{
text-indent: 20px;
}
24万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
