前端学习: CSS学习

来源:互联网 发布:战舰世界 数据更新出错 编辑:程序博客网 时间:2024/06/06 12:50

参考自http://www.w3school.com.cn/css/css_intro.asp

一, 简介

  • CSS 指层叠样式表 (Cascading Style Sheets)
  • 样式定义如何显示 HTML 元素
  • 样式通常存储在样式表中
  • 把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题
  • 外部样式表可以极大提高工作效率
  • 外部样式表通常存储在 CSS 文件中
  • 多个样式定义可层叠为一, 即Cascading, 指当同一个html元素被不止一个样式定义时, 优先级如下:
    • 内联样式(在 HTML 元素内部)
    • 内部样式表(位于 <head> 标签内部)
    • 外部样式表
    • 浏览器缺省设置

二, 基本知识

  • 语法: CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明。
    • selector {declaration1; declaration2; ... declarationN }
    • 选择器通常是您需要改变样式的 HTML 元素。
    • 每条声明由一个属性和一个值组成。属性(property)是您希望设置的样式属性(style attribute)。每个属性有一个值。属性和值被冒号分开。
    • 即 selector {property1: value1;property2: value2; ... }
    • 例: h1 {color:red; font-size:14px;}
    • 最好进行分行和缩进  , 更加清晰
    • 可以同时设置多个选择器
    • 子节点元素会继承父元素的样式


  • 选择器:
    • 派生选择器(上下文选择器):  li strong{...}
    • id选择器:  div#123
    • 类选择器:  div.test
    • 属性选择器:   [title]  [title="hello"]
  • 如何插入:
    • 全局多个文件用到的样式放在外部样式表中
    • 某个文档用到的放在内部样式表中
    • 某个标签用到的放在内联样式表中
    • 多重样式:  优先级高的样式会覆盖低的样式表中的属性, 但不会覆盖没有的

 

0 0
原创粉丝点击