前端---HTML

本文详细介绍了HTML中的表格、列表(包括有序、无序和自定义),表格的创建与属性设置,文本表单元素如文本框、密码框、单选和复选框,以及表单提交和框架结构(frameset和iframe)的使用方法。

列表

HTML 支持有序、无序和定义列表
1、有序列表
<ol> </ol>
属性:type:序号类型
start:起始序号、reversed: 倒序

<ol type=“1”>

2、无序列表
无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆
圈)进行标记。无序列表适合成员之间无级别顺序关系的情况
无序列表使用 <ul> </ul>标签
属性: type:序号样式 disc 实心圆
circle 心圆 square实心方框

<ul type="square>

3、自定义列表
自定义列表以 <dl> 标签开始。
每个自定义列表项以 <dt> 开始。
每个自定义列表项的定义以 <dd> 开始
自定义列表中的一个术语名可以对应多重定义或者多个术语名对应
同一个定义,如果只有术语名或者只有定义也是可行的,也就是说

在其中数量不限、对应关系不限

表格

表格由**<table**>标签来定义。每个表格均有若干行,由**<tr**>标签定
义),每行被分割为若干单元格由 <td>标签定)。字母 td 指表
格数据(table data),即数据单元格的内容。数据单元格可以包含
文本、图片、列表、段落、表单、水平线、表格等等。

<table>…</table>:定义表格
<th>…</th>:定义表格的标题栏(文字加粗)
<tr>…</tr>:定义表格的行
<td>…</td>:定义表格的列

实操:
<table border=“1”>
<tr>
<td>联系人**</td**>
<td>联系方式**</td**>
</tr>
</table>

有以下两个属性,用于调整 HTML 表格中单元格的空间:
cellspacing 属性-定义表格单元格之间的空间
==cellpadding ==属性-表示单元格边框与单元格内容之间的距离

如果要将两个或多个列合并为一个列,使用 colspan 属性
如果要合并两行或更多行,则将使用 ==rowspan ==属性。

表单

表单:HTML 表单用于收集不同类型的用户输入表单
**<from action="'> </from>

文本表单:
通过 **<input type="text"**> 标签来设定,当用户要在表单中键入
字母、数字等内容时,就会用到文本域
密码字段通过标签 **<input type="password**">
注意:密码字段字符不会明文显示,而是以星号或圆点替代
演练:

**form action="">
	**<label for="user"**>邮箱:**</label><input type="text" name="" id=""/**>	
	**<label for="paw"**>密码:**</label><input type="password" name="" id=""/**>
	**</form**>**			


单选按钮:
**<input type="radio"**> 标签定义了表单单选框选项

<form action="">
<input type="radio" name="sex" value="male">男<br>
<input type="radio" name="sex" value="female">女
</form>

复选框(Checkboxes)
**<input type="checkbox"**> 定义了复选框. 用户需要从若干给定的
选择中选取一个或若干选项。

**<form>
<input type="checkbox" name="vehicle" value="Bike">我喜欢自行车<br>
<input type="checkbox" name="vehicle" value="Car">我喜欢小汽车
</form>**

提交按钮 (Submit Button)
<input type="submit"> 定义了提交按钮.

当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的
动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常
会对接收到的输入数据进行相关的处理

框架

1、整合框架
<frameset></frameset>

2、内联框架
<iframe></iframe>
属性:width 宽;height 高
scrolling 规定是否在框架中显示滚动条src 规定在 iframe 中引入的 URI

iframe - 设置高度与宽度
height 和 width 属性用来定义iframe标签的高度与宽度。
属性默认以像素为单位(px)

<iframe loading="lazy" src="demo_iframe.htm" width="200" height="200"></iframe>
iframe 可以显示一个目标链接的页面

**目标链接的属性必须使用 iframe 的属性**

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值