HTML基本结构和常用标签

最新推荐文章于 2024-08-14 18:50:50 发布

肥牛熟了熟了

最新推荐文章于 2024-08-14 18:50:50 发布

阅读量249

点赞数

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

本文链接：https://blog.csdn.net/LUOZONGW/article/details/126919868

版权

html 专栏收录该内容

7 篇文章 1 订阅

订阅专栏

Web标准的构成

        结构、表现、行为三层分离。

html ：超文本标记语言

        作用：网页结构布局

css (Cascading Style Sheets)层叠样式表

        作用：页面效果优化

Javascript

        作用：网页动效与数据交互

为什么要使用web标准？

Web标准：让不同的浏览器按照相同的标准显示结果，让展示的效果统一。

html基本结构都是拿来干嘛？

<!DOCTYPE html>
<!-- 文档声明 html5版本 -->

<html lang="en">
    <!-- 表示当前文档使用的 超文本标记语言 html标签  lang="en" 英语-->

    <!-- 页面头部 -->
<head>
    <meta charset="UTF-8">
          <!-- 页面字符编码格式设置 万国码 -->  
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
       <!-- ie浏览器兼容处理 -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
       <!-- 移动端视口适配 -->
  
    <title>Document</title> <!-- 页面标题 -->
</head>
<body>
    <!-- 页面身体：内容显示区域 -->
</body>
</html>

快捷键：shift+! 、 doc 、 html 出现html结构 ctrl +/ 注释

常用基本标签

标题 h 段落p 图片 img 超链接a 换行 br

有啥特点？ h1~h6 p换行 img 链接 a 放链接页面调转 br强制换行

标题标签h

特点：

1、标签的文字都有加粗

2、标签的文字都有变大，从h1~h6文字逐渐减小 h1只能用一次

提高权重

3、每一个标题独占一行块级元素

段落标签p

特点：

1、段落之间存在间隙

2、每个段落是独占一行

图片标签img

通过src属性引入到页面中显示

绝对路径：是指目录下的绝对位置，直接到达目标位置

相对路径：以当前文件资源所在的目录为参照基础，链接到目标文件资源 (或文件夹)的路径。

./ 当前位置 .../上一级 ../ ../上两级

设置图片宽高在实际开发中只单独设置

alt 替换文本