JavaScript开发基础——CSS知识

我南柯一梦 05-30 178

前言：

此刻兄弟们对“css文件作用”大致比较注意，小伙伴们都需要知道一些“css文件作用”的相关资讯。那么小编同时在网上搜集了一些对于“css文件作用””的相关文章，希望你们能喜欢，各位老铁们快快来学习一下吧！

使用CSS技术可以对文档进行精细的页面美化，CSS不仅可以对单个页面进行格式化，还可以对多个页面使用相同的样式进行修饰，以达到统一的效果。

CSS的相关概念

CSS是英文Cascading Style Sheets（层叠样式表单）的缩写，通常又称为风格样式表（Style Sheet）或级联样式表，它是用来进行网页风格设计的。给网页添加CSS，最大的优势就是在后期维护中只需要修改代码即可。

CSS能做什么

通过在网页中添加CSS样式表，只要对相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者不同网页的外观和格式。具体来讲，CSS的作用有以下几个方面。

在几乎所有的浏览器上都可以使用。

以前一些非得通过图片转换实现的功能，现在只要用CSS就可以轻松实现，从而更快地下载页面。

使页面的字体变得更漂亮，更容易编排，使页面真正赏心悦目。

用户可以轻松地控制页面的布局。

用户可以将许多网页的风格、格式同时更新，不用再一页一页地更新了。

用户可以将站点上所有的网页风格都使用一个CSS文件进行控制，只要修改这个CSS文件中相应的行，那么整个站点的所有页面都会随之发生变动。

浏览器与CSS

CSS制定完成之后，具有了很多新功能，即新样式。但这些新样式在浏览器中不能获得完全支持，主要在于各个浏览器对CSS的很多细节处理上存在差异。例如，一个标签的某个属性被一种浏览器支持，而另外一种浏览器则不支持，或者两个浏览器都支持，但其显示效果不一样。

各主流浏览器为了自己产品的利益和推广，定义了很多私有属性，以便加强页面显示样式和效果，导致现在每个浏览器都存在大量的私有属性。虽然使用私有属性可以快速构建效果，但是对网页设计者来说这是一个大麻烦，设计一个页面需要考虑在不同浏览器上的显示效果，一个不注意就会导致同一个页面在不同浏览器上显示效果不一致，甚至有的浏览器不同版本之间也具有不同的属性。

如果所有浏览器都支持CSS样式，那么网页设计者只需要使用一种统一标签，就会在不同浏览器上显示统一样式效果。

当CSS被所有浏览器接受和支持的时候，整个网页设计将会变得非常容易，其布局更加合理，样式更加美观，到那个时候，整个Web页面显示会焕然一新。虽然现在CSS还没有完全普及，各个浏览器对CSS的支持还处于发展阶段，但CSS是一个新的、具有发展潜力很高的技术，在样式修饰方面，是其他技术无可替代的。学习CSS技术，

CSS的局限性

CSS的局限性主要体现在定位属性上的局限性以及不同浏览器之间的限制。在使用绝对定位属性的时候，由于元素的位置已经确定，并独立于文档之外，所以当元素中的内容发生变化时，其他元素无法根据绝对定位元素的变化而做出相应的调整，最终将会导致页面中内容重叠或者产生空白。

在使用相对定位属性的时候，由于页面中会保留元素原来占有的位置，所以会在原有位置上产生空白区域，同时，由于相对定位的优先级高于普通元素，所以也可能造成元素内容的重叠。

浏览器支持的不一致性。浏览器的漏洞或缺乏支持的CSS功能，导致不同的浏览器显示出不同的CSS版面编排效果。例如，在微软IE 6.0的旧版本，执行了许多自己的CSS2.0属性，曲解了很多重要的属性，例如width、height和float。

CSS没有父层选择器，CSS选择器无法提供元素的父层或继承性，以符合某种程度上的标准。先进的选择器（例如XPath）有助于进行复杂的样式设计。

不能明确地指定继承性样式的继承性，建立在浏览器中DOM元素的层级和具体的规则上。垂直控制的局限元素的水平放置普遍地易于控制，垂直控制则是非凭直觉性的、较迂回的，甚至是不可能的。

CSS的优缺点

CSS通过控制页面结构的风格，进而控制整个页面的风格，那么使用CSS控制网页风格有什么优点与缺点呢？

使用CSS的优点如下。

（1）加速用户的开发。CSS可以帮助用户做好基础工作，因此可以更快地开始开发。例如，如果两个开发团队一起工作，那么就可以共享彼此的CSS代码，从而提高团队的工作效果。

（2）可以使用跨浏览器功能。CSS已经编写成跨浏览器兼容了，所以用户可以专注于自定义和创建内容而不是调整基础的样式，更好的是CSS还会消除浏览器特定的bug。

（3）给用户干净和对称的布局。基于网格的CSS建立了一个预定义宽度的多列布局，所以用户可以专注于创建内容而不是排列文本块。