<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body style="background-color: darkgray;margin: 0px">
<!-- 无序列表 -->
<ul>
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ul>
<!--无序列表实体圆-->
<ul type="disk">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ul>
<!--无序列表空心圆-->
<ul type = "circle">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ul>
<!--无序列表实体方块-->
<ul type = "square">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ul>
<hr/>
<!--------------------------------------------------------------------------------------------->
<!--有序列表-->
<ol>
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol type ="a">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol type ="A">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol type = "i">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol type = "I">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol start="2">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<hr/>
<!--------------------------------------------------------------------------------------------->
<!--列表嵌套-->
<ul>
<li>
<ol>
<li>嵌套1</li>
<li>嵌套2</li>
</ol>
</li>
<li>喝喝</li>
</ul>
<!--------------------------------------------------------------------------------------------->
<!--html5布局方式-->
<!--div布局-->
<style type = "text/css">
div#divTop {
width: 100%;
height:10%;
background-color: aqua
}
div#divMenu{
width:30%;
height:80%;
float: left;
background-color: blue
}
div#divContent{
width:70%;
height:80%;
background-color: chartreuse;
float:left
}
div#divBottom{
width: 100%;
height: 10%;
background-color: greenyellow;
clear:both;
}
</style>
<div style = "width:100%;height: 950px;">
<div id = "divTop" >top</div>
<div id = "divMenu">menu</div>
<div id = "divContent">content</div>
<div id = "divBottom">bottom</div>
</div>
<!--table布局 应当通过td设置宽和高-->
<hr/>
<br/>
<table style="width: 100%;height: 950px">
<tr style = "background-color: aqua" >
<td colspan = "2" style ="width: 100%;height: 10%">top</td>
</tr>
<tr >
<td style="background-color:blue;width: 30%;height:80%">
menu
</td>
<td style = "background-color: chartreuse;width: 70%;height: 80%">
content
</td>
</tr>
<tr style = "background-color: greenyellow;">
<td colspan = "2" style = "width:100%;height: 10%" > bottom</td>
</tr>
</table>
</body>
</html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body style="background-color: darkgray;margin: 0px">
<!-- 无序列表 -->
<ul>
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ul>
<!--无序列表实体圆-->
<ul type="disk">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ul>
<!--无序列表空心圆-->
<ul type = "circle">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ul>
<!--无序列表实体方块-->
<ul type = "square">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ul>
<hr/>
<!--------------------------------------------------------------------------------------------->
<!--有序列表-->
<ol>
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol type ="a">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol type ="A">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol type = "i">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol type = "I">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<ol start="2">
<li>标题1</li>
<li>标题2</li>
<li>标题3</li>
</ol>
<hr/>
<!--------------------------------------------------------------------------------------------->
<!--列表嵌套-->
<ul>
<li>
<ol>
<li>嵌套1</li>
<li>嵌套2</li>
</ol>
</li>
<li>喝喝</li>
</ul>
<!--------------------------------------------------------------------------------------------->
<!--html5布局方式-->
<!--div布局-->
<style type = "text/css">
div#divTop {
width: 100%;
height:10%;
background-color: aqua
}
div#divMenu{
width:30%;
height:80%;
float: left;
background-color: blue
}
div#divContent{
width:70%;
height:80%;
background-color: chartreuse;
float:left
}
div#divBottom{
width: 100%;
height: 10%;
background-color: greenyellow;
clear:both;
}
</style>
<div style = "width:100%;height: 950px;">
<div id = "divTop" >top</div>
<div id = "divMenu">menu</div>
<div id = "divContent">content</div>
<div id = "divBottom">bottom</div>
</div>
<!--table布局 应当通过td设置宽和高-->
<hr/>
<br/>
<table style="width: 100%;height: 950px">
<tr style = "background-color: aqua" >
<td colspan = "2" style ="width: 100%;height: 10%">top</td>
</tr>
<tr >
<td style="background-color:blue;width: 30%;height:80%">
menu
</td>
<td style = "background-color: chartreuse;width: 70%;height: 80%">
content
</td>
</tr>
<tr style = "background-color: greenyellow;">
<td colspan = "2" style = "width:100%;height: 10%" > bottom</td>
</tr>
</table>
</body>
</html>
209
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
