289页初中级前端题助你拿下Offer，完整PDF

落日映苍穹つ 2022-10-05 05:57 170阅读 0赞

# 前言 #

每年毕业季都能听到很多报道说大学毕业生找工作难，以前看到这类新闻一直觉得无所谓。因为总觉得离我还早，但今年轮到我毕业了，才发现不幸终于降临到我的头上。

![毕业季][c0e3e8b1de9425fbe2ce33881a0d35f9.png]

## 一.我们为什么需要CSS？ ##

使用css的目的就是让网页具有美观一致的页面，另外一个最重要的原因是内容与格式分离 在没有CSS之前，我们想要修改HTML元素的样式需要为每个HTML元素单独定义样式属性，当HTML内容非常多时，就会定义很多重复的样式属性，并且修改的时候需要逐个修改，费心费力。是时候做出改变了，所以CSS就出现了。

CSS的出现解决了下面两个问题：

*  将HTML页面的内容与样式分离。
 *  提高web开发的工作效率

## 二，什么是CSS？ ##

CSS是指层叠样式表(**C**ascading **S**tyle **S**heets)，样式定义如何显示HTML元素，样式通常又会存在于样式表中。也就是说把HTML元素的样式都统一收集起来写在一个地方或一个CSS文件里。

*  CSS 指层叠样式表 (**C**ascading **S**tyle **S**heets)
 *  样式定义**如何显示** HTML 元素
 *  样式通常存储在**样式表**中
 *  把样式添加到 HTML 4.0 中，是为了**解决内容与表现分离的问题**
 *  **外部样式表**可以极大提高工作效率
 *  外部样式表通常存储在 **CSS 文件**中
 *  多个样式定义可**层叠**为一
 *  样式对网页中元素位置的排版进行像素级精确控制

### 2.1 css的优势 ###

样式表定义如何显示 HTML 元素

样式表定义如何显示 HTML 元素，就像 HTML 3.2 的字体标签和颜色属性所起的作用那样。样式通常保存在外部的 .css 文件中。通过仅仅编辑一个简单的 CSS 文档，外部样式表使你有能力同时改变站点中所有页面的布局和外观。

*  1.内容与表现分离
 *  2.网页的表现统一，容易修改
 *  3.丰富的样式，使页面布局更加灵活
 *  4.减少网页的代码量，增加网页浏览器速度，节省网络带宽
 *  5.运用独立页面的css,有利于网页被搜索引擎收录

### 2.2 如何使用CSS？ ###

我们通常会把样式规则的内容都保存在CSS文件中，此时该CSS文件被称为外部样式表，然后在HTML文件中通过`link`标签引用该CSS文件即可。这样浏览器在解析到该`link`标签的时候就会加载该CSS文件，并按照该文件中的样式规则渲染HTML文件。

### 2.3样式解决了一个很大的问题 ###

HTML 标签原本被设计为用于定义文档内容，如下实例：

`<h1>这是一个标题</h1>`

`<p>这是一个段落.</p>`

为了解决这个问题，万维网联盟（W3C），这个非营利的标准化联盟，肩负起了 HTML 标准化的使命，并在 HTML 4.0 之外创造出样式（Style）。

当代浏览器都支持 CSS .

### 2.4 样式层叠次序 ###

当同一个 HTML 元素定义了多个样式时，应该使用哪个样式？

一般而言，所有的样式会根据下面的规则层叠于一个新的虚拟样式表中，其中数字 4 拥有最高的优先权。

*  浏览器缺省设置
 *  外部样式表
 *  内部样式表（位于 <`head`> 标签内部）
 *  内联样式（在 HTML 元素内部）

因此，内联样式（在 HTML 元素内部）拥有最高的优先权，这意味着它将优先于以下的样式声明：`<head>` 标签中的样式声明，外部样式表中的样式声明，或者浏览器中的样式声明（缺省值）。

## 三，CSS概念 ##

CSS是Cascading Style Sheets的简称，中文称为层叠样式表，是一种用来表现HTML（标准通用标记语言的一个应用）或者XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化，用来控制网页数据的表现，可以使网页的表现与数据内容分离。

CSS指层叠样式表

*  样式定义如何显示HTML元素
 *  样式通常存储在样式表中
 *  把样式表添加到HTML4.0中，是为了解决内容与表现分离的问题
 *  外部样式表可以极大的提高工作效率
 *  外部样式表通常存储在CSS文件中
 *  多个样式定义可层叠为一

## 四，CSS发展历程 ##

1990年，Tim Berners-Lee和Robert Cailliau共同发明了Web。1994年，Web真正走出实验室。

从HTML被发明开始，样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。

随着HTML的成长，为了满足页面设计者的要求，HTML添加了很多显示功能。但是随着这些功能的增加，HTML变的越来越杂乱，而且HTML页面也越来越臃肿。于是CSS便诞生了。

1994年哈坤·利提出了CSS的最初建议。而当时伯特·波斯（*Bert Bos*）正在设计一个名为Argo的浏览器，于是他们决定一起设计CSS。

其实当时在互联网界已经有过一些统一样式表语言的建议了，但CSS是第一个含有“层叠”丰意的样式表语言。在CSS中，一个文件的样式可以从其他的样式表中继承。读者在有些地方可以使用他自己更喜欢的样式，在其他地方则继承或“层叠”作者的样式。这种层叠的方式使作者和读者都可以灵活地加入自己的设计，混合每个人的爱好。

哈坤于1994年在芝加哥的一次会议上第一次提出了CSS的建议，1995年的www网络会议上CSS又一次被提出，博斯演示了Argo浏览器支持CSS的例子，哈肯也展示了支持CSS的Arena浏览器。

同年，W3C组织（*World WideWeb Consortium*）成立，CSS的创作成员全部成为了W3C的工作小组并且全力以赴负责研发CSS标准，层叠样式表的开发终于走上正轨。有越来越多的成员参与其中，例如微软公司的托马斯·莱尔顿(Thomas Reaxdon)，他的努力最终令Internet Explorer浏览器支持CSS标准。哈坤、波斯和其他一些人是这个项目的主要技术负责人。1996年底，CSS初稿已经完成，同年12月，层叠样式表的第一份正式标准（*Cascading style Sheets Level 1*）完成，成为w3c的推荐标准。

1997年初，W3C组织负责CSS的工作组开始讨论第一版中没有涉及到的问题。其讨论结果组成了1998年5月出版的CSS规范第二版。

## 五，CSS工作原理 ##

CSS是一种定义样式结构如字体、颜色、位置等的语言，被用于描述网页上的信息格式化和现实的方式。CSS样式可以直接存储于HTML网页或者单独的样式单文件。无论哪一种方式，样式单包含将样式应用到指定类型的元素的规则。外部使用时，样式单规则被放置在一个带有文件扩展名\_css的外部样式单文档中。

样式规则是可应用于网页中元素，如文本段落或链接的格式化指令。样式规则由一个或多个样式属性及其值组成。内部样式单直接放在网页中，外部样式单保存在独立的文档中，网页通过一个特殊标签链接外部样式单。

名称CSS中的“层叠（cascading）”表示样式单规则应用于HTML文档元素的方式。具体地说，CSS样式单中的样式形成一个层次结构，更具体的样式覆盖通用样式。样式规则的优先级由CSS根据这个层次结构决定，从而实现级联效果。

### 最后 ###

基础知识是前端一面必问的，如果你在基础知识这一块翻车了，就算你框架玩的再6，webpack、git、node学习的再好也无济于事，因为对方就不会再给你展示的机会，千万不要因为基础错过了自己心怡的公司。前端的基础知识杂且多，并不是理解就ok了，有些是真的要去记。当然了我们是牛x的前端工程师，每天像背英语单词一样去背知识点就没必要了，只要平时工作中多注意总结，面试前端刷下题目就可以了。

什么？你问面试题资料在哪里，这不是就在你眼前吗（滑稽

要因为基础错过了自己心怡的公司。前端的基础知识杂且多，并不是理解就ok了，有些是真的要去记。当然了我们是牛x的前端工程师，每天像背英语单词一样去背知识点就没必要了，只要平时工作中多注意总结，面试前端刷下题目就可以了。

什么？你问面试题资料在哪里，这不是就在你眼前吗（滑稽

[**资料领取方式：戳这里免费领取**][Link 1]

[c0e3e8b1de9425fbe2ce33881a0d35f9.png]: /images/20221005/59c87abad03a4ad2951aa5a093ebded5.png
[Link 1]: https://docs.qq.com/doc/DSlNuUUFPWmpZVlJh