HTML5

最新推荐文章于 2024-08-30 16:57:43 发布

虞546

最新推荐文章于 2024-08-30 16:57:43 发布

阅读量45

点赞数

分类专栏： html 文章标签： html p2p 前端

本文链接：https://blog.csdn.net/weixin_61557810/article/details/125071587

版权

html 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

概念

网页，是网站中的一个页面，通常是网页是构成网站的基本元素，是承载各种网站应用的平台。通俗的说，网站就是由网页组成的。通常我们看到的网页都是以htm或html后缀结尾的文件，俗称 HTML文件。

基本标签

结构标签

属性名	代码	描述
text	< body text="#f00"></ body>	设置网页正文中所有文字的颜色
bgcolor	< body bgcolor="#00f"></ body>	设置网页的背景色
background	< body background="1.png"></ body>	设置网页的背景图

排版标签

注释标签

换行标签<br>

段落标签<p>文本消息</p>

特定:段与段之间有空行

属性:align对齐方式(left,center,right)

水平线标签<hr>

属性:

width:水平线长度

size:水平线的粗细

color:水平线颜色

align:水平线对齐的方式

块标签

标签	代码	描述
div	< div></ div>	行级块标签，独占一行，换行
span	< span></ span>	行内块标签，所有内容都在同一行

基本文字标签

属性名	代码	描述
size	< font size="7"></ font>	用于设置字体的大小，最小1号，最大7号
color	< font color="#f00"></ font>	用于设置字体的颜色
face	< font face="宋体"></ font>	用于设置字体的样式

文本格式化标签

标签	代码	描述
b	< b></ b>	粗体标签
strong	< strong></ strong>	加粗
em	< em></ em>	强调字体
i	< i></ i>	斜体
small	< small></ small>	小号字体
big	< big></ big>	大号字体
sub	< sub></ sub>	上标标签
sup	< sup></ sup>	下标标签
del	< del></ del>	删除线

标题标签

标签	代码	描述
h1	< h1></ h1>	1号标题，最大字号
h2	< h2></ h2>	2号标题
h3	< h3></ h3>	3号标题
h4	< h4></ h4>	4号标题
h5	< h5></ h5>	5号标题
h6	< h6></ h6>	6号标题，最小字号

列表标签(清单标签)

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

属性值	描述	用法举例
circle	空心圆	< ul type="circle">< /ul>
disc	实心圆	< ul type="disc">< /ul>
square	黑色方块	< ul type="square">< /ul>

有序列表标签:<ol></ol>

属性值	描述	用法举例
1	数字类型	< ul type="1">< /ul>
A	大写字母类型	< ul type="A" >< /ul>
a	小写字母类型	< ul type="a">< /ul>
I	大写古罗马	< ul type="I">< /ul>
i	小写古罗马	< ul type="i">< /ul>

无序列表和有序列表嵌套使用

<ol>
		<li></li>
        <li></li>
        <li>
        	<ul>
                <li></li>
            </ul>
        </li>
	</ol>

图像标签

属性名	描述
src	引入图片的地址
width	图片的宽度
height	图片的高度
border	图片的边框
align	与图片对齐显示方式
alt	提示信息
hspace	在图片左右设定空白
vspace	在图片的上下设定空白

链接标签

跳转到别的页面<a href=""></a>

属性:href跳转到另外页面的地址(外网的地址需要加网络协议)

设置跳转页面时的页面打开方式,target属性

_blank在新窗口打开

_self在原窗口打开

指向同一页面中指定位置

定义位置<a name ="名称"></a>

指向<a href="#名称"></a>

表格标签

普通表格(table ,tr,td)

表格的列标签<th>内容有加粗和居中

表格的列合并属性(colspan)：在同一行内同时合并多个列

表格的行合并属性(rowspan)：在同一列跨多行合并

HTML表单标签

html表单用于收集不同类型的用户输入数据

form元素常用属性

action表示动作,值为服务器地址,把表单的数据提交到这个服务器上

method:请求方式,get和post

get:

地址栏,请求参数都在地址后面接path?name="张三"&password="123456"

不安全

效率高

get请求大小有限制，不同浏览器有不同，但是大约是2KB；一般情况用于查询数据

post

地址栏：请求参数单独处理。

安全可靠些

效率低

6post请求大小理论上无限；一般用于插入删除修改等操作

input元素

属性值	描述	代码
text	单行文体框	< input type="text"/>
password	密码框	< input type="password"/>
radio	单选按钮	< input type="radio"/>
checkbox	复选框	< input type="checkbox"/>
date	日期框	< input type="date"/>
time	时间框	< input type="time"/>
datetime	日期和时间框	< input type="datetime"/>
email	电子邮件输入	< input type="email"/>
number	数值输入	< input type="number"/>
file	文件上传	< input type="file"/>
hidden	隐藏域	< input type="hidden"/>
range	取值范围	< input type="range"/>
color	取色按钮	< input type="color"/>
submit	表单提交按钮	< input type="submit"/>
button	普通按钮	< input type="button"/>
reset	重置按钮	< input type="reset"/>
image	图片提交按钮	< input type="image"/>

select元素(下拉列表)

单选下拉列表<select></select>

默认选中属性selected="selected"

多选下拉属性<select></select>

对选列表:multiple="multiple"

HTML框架标签

通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。每份HTML文档称为一个框架，并且每个框架都独立于其他的框架。
使用框架的缺点：
- 开发人员必须同时跟踪更多的HTML文档
- 很难打印整张页面

框架结构标签frameset

框架结构标签（ < frameset>< /frameset>）用于定义如何将窗口分割为框架
每个 frameset 定义了一系列行或列
rows/columns 的值规定了每行或每列占据屏幕的面积
- <frameset rows="">< /frameset>
- <frameset cols="">< /frameset>

框架标签frame

每个frame引入一个html页面

基本的注意事项

不能将 < body>< /body> 标签与 < frameset>< /frameset> 标签同时使用
假如一个框架有可见边框，用户可以拖动边框来改变它的大小。为了避免这种情况发生，可以在< frame>标签中加入：noresize="noresize"。

HTML的其它标签和特殊字符

其他标签

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<!--该网页的描述-->
<meta http-equiv="description" content="this is my page">
 <!--该网页的编码-->
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!-- href：引入css文件的地址-->
<link rel="stylesheet" type="text/css" href="./styles.css">
<!--src：js的文件地址-->
<script type="text/javascript" src=""></script>

特殊字符