美文网首页
初学css样式

初学css样式

作者: 柯_0d3f | 来源:发表于2018-01-09 22:28 被阅读0次

css是什么?Casading style sheet .英语不好只看懂了style sheet 类型表+casading (层叠)翻译成层叠样式表

那css用来最哈子的呢?是用来扩展html元素(标签例如<p>、<a>)的功能,也就是这个元素以什么样子的样式显示出来。比如<p> 默认它是一个段落标签,而且是很简单的显示出来,那如果这时候你需要段落文字要有颜色,要加背景颜色,字体要改变等等。原始的html直接实现的方式是:通过style属性。

例如:<p style="color:red,background-color:red,font-size:20px"> this is my style </p>

如果是css:

你的.css文件:

p {color:red,background-color:red,font-size:20px} 然后html文件就link到这个css文件,当你要使用p元素时,就是使用这用样式。

样式的基本格式:seletor {html属性:值} seletor就是html元素。

既然html有方法实现需求,那为什么还要用css?很简单,css使用起来方便,去掉代码重复性,效率高。就像上面的例子,你每个p元素都要重新写相同的style,那就不合理了吧。

注意:

多重样式将层叠为一个:样式表允许以多种方式规定样式信息。样式可以规定在单个的 HTML 元素中,在 HTML 页的头元素中,或在一个外部的 CSS 文件中。甚至可以在同一个 HTML 文档内部引用多个外部样式表。

层叠次序

当同一个 HTML 元素被不止一个样式定义时,会使用哪个样式呢?

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

浏览器缺省设置

外部样式表

内部样式表(位于 标签内部)

内联样式(在 HTML 元素内部)

因此,内联样式(在 HTML 元素内部)拥有最高的优先权,这意味着它将优先于以下的样式声明: 标签中的样式声明,外部样式表中的样式声明,或者浏览器中的样式声明(缺省值)。

相关文章

  • 初学css样式

    css是什么?Casading style sheet .英语不好只看懂了style sheet 类型表+casa...

  • 4.CSS引入方式-CSS进阶

    四、CSS引入方式 在初学阶段,我接触了 3 种CSS引入方式,分别是:外部样式表内部样式表行内样式表其实,还有一...

  • css样式入门书目录

    css样式-字体属性 css样式-背景属性 css样式-边框属性 css样式-列表属性 css样式-定位属性 cs...

  • [jQuery]设置css样式

    获取css样式 设置单个css样式 设置多个css样式

  • CSS基础(二)

    1 - CSS样式的引入 CSS样式的引入可以采用三种方式: 内联式css样式 嵌入式CSS样式 外部式CSS样式...

  • 切图需要的准备

    样式 重置样式(reset.css) 公共样式(commo.css) 独立样式(例如首页:index.css) 重...

  • jQuery学习:css操作/属性操作

    css操作 修改单个样式.css(name,value) 修改多个样式.css(obj) 获取样式.css(nam...

  • CSS初级

    css样式表 css选择器(简单,复杂) css属性 css布局 CSS样式表(内联方式,内部样式表,外部样式表)...

  • CSS学习之CSS基础

    标签: 前端 css 样式 CSS样式 css全称为"层叠样式表(cascading style sheets)...

  • 章节七、CSS样式基本知识

    内联式CSS样式嵌入式CSS样式外部式CSS样式(外联式) 外部式css样式(也可称为外联式)就是把css代码写一...

网友评论

      本文标题:初学css样式

      本文链接:https://www.haomeiwen.com/subject/olngnxtx.html