基本标签
<!DOCTYPE html>
<html></html>
<html>
<head></head>
</html>
<html>
<head>
<titlle>这是网页的标题</title>
</head>
</html>
<!DOCTYPE html>
<html>
<head></head>
<body></body>
</html>
<!DOCTYPE html>
<html>
<head></head>
<body>
<h1>这是一级标题</h1>
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>
<h4>这是四级标题</h4>
<h5>这是五级标题</h5>
<h6>这是六级标题</h6>
</body>
</html>
<!DOCTYPE html>
<html>
<head></head>
<body>
<p>段落内容</p>
</body>
</html>
<br/>
<hr/>
<strong></strong>
<em></em>
>
<
©
下面是简单示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>基本标签</title>
</head>
<body>
<h1>这是一级标题</h1>
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>
<h4>这是四级标题</h4>
<h5>这是五级标题</h5>
<h6>这是六级标题</h6>
<p>成就最好的自己</p>
<p>服务祖国和人民</p>
<hr/>
成就最好的自己<br/>
服务祖国和人民<br/>
<p><strong>追求卓越</strong></p>
<p><em>追求卓越</em></p>
<p>追 求 卓 越</p>
<p>></p>
<p><</p>
<p>©钱小强</p>
</body>
</html>
图片
<img src="图片地址" alt="默认返回的图片的替代文字(找不到图片时会显示)"
title="鼠标悬停时的提示文字" width="图片宽度" height="图片高度"/>
下面是简单示例
<!DOCTYPYE html>
<html>
<head>
<meta charset="utf-8">
<title>图像标签</title>
</head>
<body>
<img src="D:\Media\Pictures\图像标签.png" alt="嘿嘿,找不到吧"
title="钱小强的个人主页" width="800px" height="500px"/>
<a href="超链接标签.html#down">点击去底部</a>
</body>
</html>
超链接
<a href="跳转页面的地址" target="打开方式">文本或图片</a>
<a name="标记名">文本</a>
<a href="#标记名">文本</a>
<a href="mailto:邮箱地址">文本</a>
下面是简单示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>超链接标签</title>
</head>
<body>
<a name="top">页面顶部</a><br/>
<a href="基本标签.html" target="_blank">点击跳转页面</a><br/>
<a href="https://www.baidu.com" target="_self">点击跳转到百度</a><br/>
<a href="基本标签.html">
<img src="D:\Media\Pictures\图像标签.png" alt="嘿嘿,找不到吧"
title="钱小强的个人主页" width="800px" height="500px"/>
</a>
<p>
<img src="D:\Media\Pictures\图像标签.png" alt="嘿嘿,找不到吧"
title="钱小强的个人主页" width="800px" height="500px"/>
</p>
<p>
<img src="D:\Media\Pictures\图像标签.png" alt="嘿嘿,找不到吧"
title="钱小强的个人主页" width="800px" height="500px"/>
</p>
<p>
<img src="D:\Media\Pictures\图像标签.png" alt="嘿嘿,找不到吧"
title="钱小强的个人主页" width="800px" height="500px"/>
</p>
<a href="#top">点击去顶部</a><br/>
<a href="mailto:...@qq.com">点击发邮件</a><br/>
<a name="down">页面底部</a>
</body>
</html>
列表
<ol>
<li></li>
<li></li>
</ol>
<ul>
<li></li>
<li></li>
</ul>
<dl>
<dt></dt>
<dd></dd>
</dl>
下面是简单示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>列表学习</title>
</head>
<body>
<ol>
<li>语文</li>
<li>数学</li>
<li>英语</li>
<li>生物</li>
</ol>
<hr/>
<ul>
<li>语文</li>
<li>数学</li>
<li>英语</li>
<li>生物</li>
</ul>
<hr/>
<dl>
<dt>学科</dt>
<dd>语文</dd>
<dd>数学</dd>
<dd>英语</dd>
<dd>生物</dd>
</dl>
<dl>
<dt>年级</dt>
<dd>高一</dd>
<dd>高二</dd>
<dd>高三</dd>
</dl>
</body>
</html>
表格
<table border="给表格设置边框">
<tr>
<td rowspan="跨行扩展的行数" colspan="跨列扩展的列数"></td>
</tr>
</table>
下面是简单示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>表格学习</title>
</head>
<body>
<table border="1px">
<tr>
<td colspan="3">学生成绩</td>
</tr>
<tr>
<td rowspan="2">小明</td>
<td>语文</td>
<td>100</td>
</tr>
<tr>
<td>数学</td>
<td>100</td>
</tr>
<tr>
<td rowspan="2">小强</td>
<td>语文</td>
<td>100</td>
</tr>
<tr>
<td>数学</td>
<td>100</td>
</tr>
</table>
</body>
</html>
媒体元素
<video src="视频地址" controls autoplay></video>
<audio src="音频地址" controls autoplay></audio>
内联框架
<iframe src="链接页面的地址" name="框架标识名" width="框架宽度" height="框架高度">
</iframe>
下面是简单示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>内联框架</title>
</head>
<body>
<iframe src="基本标签.html" width="800px" height=""500px></iframe>
<iframe src="" name="hello" width="800px" height="500px"></iframe>
<a href="基本标签.html" target="hello">点击在框架中打开</a>
</body>
</html>
表单
<form action="表单提交的地址" method="提交方式">
各种表单标签
</form>
<input type="text" name="表单元素的名称" value="默认初始值"
maxlength="可输入文本的最大长度" size="文本框的长度"/>
<input type="password" name="表单元素的名称" value="默认初始值"/>
<input type="radio" name="组名" value="单选框的值" checked/>
<input type="checkbox" name="组名" value="多选框的值" checked/>
<input type="button" value="按钮上的文字"/>
<input type="image" src="图片路径"/>
<input type="submit" value="按钮上的文字"/>
<input type=""reset value="按钮上的文字"/>
<select>
<option value="选项值" selected>选项内容</option>
</select>
<textarea rows="行数" cols="列数">默认内容</textarea>
<input type="file"/>
<input type="email"/>
<input type="url"/>
<input type="number" max="最大值" min="最小值" step="步长"/>
<inpute type="range" max="最大值" min="最小值" step="步长"/>
<input type="search"/>
下面是简单示例
<html>
<head>
<meta charset="utf-8">
<title>表单学习</title>
</head>
<body>
<h1>登录注册</h1>
<form action="基本标签.html" method="post">
<p>用户名:
<input type="text" name="username" value="你好" maxlength="8" size="25" readonly>
</p>
<p>密码:
<input type="password" name="pwd" hidden>
</p>
<p>性别:
<input type="radio" name="gender" value="boy">男
<input type="radio" name="gender" value="girl" checked>女
</p>
<p>爱好:
<input type="checkbox" name="hobby" value="code">编程
<input type="checkbox" name="hobby" value="music" checked>音乐
<input type="checkbox" name="hobby" value="dance">舞蹈
</p>
<p>普通按钮:
<input type="button" name="btn" value="点击">
</p>
<p>图像按钮:
<input type="image" src="D:\Media\Pictures\1.png">
</p>
<p>国家:
<select name="country">
<option value="china">英国</option>
<option value="usa">美国</option>
<option value="india" selected>印度</option>
</select>
</p>
<p>个人简介:<br/>
<textarea cols="30" rows="10">请介绍一下你自己</textarea>
</p>
<p>
<input type="file" name="files">
<input type="button" value="上传" name="upload">
</p>
<p>邮箱:
<input type="email" name="email" required>
</p>
<p>URL:
<input type="url" name="url" placeholder="请输入url">
</p>
<p>商品数量:
<input type="number" name="num" max="100" min="0" step="2">
</p>
<p>音量:
<input type="range" name="voice" min="0" max="100" step="2">
</p>
<p>搜索:
<input type="search" name="search"/>
</p>
<p>自定义邮箱:
<input type="text" pattern="^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$">
</p>
<p>
<input type="submit" value="提交">
<input type="reset" value="重置" disabled>
</p>
</form>
</body>
</html>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)