HTML基础

一只小书宇

已于 2024-06-01 20:21:49 修改

阅读量212

点赞数 8

文章标签： html 前端

于 2024-06-01 17:50:15 首次发布

本文链接：https://blog.csdn.net/weixin_62731214/article/details/139373780

版权

HTML基础

一、HTML注释

ctrl + “/”
shift + alt + a

<!-- 注释：ctrl + "/" -->
<!-- 注释：shift + alt + a -->

二、HTML初识

1. 创建HTML骨架

（1）‘!’（英文）+Tab键
（2）‘!’（英文）+Enter键

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>

2. HTML标签

（1）HTML骨架标签

<!-- 文档类型 -->
<!DOCTYPE html>
<!-- 页面的根标签 -->
<html lang="en">

<!-- 头部标签 -->
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 网页标题标签 -->
    <title>html初识</title>
</head>
<!-- 主体标签，写页面代码的地方 -->
<body>
    hello world
</body>
</html>

（2）常用HTML标签

标签的分类：
双标签：有闭合标签的标签
单标签：没有闭合标签的标签
标签的关系：
嵌套关系
并列关系
常用标签：

    <!-- h1-h6 -->
    <h1></h1>   
    <!-- 段落标签 -->
    <p></p>
    <!-- 水平线标签 -->
    <hr>
    <!-- 换行标签 -->
    <br>
    <!-- 盒子标签 -->
    <div></div>
    <!-- 范围标签 -->
    <span></span>
    <!-- 图片标签 -->
    <img src="" alt="" title="">
    <!-- 链接标签 -->
    <a href=""></a>

结构化表现化标签

在网页中，有时需要为文字设置粗体、斜体或下划线效果

<!-- 粗体 -->
    <b>粗体标签</b>
    <strong>粗体标签plus</strong>
    <br>
    <!-- 斜体 -->
    <i>斜体标签</i>
    <em>斜体标签plus</em>
    <br>
    <!-- 下划线 -->
    <u>下划线标签</u>
    <ins>下划线标签plus</ins>
    <br>
    <!-- 删除线 -->
    <s>删除线标签</s>
    <del>删除线标签plus</del>