html基本标签-CSDN博客

本文链接：https://blog.csdn.net/m0_62770445/article/details/128576868

文章介绍了前端开发的基础知识，包括HTML的标签结构，如<h1>、<p>、<span>等，以及CSS和JavaScript的作用。还提到了HTML的注释方法，SEO（搜索引擎优化）的概念，强调了语义化标签如<strong>和<em>对于内容强调和爬虫抓取的重要性。

摘要由CSDN通过智能技术生成

##前端三剑客

html-->超文本标记语言 -->一个网页的基本组成，给用户看到的东西都是写在html中，html中的代码叫做标签
css  层叠样式表

javascript  js是一种轻量型的web开发脚本语言

标签：
   写在html里面的代码，用&lt；&gt；包裹

    分单标签和双标签：
             单标签：一般是作为功能标签，有特别作用
                   <hr> -->换行
                   <br>-->分割线

             双标签：一般用来包裹/保存内容，显示东西的，它是成双成对出现，需要闭合，结束标签处有个/
             <标签>多喝热水</标签>
             <h1>多喝热水</h1>
             或： <h1>
                     多喝热水
                  </h1>
##html基本框架
   写代码时，更推荐在一个项目文件夹下完成所做内容
  创建好html文件之后，输入！+ 回车，就可以生成网页模板

html中注释的写法：
   注释的快捷键 ctrl+/
   
   
基本框架代码：
  <html></html>:是网页的基本组成，基本上所有的东西都写它里面
  <head></head>:头标签，里面的内容主要是给浏览器看的网页介绍/样式
  <body></body>:身体标签，里面的内容是写给用户看的

##html基本文字标签
  前端html中内容应该是由标签包裹着，不要裸露出来
在网页里面显示各种各样的文字
<h1>标题内容</h1>
    一级标题，是页面里面的老大，从规范性来说，一个网站只能有一个h1标签
<h2>标题内容</h2>
    二级标题，作用是切分网页内容，作为目标标题，可以有多个
<h3>标题内容</h3>
    三级标题，分块内容标题
h标签有h1-h6 常用就是h1-h3
<p>文本内容</p>
     段落标签，用的比较多的文本标签，他会自动换行
<span>文本内容<span>
     文本标签，不会自动换行，也没有特别的样式，比较单纯，后续会结合css使用

<br>-->换行标签
<hr>-->分割线标签
特殊文字标签：前者只是看起来特别，后者才起强调作用
<b></b> && <strong></strong> 粗体标签
    b标签只是单纯的加粗，看起来不一样但是对于浏览器来说是一样的就是普通的文字，strong标签带有语义性，起强调作用
<i></i>&& <em></em> 斜体字标签
<u></u>&& <ins></ins>下划线标签

##转义字符
  在前端开发中，有的符号可能会产生歧义，让浏览器不好理解，就用转义字符代替，比如空格，正常的<和>

   < --小于号 -- &lt；
   > --大于号 --&gt；
    -- 空格符 -- 
   ¥--人民币 --&yen；
##语义化与seo：
seo -->搜索引擎优化
    用于优化网页内容，提高权重让网站可以在搜索引擎里面更靠前（提高规范性，语义性，meta属性）
网站排名靠前的好处：
  越靠前，浏览量，点击量越多-->用户量/流量就越多

互联网最值钱的东西：
1.数据
2.流量
搜索引擎本质上就是爬虫，大型爬虫，通过大型爬虫获取到要搜索的数据里面的网站排名：
  1. 给了多少钱，排名多少
  2. 自身网页的权重（自身所写的网页是否符合规范，原创内容点击语义性）
  b标签 -->单纯加粗文字--> 看起来特别，但是对于爬虫/浏览器来说还是普通的文字
strong标签 -->加粗文字并且起强调作用-->浏览器/爬虫就会优先获取搜索strong里面的内容/数据。
##拓展
http://www.cxy521.com/
vscode在使用的时候，一般需要按下ctrl+s进行保存

1. 在网页里面查看源码信息
    1. 按下网页中右键，点击检查，查看代码
    2. 按下f12--进行检查
2. 互联网造假很简单
     可以通过修改网页源代码的方式，实现本地看起来内容不一样