html5很强大
/*
css样式表代码
*/
body {
padding:0px;
margin:0px;
}
header {
height:50px;
width:100%;
background-color:blue;
}
main {
width:100%;
background-color:azure;
}
footer {
height:50px;
width:100%;
background-color:red;
}
.content {
width:800px;
display:inline-block;
margin:0px auto;
background:#00ff90;
}
.left_chunk {
width:300px;
height:460px;
display:inline-block;/*实现菜单基本都是用float属性来实现，float属性会造成高度塌陷，需要清除浮动等问题，使用inline-block实现就不需要在意这样的问题。*/
float:left;
background:#ffd800;
}
.right_chunk {
width:500px;
height:360px;
display:inline-block;/*实现菜单基本都是用float属性来实现，float属性会造成高度塌陷，需要清除浮动等问题，使用inline-block实现就不需要在意这样的问题。*/
float:right;
background:#808080;
}
/*
html页面代码
*/
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<link href="StyleSheet.css" rel="stylesheet" />
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
</head>
<body>
<form id="form1" runat="server">
<header>
我是header
</header>
<main>
<div class="content">
我是content
<div class="left_chunk">
</div>
<div class="right_chunk">
</div>
</div>
</main>
<footer>
我是footer
</footer>
</form>
</body>
</html>
扫一扫
997
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
