前端学习笔记(一)

最新推荐文章于 2024-07-25 09:24:40 发布

越卷越菜

最新推荐文章于 2024-07-25 09:24:40 发布

阅读量309

点赞数 9

分类专栏：前端学习文章标签：前端学习笔记 html5

本文链接：https://blog.csdn.net/2301_79284357/article/details/139574569

版权

前端学习专栏收录该内容

2 篇文章 0 订阅

订阅专栏

前端学习笔记(一)

网页基本框架

标签：写在html的代码
单标签：一般是功能标签有特别的功能
双标签：一般包裹内容显示东西
双标签一般闭合而且后面的标签的<>里的第一个字符必须使用/，例如，

<html></html>

基本框架

<html></html> 网页的核心，基本所有内容都被它包裹
<head></head> 头部标签的内容，主要写的是给浏览器看的网络介绍，样式
<body></body> 身体标签，主要给用户看的

lang属性

主要决定浏览器是否自动弹出翻译框
en 会弹出，一般表示英文网页
zh-cn 不会弹出，一般表示中文网页

html的基本标签

标题标签

重要程度依次递减
h1-h6标签用于表示网页内容的标题 标签中文字默认会出现不同程度的加粗和增大
	<h1></h1>
	<!-- 搜索引擎非常看重h1标签内容 重要的内容放在h1里 一般只能放一个h1 否则会适得其反 
	一个团队只能一个核心负责人就可以 要不人人都是负责人就乱套了
	-->
    <h2></h2>
    <h3></h3>
    <h4></h4>
    <h5></h5>
    <h6></h6>

段落标签

<p>今天天气好</p>
双标签 段落标签 英文paragraph 段落之间是有间隙因为段落自带换行

转义字符

在书写某些特殊字符的时候可能会出现一些问题 当我们标签和一些特殊字符起了冲突 就需要用对应的代替写法

&lt; 小于号
&gt; 大于号
&nbsp; 空格(不会被折叠)
&copy; 版权符号 ©
&yen; 人民币符号 ￥

文本格式化标签

通过文本标签可以格式化文本(为文本添加样式 比如文本加粗 倾斜添加下划线等等)
b和strong 加粗
u和ins 下划线
i和em 倾斜

一般情况下b和strong标签都是可以让文本进行加粗 但是strong标签的语义是内容具有强调的作用
b标签表现效果加粗
strong标签除了文本加粗 并且还有强调文字的作用让浏览器觉得这里的文字内容比较重要

其他标签

单标签
<br> 换行
<hr> 分割线

span标签

也是文本标签 不会自动换行
视觉上不会产生变化 但是我们可以配合css添加特殊样式

语义化和SEO

SEO:搜索引擎优化
	优化你的网页内容 提高你的权重让你的网站在搜索引擎中排名更靠前
	
网站排名靠前好处:
	曝光率  浏览量 点击率 用户量更多
	
语义化: 判断一个网页权重 性能 规范性标准
	合理的运用的标签
	
语义化的好处:
	1.对于开发者来讲 有语义的标签更加的清晰方便编写代码
	2.对于浏览器的爬虫 有利于seo更方便解析
	3.对于团队来讲 方便团队的开发和维护
	
W3C组织:
	(万维网联盟)是万维网主要国际标志组织 负责制定web标准 主要是HTML/CSS

这一段的学习挺有趣的，特别是能在网页上打开这段代码写的是啥，而且这个语言没有什么编译上的错误，特别容易学习