0
点赞
收藏
分享

微信扫一扫

JavaScript变量声明提升,CSS复合选择器

什么是HTML?

HTML: ( Hypertext Markup Language )超文本标记语言,是一种标识性的语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。

特点:

  • 简易性:超级文本标记语言版本升级采用超集方式,从而更加灵活方便;

  • 可扩展性:超级文本标记语言的广泛应用带来了加强功能,增加标识符等要求,超级文本标记语言采取子类元素的方式,为系统扩展带来保证;

  • 平台无关性:虽然个人计算机大行其道,但使用MAC等其他机器的大有人在,超级文本标记语言可以使用在广泛的平台上;

  • 通用性:另外,HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器;

标签语义化:

语义和默认样式的区别:

  • 默认样式是浏览器设定的一些常用tag的表现形式;
  • 语义化的主要目的就是让大家直观的认识标签和属性的用途和作用;

标签语义化作用:

  • 当只有HTML页面时,没有CSS,我们仍然可以很清晰的看懂页面的DOM结构
  • 团队维护,当团队来review代码或者重构时,增强代码的可读性,更利于维护
  • 有利于SEO,搜索引擎爬虫依赖于标签来确定上下文和各个关键字的权重
  • 提高用户体验,比如 title 和 alt 等用来解释内容信息

常用语义化的标签:

  • <header>头部标签,用来写网页最上方的公共头部,也就是页眉。
<header>
    一级标题
    <h2>二级标题</h2>
</header>
  • &lt;nav&gt;标签,用来写导航,一般写在&lt;header&gt;标签里面,内部用&lt;ul&gt;无序列表。
<nav>
    <ul>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</nav>
  • &lt;code&gt;:code可以包裹html语句而不会被浏览器再去解析。

  • &lt;pre&gt;&lt;samp&gt;:这是一段HTTP协议的内容描述,因为这段内容的换行是非常严格的,所以我们不需要浏览器帮我们做自动换行,因此我们使用了pre标签,表示这部分内容是预先排版过的,不需要浏览器进行排版。
  • &lt;article&gt;标签,当我们要写网页文章的主要内容时,要用到这个标签。
<article>
    <h2>标题</h2>
    <p>内容</p>
</article>
  • &lt;address&gt;标签,定义文档作者或拥有者的联系信息。

如果 &lt;address&gt; 元素位于&lt;article&gt;元素内部,则它表示该文章作者或拥有者的联系信息。

通常的做法是将 address 元素添加到网页的头部或底部。

  • &lt;p&gt;段落标签

知道了<p>作为段落,你就不会再使用&lt;br/&gt;来换行了,而且不需要&lt;br/&gt;来区分段落与段落。
&lt;p&gt;&lt;/p&gt;中的文字会自动换行,而且换行的效果优于&lt;br/&gt;

<p>段落内容</p>
  • &lt;span&gt;标签

&lt;span&gt;标签的语义为被用来组合文档中的行内元素

  • &lt;b&gt;&lt;em&gt;&lt;strong&gt;

&lt;b&gt;标签语义为“加粗”

&lt;em&gt;标签语义为“强调”

&lt;strong&gt;标签语义为“更强烈的强调” 而且em 默认用斜体表示,strong 用粗体表示。

最后前端到底应该怎么学才好?

如果你打算靠自己摸索自学,那么你首先要了解学习前端的基本大纲,这是你将要学习的主要内容,理解以及掌握好这些内容,便可以找到一份初级的前端开发工作。你还需要有一套完整的前端学习教程,作为初学者最好的方式就是看视频教程学习,初学者容易理解接受。

不要选择买书学习,这样的方式没有几个人能学会,基本都是看不下去书,也看不懂书。如果喜欢看书的学弟,可以买一些经典的书籍作为辅助即可,主要还是以看教程为主。每天抽出固定几个小时学习,做好长期学习的准备。学习编程并不是每天光看视频,你学习编程最重要的目的是为了编写软件产品,提供给大众使用,所以用手写出代码实现功能才是我们要做的事情。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

举报

相关推荐

0 条评论