bash ```
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> 菜鸟教程 (runoob.com)</title>
</head>
<body>
<a href="https://www.runoob.com"> 这是一个链接使用了 href 属性 </a>
<img src="/images/logo.png" width="258" height="39" />
</body>
</html>
<p> 这是一个段落 </p>
<a href="default.htm"> 这是一个链接 </a>
<br> 换行
<hr> 标签在 HTML 页面中创建水平线。
<!-- 这是一个注释 --> 以下是一个简单的 HTML 表格实例:
实例
<table>
<thead>
<tr>
<th> 列标题 1</th>
<th> 列标题 2</th>
<th> 列标题 3</th>
</tr>
</thead>
<tbody>
<tr>
<td> 行 1，列 1</td>
<td> 行 1，列 2</td>
<td> 行 1，列 3</td>
</tr>
<tr>
<td> 行 2，列 1</td>
<td> 行 2，列 2</td>
<td> 行 2，列 3</td>
</tr>
</tbody>
</table>
以上的表格实例代码中，<table> 元素表示整个表格，它包含两个主要部分：<thead> 和 <tbody>。
<thead> 用于定义表格的标题部分：在 <thead > 中，使用 <th > 元素定义
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>dfdd</title>
</head>
<body>
<h1> 葛秀京 </h1>
<a href="/get/news">
<img src="https://www.baidu.com/img/flexible/logo/pc/result.png">
</a>
</body>
<body>
<ul>
<li><a href="/get/news"> 新闻 </a></li>
<li><a href="/get/baike"> 百科 </a></li>
<li><a href="/get/zhidao"> 知道 </a></li>
<li><a href="/get/tieba"> 贴吧 </a></li>
</ul>
</body>
<table>
<thead>
<tr><th>ID</th> <th > 姓名 </th></tr>
</thead>
<tbody>
<tr> <td>10</td> <td>19</td></tr>>
<tr> <td>20</td> <td>20</td></tr>
<tr> <td>30</td> <td>21</td></tr>
</table>
<body>
<h1> 输入 </h1>
<input type="text" name="name" id="name" placeholder="请输入姓名">
<input type="file">
<input type="radio" name="n1"> 男
<input type="radio" name="n1"> 女
<input type="checkbox" name="n2"> 同意
<input type="button" value="提交" onclick="alert (' 提交成功 ')">
<input type="submit" value="提交">
</body>
<h1> 下拉框 </h1>
<select name="select" id="select">
<option value="1"> 选项 1</option>
<option value="2"> 选项 2</option>
<option value="3"> 选项 3</option>
</select>
</body>
<h1> 注册 </h1>
<body>
<form method="get" action="/get/news">
<label for="user"> 用户名:</label>
<input type="text" id="username" name="username" required>
<label for="password">密码:</label>
<input type="password" id="password" name="password" required>
<input type="submit" value="注册">
</body>
</html>
bash ```
bash 动画效果
<!DOCTYPE html>
<head> 标题
<link rel="stylesheet" href="css/div.css">
</head>
<body> 主体
<div class="box1"></div>
</body>
</html>
<style>
div{
width: 200px;
height: 200px;
border: 5px solid black;
background-color: red;
animation: dh 3s linear infinite;
}
div:hover{
animation: name duration timing-function delay iteration-count direction fill-mode;
animation-play-state: paused;
}
@keyframes dh{/*动画*/
0% {
opacity: 1;/*透明度*/
background-color: red;
width: 300px;
transform: rotate(0deg);
}
50% {
opacity: 0.3;
width: 100px;
background-color: yellow;
transform: rotate(180deg);
}
100% {
opacity: 0.7;
width:200px;
background-color: red;
transform: rotate(360deg);
}
}
</style>
