HTML基础（续1）_htmlrasize-CSDN博客

本文链接：https://blog.csdn.net/wdx1641670284/article/details/126612020

列表：

有序列表：<ol></ol>

有序列表格式：

<ol>
  <li>列表项</li>
  <li>列表项</li>
   ......
</ol>

无序列表：<ul></ul>

无序列表格式：

<ul>
 <li>列表项</li>
 <li>列表项</li>
...
<ul>

自定义列表：<dl></dl>

自定义列表格式：

<dl>
    <dt>术语/关键字</dt>
    <dd>对术语的解释</dd>
</dl>

换行：

<br>

表现类元素：

加粗：

<b>/</b>
<strong></strong>//建议使用这种 表示强调！

倾斜：

<i></i>
<em></em>
主旨表强调

上下标：
<sup></sup> 上标
<sub></sub> 下标

小号字体：

<small></small>

超链接：

<a href="" target=""></a>

href 连接前往的地址

target 连接打开方式默认在当前页面打开 _blank属性：在新窗口中打开连接。

锚点：

<div id=top"">头部</div>
<a href="#top">返回顶部</a>

每一个标签上都可以有一个id，并且id的值是唯一的锚链接
href的值是#id值

元素分类：

行内元素：

特点：

1.能和其他元素在一行上显示

2.宽度只与内容有关

3.行高，外边距，内边距等部分可控制

4.可以嵌套除了块元素之外的其他元素

元素
   <b></b>
   <strong></strong>
   <i></i>
   <em></em>
   <sup></sup>
   <sub></sub>
   <span></span>
   <a href=''></a>
   <small></small>
   <label></label>

块元素：

特点
   1.总是在新行上开始，独占一行
   2.默认宽度与浏览器有关，与内容无关
   3.高度，行高，内边距，外边距等均可控制
   4.可以嵌套任何元素（p元素除外）

元素
   <p></p>
   <h1></h1> ~ <h6></h6>
   <div></div>
   <ul></ul>
   <ol></ol>
   <dl></dl>
   <dd></dd>
   <dt></dt>
   <hr>
   <form></form>

行内元素：

特点：1.可以与其他元素在一行上显示

2.宽度，高度，行高，内边距，外边距等都可控制

元素：<img src=" " alt=" ">;<iframe src=" "></iframe>;<input type=" ">

水平线：

width 宽度；align 对齐方式 center 居中，left 居左对齐，right 居右对齐；color 水平线颜色

href与src的区别：

1.href标识超文本引用，用在link和a等元素上，href是引用和页面关联，是在当前元素和引用资源之间建立联系

2.src表示引用资源，表示替换当前元素，用在img，script，iframe上，src是页面内容不可缺少的一部分。src是source的缩写，是指向外部资源的位置，指向的内部会嵌入文档中当前标签所在的位置，在请求src资源时会将其指向的资源下载并应用到当前文档中，例如JS脚本，img图片和iframe等元素。

行内框架iframe：<iframe src="" width="" height=""></iframe>

效果：在本网页中引入其他网页进行显示。

src 用来引入网页路径；frameborder 框架边框默认有边框值为1，无边框值为0；scrolling 滚动条默认 auto 有 yes 无 no。

表格table：

基本结构：

基本结构
<table>
   <tr>
      <td>
      </td>
   </tr> 
</table>

1.<tr></tr>定义表格的行

2.<td></td>定义表格中行内的单元格

3.<th></th>定义表格中行内的单元格（标题），自动将文本加粗，居中对齐

table属性：

1.border 表格的边框

2.cellspacing 单元格与单元格之间的距离

3.cellpadding 内容与单元格四周的距离

4.bgcolor 背景颜色

5.bordercolor 边框颜色

6.align 表格水平对齐方式可 left、center、right

7.rules 规定表格内侧边框那部分可见（不建议使用） none位于行与列的线条均不可见；rows位于行的线条可见；cols位于列的线条可见；all位于行和列的线条均可见

8.valign 垂直方向对齐方式 top 居上对齐；middle垂直居中对齐；bottom 居下对齐。

9.合并单元格（td） colspan=" 合并的单元格数量" 水平合并单元格合并列；rowspan=" 合并单元格数量" 竖直合并单元格合并行。

表单form：表单<form action="" method=""> 用来表示采集数据的范围

action：行为/动作数据提交的路径

method：方法/方式数据提交的方式值含义：GET（默认值）提交的数据会出现在地址栏上相对来说不安全；获取， POST 提交。

输入框input：<input type= " " name=" " value=" ">

type类型：

    <input type="file" >文件上传框  multiple 提交多个文件属性
	<input type="text"> 文本框
	<input type="password"> 密码框
	<input type="radio" name=" ">  单选框 
		一组单选框的name值必须保持一致
	<input type="checkbox"> 复选框
	<input type="submit">提交按钮
	<input type="reset">重置按钮
	<input type="button">普通按钮
	<input type="image" src=“图片”> 图片按钮
注意
	单选，复选框默认被选中checked=“checked”
	点击文字也能选中单选，复选框
点击文字也能选中的两种方式
<label for="">
<input type="" name="" value="" checked>文字
</label>
			<input type="" name="r" value="" id="">
<label for="">
文字
</label>

其他属性说明：

name：名字；value：值初始值；placeholder：输出域的提示文字；maxlength 输入域最大长度（最多输入的字符数）。

文本域textarea:

<textarea name=""cols="30" rows="10" placeholder="">
 </textarea>
	cols 列数
	rows 行数

样式：rasize:none; 不会重置文本域的大小。

placeholder：文本域提醒文字。

按钮button：

<button type="submit">按钮</button>
	type="submit"提交按钮
	type="reset"重置按钮
	type="button"普通按钮

下拉选中框：select：

下拉选择框   select
<select name="">
<option value=""></option>
<option value=""></option>
</select>
	给option添加selected 选项默认被选中
	multiple 多选

表单其他属性：readonly 只读状态；disabled 不可用状态。