初始HTML 标签—1

最新推荐文章于 2023-03-09 15:15:12 发布

kkkk_1112

最新推荐文章于 2023-03-09 15:15:12 发布

阅读量282

点赞数

本文链接：https://blog.csdn.net/kkkk_1112/article/details/108705248

版权

为什么要遵循遵循Web标准：

浏览器的内核不同，展示的页面或者排版就有一些差异，遵循Web标准可以可以让页面更加统一。

Web标准的三层组成：结构（Structure）、表现（Presentation）和行为（Behavior）。

结构：用于网页元素进行整理和分类，主要是.html。

表现：用于设置网页元素的版式、颜色、大小等外观样式，主要是.css

行为：网页模型的定义及交互的编写，主要是.js

1、初识HTML

HTML指超文本标记语言（Hyper Text Markup Language），用来描述网页的一种语言。

超文本的含义：可以加入图片、声音、动画、多媒体等内容，还可以从一个文件跳转到另外一个文件，与不同的文件链接。

网页是由网页元素组成的，这些元素利用HTML标签描述出来，然后通过浏览器解析，就可以显示给用户了。

学习html主要是学习html标签，用html标签来描述网页元素：比如图片标签、文字标签、连接标签等等。

所有的html标签都是在<>中

<html></html> html标签，根标签

<head></head>文章的头部，在head中要设置的是title

<title></title>文章的标题，每个页面都有自己的标题

<body></body>文章的主题，元素包含文档的所有内容、页面内容

标签的分类：

双标签：

<标签名>内容</标签名>

/ 关闭符号

单标签：

<标签 /> 比如

标签关系：

（1）嵌套关系

<head>

<title>

</title>

</head>

（2）并列关系

<head>

</head>

<body>

</body>

<!doctype html>就是告诉浏览器按照HTML5规范解析界面

lang 指定语言种类

lang='en'表示html的语言为英文，en是English的缩写。

zh-CN表示为中文。

常见的字符集编码方式：

gb2312 简单中文

big5 繁体字

gbk 包含全部中文字符，是gb2312的扩展

utf-8 包括世界各国的语言

标签的语义化：

在合适的地方放一个合适的标签，让语义显得更加清晰明了

标签的属性：

<标签名属性1=“属性值1” 属性2=“属性值2”……> 内容 </标签名>

举例：

有哪些标签：

（1）排班标签：

标题标签(h)：h1 ~ h6，h1标题最大，依次递减

段落标签(p)：

水平线标签（hr）:<hr />

换行标签（br)：

段落和换行的区别：

呈现出来的效果很不相同

div和span标签：div和span没有语义，可以看作是两个盒子

div是division的缩写，意思是分割

span意识是跨度、范围。

两个都是盒子，用来布局。

<div>一行只能放一个

一行可以放多个

（2）文本格式化标签：

和：文字以粗体的方式显示，b（bold）只是加粗，strong还有强调的意思

和：文字以斜体的方式呈现

<s></s>和<del></del> ：文字以加删除线的方式显示

和<ins></ins>：文字以加下划线的方式呈现

一般都是推荐后面的写法

（3）图像标签：

image 图像

在页面中插入图片，语法如下：

<img src = "图像URL" /> 单标签

src 属性用于指定图像文件的路径和文件名

属性 alt 作用：图片不能显示时替换文本

属性 title 作用：鼠标悬停时显示的内容

属性 width 作用：设置图像的宽度，单位像素

属性 height 作用：设置图像的高度，单位像素

属性 border 作用：设置图像边缘的宽度，单位数字（一般跟着css）

注意点：

标签有多个属性，但都必须写在开始标签后

属性不分前后顺序，但是标签与属性之间、属性与属性之间必须用空格隔开

采用键值对的格式，key=“value”

（4）链接标签

<a> 单词是：anchor，意思为锚

属性 href，用于锚定跳转目标的url

属性 target，用于指定页面的打开方式，有self和blink两种打开方式，_self是默认当前窗口打开，_blank是在新窗口打开

<a href="跳转目标" target="目标窗口的弹出方式">文本或图像</a>

注意：

外部链接需要添加 http://

内部链接：直接链接内部页面名称即可<a href = "index.html">首页</a>

空链接：通常不确定链接到哪里的时候一般用#代替，即href = "#"

不仅可以创建文本链接，各种图片、表格、音频都可以设置链接。

（5）注释标签

注释标签是给别人看的，主要目的是为了解释之后的代码是做什么的，但是程序不执行

注释的快捷键：ctrl + /

取消注释的快捷键：ctrl + shift + /

8 路径

相对路径：从代码所在的这个文件出发，去寻找我们的文件路径，而我们所说的上一级、下一级、同一级，都是相对于代码文件来说，我们所找的文件所在的位置。

同一级：直接写名字

下一级：用 /

上一级：先翻出来，用../，这是翻出来一级，如果有两级的话，就是../../

绝对路径：完整的网页地址，或者自己电脑中固定的地址，了解即可，不大使用。

kkkk_1112

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
初始HTML 标签—1

1、初识HTMLHTML指超文本标记语言（Hyper Text Markup Language），用来描述网页的一种语言。学习目标：HTML的概念HTML标签的分类、关系、语义化网页是由网页元素组成的，这些元素利用HTML标签描述出来，然后通过浏览器解析，就可以显示给用户了。...
复制链接

扫一扫