• HTML 标签讲解


    HTML 语言结构

    • Markup (标记、标签)用来容纳和描述内容

    严格意义上,标签是指开始标签(例如

    标签)或结束标签(例如

    标签);元素(例如 p 元素或者称为

    元素)则包括开始标签(自然也包括标签中定义的属性)、结束标签以及中间的内容(Content)。

    根元素

    该元素表示一个HTML文档的根(顶级元素),所以它也被称为根元素。所有其他元素必须是此元素的后代。

    • HTML (Hypertext Markup Language 超文本标记语言)
    • 标签含义:
      • html 它把其内部的内容描述为html代码,所有的html代码都必须放在html标签当中
        • html标签只包含 body 和 head 标签

    在这里插入图片描述

    元数据元素

    该元素用来设定文档相关的配置信息(元数据),包括文档的标题,引用的文档样式和脚本等。

    基本信息以及对该网页描述类的数据都要放在该标签中,其中包括style和link标签

    该元素可以包含任何可配置的元数据信息。

    <meta charset="UTF-8">
    <meta auther="jeffrey">
    <meta email="tm@163.com">
    
    • 1
    • 2
    • 3
    • meta表示基本信息,中文含义:元

      meta属于单标签,单标签无法加载内容

    • charset表示字符编码,中文含义:属性,charset属于meta的私有属性

      • 即:meta用来承载基本信息,交给浏览器,属性名=“属性值” key=“value”

    该元素用来定义文档的标题,显示在浏览器的标题栏或标签页上。它只可以包含文本,若是包含有标签,则包含的任何标签都不会被解释。

    该元素规定了外部资源与当前文档的关系。这个元素最常于链接样式表。

    该元素的内部内容用来定义文档的样式风格,即层叠样式表。

    • style.css文件的引用
    <link rel="stylesheet" href="./css/style.css">
    
    • 1
    • rel全名relationshiop,中文:关联;表示引入的文件与当前文件的关系
    • href全名hypertext reference,超文本协议

    该元素指定用于一个文档中包含的所有相对 URL 的根 URL。一份中只能有一个 元素。

    base 用于定义href的基础网站,默认的根链接

    1. 若href没有网络协议,则跳转至根链接,否则反之
    
    • 1
    1. 如果没有base的,即默认base为当前服务器目录

    主体根元素

    该元素称为网页主体,所有的网页主体内容都在body当中,即显示在网页可视化窗口中展示的内容。

    块级元素是纵向开辟空间,所以块级元素始终可以向下延展,css认为高度没有参考价值,因为可以随时可边,但宽度不能延展,块元素不能横向开辟空间,所以只有宽度可以被子元素参考。

    ​ body默认贴合窗口,body有margin值但不能发生穿透,body默认高度为0,它是所有元素的父级元素,任何块级元素的默认宽度都是父级元素的100%,但高度是根据自身内容而定,无法参照。

    • 若想参照父元素的宽度,有三个方法:

      1. 必须给父级元素固定高度,若子元素参照父级元素的百分比,会造成溢出。

        ​ 假设父级元高为100,子元素为父元素的50%,也就是50,那么父级元素会增长到150,那么子元素的高到底是多少;

      2. 将父级元素为body元素宽高的100%,然后绝对定位,top和left都为0,绝对定位参照整个可视化页面,窗口有多大,父级元素就有多大;

      3. 将父级元素绝对定位,上下左右全为0,不能有固定宽高。

    大纲元素

    该元素表示这部分内容在文档中应当是独一无二的,不包含在任何一系列文档中重复的内容,用来体现网页中的主要信息。使用

    元素值得注意的一点是,它在每个页面中只能使用一次。
    元素的另外一个规定是,它不能作为
    ,
    ,
  • 相关阅读:
    2023最新最全【虚幻4引擎】下载安装零基础教程
    面试题~~
    YOLOv5 - common.py文件解读
    海外代理IP哪个可靠?如何测试代理的稳定性?
    Multi-Stage Progressive Image Restoration
    【剑指offer系列】62. 和为S的两个数字
    vue:基础:原理知识点
    Spring - 2 ( 16000 字 Spring 入门级教程)
    《深入理解Linux内核中文第三版》学习笔记——第7章 进程调度
    2022年IC行业还缺人吗?
  • 原文地址:https://blog.csdn.net/Sandersonia/article/details/132664385