<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>列表和表格样式</title>
</head>
<body>
<div id="">
<!--<UL>表示一个无序列表，可以通过设置type属性来设置符号的种类，可以设置的属性值有disc（黑点），
circle（圆圈），square（方块），默认是disc。<LI>表示列表中的一个项目-->
<ul type="circle">
<li>我们像一首美丽的歌曲</li>
<li>变成两部悲伤的电影</li>
</ul>
<!--表示一个有序列表，可以通过设置type属性来改变编号的样式，可以设置的属性值有1（阿拉伯数字），
a（小写英文字母），A（大写英文字母），i（小写罗马数字），I（大写罗马数字），默认是1。<LI>表示列表中的一个项目-->
<ol>
<li>为什么你</li>
<li>带我走过最难忘的旅行</li>
</ol>
<ul>
<li style="font-size: 18px;color: lightgreen;">然后留下最痛的纪念品</li>
</ul>
<!--设置图片路径的src属性，设置宽度的width属性，设置高度的height属性，设置说明文字的alt属性-->
<!--设置链接目标地址的href属性，设置打开目标方式的target属性，target可以设置的属性值有_self（本窗口打开）,
_blank（新窗口打开），_parent（在父框架中打开），_top（在最外层框架中打开），默认是_self-->
<a href="###" target="_blank"><img src="img/img0.jpg" width="300" ><br style="text-align: center">突然好想你</br></a>
</div>
<div>
<!--设置宽度的width属性，设置高度的height属性，设置背景颜色的bgcolor属性，设置背景图片的background属性，设置边框线大小的border属性，
设置单元格填充大小的cellpadding属性，设置单元格间距大小的cellspacing属性，设置水平对齐方式的align属性-->
<table border="1" cellspacing="0" cellpadding="0" width="400" height="100" background="##">
<!--设置宽度的width属性，设置高度的height属性，设置背景颜色的bgcolor属性，
设置背景图片的background属性，设置水平对齐方式的align属性-->
<tr style="width: 200;height: 50; background: burlywood;" align="center">
<!--设置宽度的width属性，设置高度的height属性，设置背景颜色的bgcolor属性，设置背景图片的background属性，
合并纵向单元格的rowspan属性，合并横向单元格的colspan属性，设置水平对齐方式的align属性-->
<th >你会在哪里</th>
<th>过的快乐或委屈</th>
</tr>
<tr style="width: 200;height: 50; background: cyan;" align="center">
<td>突然好想你</td>
<td>突然锋利的回忆</td>
</tr>
<!--合并单元格：
<TABLE width="200" border="1" cellpadding="5" cellspacing="1" align="center">
<TR>
<TD>1</TD>
<TD>2</TD>
<TD rowspan="2">3</TD>
</TR>
<TR>
<TD>4</TD>
<TD>5</TD>
</TR>
</TABLE>
-->
</table>
</div>
<div>
<TABLE width="200" border="1" cellpadding="5" cellspacing="1" align="center">
<TR>
<TD>1</TD>
<TD>2</TD>
<TD colspan="2">3</TD>
</TR>
<TR>
<TD>4</TD>
<TD>5</TD>
<TD>6</TD>
<TD>7</TD>
</TR>
</TABLE>
</div>
</body>
</html>
<!--控制边框线的格式：
Border-top-width属性 上边框粗细
Border-bottom-width属性 下边框粗细
Border-left-width属性 左边框粗细
Border-right-width属性 右边框粗细
Border-width属性 上下左右边框粗细
Border-top-color属性 上边框颜色
Border-bottom-color属性 下边框颜色
Border-left-color属性 左边框颜色
Border-right-color属性 右边框颜色
Border-top-style属性 上边框样式，属性值有none无边框，solid实线，dotted点，dashed虚线，double双线，ridge凹线，outset立体效果
Border-bottom-style属性 下边框样式，属性值同上
Border-left-style属性 左边框样式，属性值同上
Border-right-style属性 右边框样式，属性值同上
Border-style属性 上下左右边框样式，属性值同上
控制宽度高度的格式：
Width属性 宽度
Height属性 高度
-->
sunny doll
列表和表格css样式
猜你喜欢
转载自www.cnblogs.com/mywawa/p/9070676.html
今日推荐
周排行