简单的网页布局
2021-05-02 02:28
标签：org ext meta font container sheet jquer http 美工 作为一个美工烂到家的人，每次想写点网页都很痛苦。 备忘，待完善。 css： html： 简单的网页布局 标签：org ext meta font container sheet jquer http 美工 原文地址：https://www.cnblogs.com/wanjinliu/p/12134005.htmlbody {
background-color: #f2f2f2;
}
.container {
width: 90%;
margin: 0 auto;
}
.top {
text-align: center;
background-color: #FF5722;
}
.top-text {
font-size: 30px;
color: white;
display: inline-block;
margin-top: 30px;
margin-bottom: 25px;
}
.menu {
margin-top: 15px;
font-size: large;
}
a {
margin-left: 50px;
margin-right: 50px;
text-decoration:underline;
}
.content {
border-style: dashed;
border-width: 1px;
border-color: black;
margin-top: 15px;
text-align: center;
}
.span-text {
display: block;
padding-top: 15px;
padding-bottom: 15px;
}
.bottom {
text-align: center;
}
.bottom-text {
display: block;
margin-top: 20px;
}
DOCTYPE html>
html lang="en" xmlns="http://www.w3.org/1999/xhtml">
head>
meta charset="utf-8" />
title>title>
link rel="stylesheet" href="/layui/css/layui.css">
script src="/layui/layui.js">script>
script src="/js/jquery-3.4.1.min.js">script>
link rel="stylesheet" type="text/css" href="/css.css">
head>
body>
div class="container">
div class="top">span class="top-text">XXXspan>div>
div class="layui-row menu">
div class="layui-col-sm3">
a href="">XXXa>
div>
div class="layui-col-sm3">
a href="">XXXa>
div>
div class="layui-col-sm3">
a href="">XXXa>
div>
div class="layui-col-sm3">
a href="">XXXa>
div>
div>
div class="content">
span class="span-text">XXXspan>
div>
div class="bottom">span class="bottom-text">XXXspan>div>
div>
body>
html>
下一篇：jquery实现下拉