HTML5 自学基础笔记

最新推荐文章于 2023-01-12 15:14:08 发布

纵令然诺暂相许

最新推荐文章于 2023-01-12 15:14:08 发布

阅读量140

点赞数

分类专栏： HTML5 文章标签： html5

本文链接：https://blog.csdn.net/suntianheng/article/details/106210782

版权

HTML5 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML的概念:

网页分为结构（HTML）表现（CSS）行为 (JS)

HTML(Hypertext Markup Language):超文本标记语言

作用:

将后台根据用户请求处理的请求结果在浏览器中显示给用户
在浏览器中数据需要使用合适的格式展现给用户.
HTML是告诉浏览器接收到的数据使用什么样的数据组织形式进行显示.

使用:

HTML的标准文档规范
HTML的标签

HTML的文档声明:

文件名.html 或者文件名.htm

HTML的三大基石:

URL：统一资源定位符（唯一的定位一个网络资源）
HTTP：超文本传输协议（规范浏览器和服务器之间数据交互的格式）
HTML ：超文本标记语言（有效的组织数据在浏览器端的显示）

一.HTML的顶层标签:

此元素可告知浏览器其自身是一个 HTML 文档.

二.HTML的头标签:

主要是配置浏览器显示数据的配置信息,例如:字符编码等.

三.网页标题标签:

<title></title> 网页标题标签:告诉浏览器使用什么标题显示网页

四.编码格式标签:

五.网页搜索优化标签:

六.网页指定跳转标签:

七.其他标签:

例如:css引入标签和js引入标签

HTML引入JS/CSS的方式:
<!--引入外部的css文件-->
<link rel="stylesheet" href="css/index.css" />
        
<!--引入外部的js文件-->
<script type="text/javascript" src="js/index.js" ></script>

八.HTML的主体标签:

<body></body> 给用户进行数据展示

九.标题标签:

<h1><h1/> ...h1到h6:会将其中的数据加粗加黑显示,由大到小,并且标题标签自带换行功能(块级标签)

属性:

align: center left right (居中、左、右)

十.水平线标签:

<hr> 会在页面中显示一条水平线

属性:

width="宽度" 设置水平线宽度

size="高度" 设置水平线的高度

color="颜色" 设置水平线的颜色

十一.段落标签:

<p><p/> 会将一段数据作为整体进行显示,主要是进行css和js操作时比较方便,会自动换行(块级标签)

十二.换行标签:

<br/> 告诉浏览器需要在此位置换行

十三.空格字符:

&nbsp

十四.权重标签:

<b><b/> 会将内容加黑显示

<i><i/> 会将内容斜体显示

<u><u/> 会将内容增加下划线

<del><del/> 增加中划线

注意:

标签的属性是对标签的功能进一步的补充,可以由开发人员自由指定标签的属性值,来达到想要的效果.
像素单位占据的是电脑屏幕的大小,百分比占据的是浏览器窗口的大小.

十五.无序列表:

<ul>

</ul>

十六.有序列表:

<ol>

</ol>

十七.自定义列表:

<dl>

</dl>

例子:

十八.HTML的图片标签:

<img src=""> 行内元素

src: 图片的路径;网络资源的URL

width: 设置图片宽度,默认锁定纵横比(可设置px,也可设置百分比)

height: 设置高度

title: 鼠标指针悬停显示的信息

alt: 当图片加载不成功显示的信息

十九.HTML的超链接标签:

href: 要跳转的资源路径

target: 指定跳转的方式

方式为:

_self: 在当前页中显示
_blank: 在新的标签页显示
_top: 在顶层页面中显示
_parent: 在父级页面中显示

锚点:

作用: 在网页内进行资源跳转

使用:

先使用超链接标签在指定的网页位置增加锚点,格式为:

使用a标签可以跳转指定的锚点

*<a href="#"></a> 刷新当前页

二十.HTML的表格标签:

<tr>

<th>Header</th>

</tr>

<tr>

</tr>

</table>

table: 声明一个表格

tr: 声明一行

th: 声明一个单元格,表头格,默认居中加黑显示

td: 声明一个单元格,默认居左显示原始数据

border: 给表格添加边框

cellspacing: 设置边框大小

cellpadding: 设置内容距离边框的距离

colspan: 列合并

rowspan: 行合并

特点: 默认根据数据的多少进行表格的大小显示

二十一.HTML的内嵌和框架标签:

1.内嵌网页:

src: 要显示的网页资源路径

注意:默认当前页面打开和加载src指向的资源

width: 设置显示区域的宽度

height: 设置显示区域的高度

name: 设置内嵌区域的名字,结合超链接标签的target属性

2.框架标签:

</frameset>

rows: 按照行进行切分页面

cols: 按照列进行切分页面

<frame src="" name=""> 进行切分区域的占位,一个frame可以单独加载网页资源.

name:区域名,结合超链接使用

二十二:HTML的表单

</form>

action:提交地址

method:提交方式

纵令然诺暂相许

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
HTML5 自学基础笔记

HTML的概念:HTML:超文本标记语言作用:将后台根据用户请求处理的请求结果在浏览器中显示给用户在浏览器中数据需要使用合适的格式展现给用户. HTML是告诉浏览器接收到的数据使用什么样的数据组织形式进行显示.使用:HTML的标准文档规范 HTML的标签HTML的文档声明:文件名.html 或者文件名.htmHTML的三大基石:URL：统一资源定位符（唯一的定位一个网络资源） HTTP：超文本传输协议（规范浏览器和服务器之间数据交互的格式） HTM...
复制链接

扫一扫

专栏目录