HTML超链接表格列表表单
⽬录
⼀、HTML超链接
超链接可以是⼀个字,⼀个词,或者⼀组词,也可以是⼀幅图像,可以点击这些内容来跳转到新的⽂档或者当前⽂档中的某个部分。超链接标签:<a>⼀个链接到另⼀个链接 【Anchor 锚】
<a href='url地址' target='页⾯打开的⽅式'>页⾯元素(⽂字、图像、⾳频、视频)</a>
'href'属性:值是要跳转的页⾯的地址,通常⽤'#'表⽰空链接
'target'属性:新页⾯打开的⽅式,取值有'_self'和'_blank'
'_self'表⽰在原窗⼝打开页⾯,是'target'属性的默认值
'_blank'表⽰在新窗⼝中打开页⾯
1.外部链接
<a href="www.baidu" target="_blank">百度</a>>
2.内部链接
<a href="简介.html">百度公司简介</a>
3.空链接 #
<a href="#">地址</a>
4.下载链接
地址是⽂件.exe或zip等压缩形式
<a href="图⽚_.zip">下载图⽚</a>
5.⽹页元素的链接
<a href="www.baidu"><img src="图⽚_.jpg" /></a>
6.锚点链接
什么是锚点链接? 可以快速定位到该页⾯中某个位置
href属性中,设置属性值为#名字,到⽬标标签,添加⼀个id属性=刚才的名字
<a href=”#Two”></a>
<h3 id=”Two”></h3>
⼆、表格
1.表格标签的属性
<table> 表格
<tr> ⾏
<td> 单元格
<th> 表头单元格,⽂字加粗显⽰,居中
<thead></thead>和<tbody></tbody> 将写的内容折叠起来
<table>
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
</table>
2.合并单元格
跨⾏合并:
<td rowspan="2"></td>
跨列合并:
<td colspan =”2”></td>
三、列表
1.⽆序列表
⽆序列表是⼀个项⽬的列表,此列项⽬使⽤粗体圆点(典型的⼩⿊圆圈)进⾏标记。
<ul>
<li>列表项1</li>
<li>列表项2</li>
</ul>
2.有序列表
有序列表也是⼀列项⽬,列表项⽬使⽤数字进⾏标记。
<ol>
html ul标签<li>列表项1</li>
<li>列表项2</li>
</ol>
3.⾃定义列表
⾃定义列表不仅仅是⼀列项⽬,⽽是项⽬及其注释的组合。
<dl>
<dt></dt>
<dd>列表项1</dd>
<dd>列表项2</dd>
</ul>
标签描述
<ul>有序列表
<ol>⽆序列表
<li>列表项
<dl>⾃定义列表
<dd>⾃定义项⽬
<dt>⾃定义的描述
四、表单
表单的作⽤: ⽤于收集⽤户信息。实现⽤户和⽹页之间的对话。
<form action=” url 地址” method=”提交⽅式” name=”表单域名称”>
</form>
1.表单标签
标签描述
<form>定义⽤户输⼊的表单
<input>定义输⼊域
<text>定义⽂本框
<lable>定义<input>元素的标签,⼀般为输⼊标题<button>定义按钮
<select>定义下拉选项列表
<option>定义下拉列表选项
<textarea>定义⽂本域
2.⽤户注册表单实例
<form action="demo.php" method="POST" name="name1">
<label for="n">⽤户名:</label><input type="text" name="username" value="请输⼊⽤户名" maxlength="8" id="n"> <br />密码:<input type="password" name="pwd"> <br />
性别 :男<input type="radio" name="sex" value="男" checked="checked">⼥<input type="radio" name="sex" value="⼥">
<br />
爱好:⾳乐 <input type="checkbox" name="hobby" value="⾳乐"> 阅读<input type="checkbox" name="hobby" value="阅读">体育<input type="checkbox" name="hobby" value="体育">
<br />
<input type="submit" value=" 注册新⽤户 "> <br />
<input type="reset" value="重新填写"><br />
<input type="button" value="获取验证码"><br />
上传头像:<input type="file"><br />
你喜欢的城市:
<select>
<option>深圳</option>
<option selected="selected">西安</option>
<option>三亚</option>
<option>青海</option>
<option>重庆</option>
</select>
<br />
请留⾔:
<textarea cols="15" rows="5">
</textarea>
</form>
效果如下:
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论