
下面的例子指定边框的颜色,和th元素的文本和背景颜色:
例<html>
<head><style>
table, td, th
{
border:1px solid green;
}
th
{
background-color:green;
color:white;
}
</style></head><body>
<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Savings</th>
</tr>
<tr>
<td>Peter</td>
<td>Griffin</td>
<td>$100</td>
</tr></table></body></html>
<html><title>此处是浏览器所显示的网页名字</title>
<h4>请把此行和倒数第二行删掉,只是说明一下,1到12jpg是你的名字,200是的大小,</h4>
<table border="1">
<tr>
<td><a href="1jpg" target="_blank"><img src="1jpg" width="200" height="200" /></a><p></p>说明</td>
<td><a href="2jpg" target="_blank"><img src="2jpg" width="200" height="200" /></a><p></p>说明</td>
<td><a href="3jpg" target="_blank"><img src="3jpg" width="200" height="200" /></a><p></p>说明</td>
<td><a href="4jpg" target="_blank"><img src="4jpg" width="200" height="200" /></a><p></p>说明</td>
</tr>
<tr>
<td><a href="5jpg" target="_blank"><img src="5jpg" width="200" height="200" /></a><p></p>说明</td>
<td><a href="6jpg" target="_blank"><img src="6jpg" width="200" height="200" /></a><p></p>说明</td>
<td><a href="7jpg" target="_blank"><img src="7jpg" width="200" height="200" /></a><p></p>说明</td>
<td><a href="8jpg" target="_blank"><img src="8jpg" width="200" height="200" /></a><p></p>说明</td>
</tr>
<tr>
<td><a href="9jpg" target="_blank"><img src="9jpg" width="200" height="200" /></a><p></p>说明</td>
<td><a href="10jpg" target="_blank"><img src="10jpg" width="200" height="200" /></a><p></p>说明</td>
<td><a href="11jpg" target="_blank"><img src="11jpg" width="200" height="200" /></a><p></p>说明</td>
<td><a href="12jpg" target="_blank"><img src="12jpg" width="200" height="200" /></a><p></p>说明</td>
</tr>
</table>
<marquee><h5><font color="#FF0000"> 零晨易点工作室</font></h5></marquee>
</html>
<!DOCTYPE
html
PUBLIC
"-//W3C//DTD
XHTML
10
Transitional//EN"
"
http://wwww3org/TR/xhtml1/DTD/xhtml1-transitionaldtd">
<html
xmlns="
http://wwww3org/1999/xhtml">
<head>
<meta
http-equiv="Content-Type"
content="text/html;
charset=utf-8"
/>
<title>无标题文档</title>
<style
type="text/css">
table{border-collapse:collapse;
text-align:center;
margin:0
auto}
table
tr
td{border:1px
#999
solid;
padding:5px;
width:100px}
table
header{background:#E1E1E1}
table
header:hover{text-decoration:none}
table
tr{background:#EFEFEF}
table
tr:hover{text-decoration:underline}
</style>
</head>
<body>
<table>
<caption>各网站的股票报价(来源:网易财经)</caption>
<tr
class="header">
<td>网站</td>
<td>今开</td>
<td>昨收</td>
<td>最高</td>
<td>最低</td>
<td>最新价</td>
</tr>
<tr>
<td>谷歌</td>
<td>50274</td>
<td>49996</td>
<td>50274</td>
<td>48511</td>
<td>48850</td>
</tr>
<tr>
<td>百度</td>
<td>7610</td>
<td>7419</td>
<td>7858</td>
<td>7566</td>
<td>7631</td>
</tr>
<tr>
<td>网易</td>
<td>3105</td>
<td>3036</td>
<td>3345</td>
<td>3105</td>
<td>3333</td>
</tr>
</table>
</body>
</html>
<table border="1" width="500px">
<tr>
<td colspan="5" align="center">个人简历表</td>
</tr>
<tr>
<td width="80px">姓名</td>
<td width="120px"> </td>
<td width="80px">性别</td>
<td width="120px">
<input type="radio" value="男" />男
<input type="radio" value="女" />女
</td>
<td rowspan="4" width="100px"> </td>
</tr>
<tr>
<td>出身年月</td>
<td> </td>
<td>政治面貌</td>
<td> </td>
</tr>
<tr>
<td>学历</td>
<td> </td>
<td>专业</td>
<td> </td>
</tr>
<tr>
<td>语言等级</td>
<td> </td>
<td>第二语言</td>
<td><input type="checkbox" value="英" />英
<input type="checkbox" value="日" />日
<input type="checkbox" value="法" />法</td>
</tr>
<tr>
<td>联系电话</td>
<td> </td>
<td>电子信箱</td>
<td colspan="2"> </td>
</tr>
<tr>
<td colspan="5">特长或证书</td>
</tr>
<tr>
<td colspan="5">联系地址</td>
</tr>
<tr>
<td>其他</td>
<td>qq</td>
<td> </td>
<td>msn</td>
<td> </td>
</tr>
<tr>
<td>个人主页:</td>
<td colspan="4"> </td>
</tr>
<tr>
<td colspan="4">教育背景</td>
</tr>
<tr>
<td colspan="2">
<select>
<option></option>
</select>
年
<select>
<option></option>
</select>
月
<select>
<option></option>
</select>
日
</td>
<td colspan="3">
最终学历
</td>
</tr>
</table>
存入<body>里面就行了
我这用记事本写的,具体格式你自己调一下就行,就是之间的距离和的宽高
<html><head></head>
<body>
<table>
<tr>
<td>
<div style="width:180px;height:220px">
<img style="width:160px;height:200px" alt="" src="3jpg">
</div>
<p>QQQQQQQQQQQQ</p>
<p>qqqqqqqqqqqq</p>
</td>
<td>
<div style="width:180px;height:220px">
<img style="width:160px;height:200px" alt="" src="3jpg">
</div>
<p>QQQQQQQQQQQQ</p>
<p>qqqqqqqqqqqq</p>
</td>
<td>
<div style="width:180px;height:220px">
<img style="width:160px;height:200px" alt="" src="3jpg">
</div>
<p>QQQQQQQQQQQQ</p>
<p>qqqqqqqqqqqq</p>
</td>
</tr>
<tr>
<td>
<div style="width:180px;height:220px">
<img style="width:160px;height:200px" alt="" src="3jpg">
</div>
<p>QQQQQQQQQQQQ</p>
<p>qqqqqqqqqqqq</p>
</td>
<td>
<div style="width:180px;height:220px">
<img style="width:160px;height:200px" alt="" src="3jpg">
</div>
<p>QQQQQQQQQQQQ</p>
<p>qqqqqqqqqqqq</p>
</td>
<td>
<div style="width:180px;height:220px">
<img style="width:160px;height:200px" alt="" src="3jpg">
</div>
<p>QQQQQQQQQQQQ</p>
<p>qqqqqqqqqqqq</p>
</td>
</tr>
</table>
</body>
</html>
<html>
<head></head>
<body>
<table border="1">
<tr>
<td>1<table>
<tr><td>1</td></tr>
</table>
</td>
<td>2</td>
</tr>
<tr>
<td>4</td>
<td>3<table border="0">
<tr><td>3</td></tr>
</table>
</td>
</tr>
</table>
</body>
</html>
<html>
<head>
<title></title>
</head>
<body>
<!--这里开始是表格代码-->
<table border="1" width="200" height="200">
<!--1是边框的宽度 width是 表格的宽度 height是高度-->
<!--每一个<tr></tr>包含的就是一行。每个<td></td>包含的就是那一行的列-->
<tr><td>1</td><td>2</td></tr>
<tr><td>3</td><td>4</td></tr>
<tr><td>5</td><td>6</td></tr>
<tr><td>7</td><td>8</td></tr>
</table>
<!--1到8改成你想要的内容 这里是表格代码结束-->
</body>
</html>
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)