认识标签

简介

HTML 作为标记语言,最基本的就是标签,学习 HTML 主要在于学习HTML标签的用法语义

HTML 标签在HTML标准中已经定义好了,我们去学习什么标签就是搞懂它有什么样的功能,至于为什么标签要定义成这样的疑问(比如:为什么要用body标签作为html的主体)就不用太过于纠结。

总之,标签的用法和语义是需要记忆的,只有掌握了这些,才可能去运用,也就是掌握html。html的标签有很多,文章只介绍和提及在开发中常用的标签。

标签

从一致性、可读性等各方面来说,最好仅使用小写字母

标签 < 字符 > (小于+字符+大于)

单双标签

单标签 <br> 只有一个开头,没办法包裹内容。实现一个特定的功能或者向浏览器/搜索引擎解释一些信息。

双标签 有开头也有结束,包裹内容,我们才好选中内容,划分区域。

html标签、html元素

head 内

lang 就是 language的简写,代表该网页属于哪一个国家或是地区的网页

char 字符、 set 集合 = 字符集合,简称字符集。告诉浏览器html文件的字符集,方式浏览器解析成乱码。

其他meta属性

<meta name="author" content="Anand">
<meta name="keywords" content="blog,博客,个人主页">
<meta name="description" content="Anand的博客主要分享XXXX"

学这些死的知识,灵活去运用。

body 内

  • 区域划分
    • 块级区域 div、h、ol、ul、dl
    • 行内区域 span
  • 内容展示
    • 展示文字
      • p
      • blockquote
      • em
      • strong
    • 展示图片 img
    • 展示音频 <audio src="" controls="controls"></audio>
    • 展示视频 <video src="" controls="controls"></video>
    • 特殊类 a

块元素:独占一行

网页中有一些信息是重要信息,需要区别于其他区域,比如网页标题等。h1>h2>h3>h4>h5>h6

p

网页中划分段落文字的区域

ol(order list)有序列表

网页中有一些内容相似、结构相仿、布局接近,但是每个人区域内容有先后顺序的区域

ul(unordered list)无序列表标签

网页中有一些内容相似、结构相仿、布局接近的区域

dl(definition list)自定义列表标签

网页中还有一些内容不完全一样、结构相似、布局接近,每个区域的内容没有先后关系的区域,这一类可以使用自定义列表来进行区域划分,这一类区域大多用在专业名词条目的解释,或是网页底部信息分类等内容上。

<dl>
    <dt>小标题</dt>
    <dd>对最近的小标题的描述</dd>
</dl>

span

strong 重点文字标注

b

em 重要性低于strong,带有倾斜

i

a 跳转链接,和href一起使用,纯a标签没有任何效果。href(Hypertext Reference)超文本引用,链接地址,target 网页打开方式(_blank新页面打开,_self 默认打开方式,当前页打开。

img

网页图片展示:src图片地址 sourse alt图片名称,width图片文件的世纪宽度,height图片文件的实际高度。标注宽高方便搜索引擎抓取图片

相对路径、绝对路径

注释 《!--


版权声明:

Anand's Blog 文章皆为站长 Anand Zhang 原创内容,转载请注明出处。

包括商业转载在内,注明下方要求的文章出处信息即可,无需联系站长授权。

请尊重他人劳动成果,用爱发电十分不易,谢谢!

请注明出处:

本文出自:Anand's Blog

本文永久链接:https://anandzhang.com/posts/htmlcss/2