H5+CSS+JS:链接,表格
程序员文章站
2022-07-05 20:40:09
...
链接
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>链接</title>
</head>
<body>
<a href="http://www.jikexueyuan.com">点击我</a>
<a href="http://www.baidu.com">
<img src="images/2.jpg" width="400px" height="400px" alt="l00000ogoo"> <!--图片的长宽-->
</a>
<a name="tips">hello</a> <!--name标签指定的文档内的链接-->
<br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<a href="#tips">跳转到hello</a>
</body>
</html>
- name指定标签内的链接:回到顶部……
表格
- 表格行和列
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格</title>
</head>
<body>
<p>表格</p>
<table border="1">
<caption>表1</caption>
<tr>
<th>0</th>
<th>0</th>
<th>0</th>
</tr>
<tr>
<td>1</td>
<td></td>
<td>1</td>
</tr>
<tr>
<td>2</td>
<td>2</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
</table>
</body>
</html>
- 表格内的标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格</title>
</head>
<body>
<p>表格</p>
<table border="1">
<tr>
<td>第一列</td>
<td>第二列</td>
</tr>
<tr>
<td>
<ul>
<li>苹果</li>
<li>香蕉</li>
<li>菠萝</li>
</ul>
</td>
<td>
我想吃了
</td>
</tr>
<tr></tr>
</table>
</body>
</html>
- 单元格边距和单元格间距
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格</title>
</head>
<body>
<p>表格</p>
<table border="1">
<tr>
<td>第一列</td>
<td>第二列</td>
<td>第三列</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
<tr></tr>
</table>
<br/>
<table border="1" cellpadding="10"> <!--单元格边距-->
<caption>边距变大</caption>
<tr>
<td>第一列</td>
<td>第二列</td>
<td>第三列</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
<tr></tr>
</table>
<br/>
<table border="1" cellspacing="10"> <!--单元格间距-->
<caption>间距变大</caption>
<tr>
<td>第一列</td>
<td>第二列</td>
<td>第三列</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
<tr></tr>
</table>
</body>
</html>
- 背景颜色和背景
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格</title>
</head>
<body>
<p>表格</p>
<table border="1" bgcolor="#7fff00">
<caption>bgcolor</caption>
<tr>
<td>第一列</td>
<td>第二列</td>
<td>第三列</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
<tr></tr>
</table>
<br/>
<table border="1" background="images/1.png">
<caption>background</caption>
<tr>
<td>第一列</td>
<td>第二列</td>
<td>第三列</td>
</tr>
<tr>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
<tr></tr>
</table>
</body>
</html>