CSS:基本样式

CSS

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

层叠次序

  • 浏览器缺省设置
  • 外部样式表
  • 内部样式表(位于 标签内部)
  • 内联样式(在 HTML 元素内部)

从上向下优先级越来越高

CSS语法

selector{property: value; ... ...}

其中选择器分为:

  • id选择器
  • class选择器
  • 元素选择器
  • 属性选择器
  • 后代选择器
  • 子元素选择器
  • ... ...

CSS使用

  • 外部样式表(建议):

    

  • 内部样式表:

    

  • 内联样式表(不建议):

This is a paragraph

CSS常见样式

  • 背景:background/background-image/background-color/...
  • 文本:text-align/text-decoration/...
  • 字体:font/font-family/font-style/font-weight/font-size/...
  • 链接:a:link/a:hover/a:visited/a:active
  • 列表:list-style/list-style-image/list-style-position/...
  • 表格:border-spacing/...
  • 尺寸:width/height/max-height/min-height/...
  • 边距:padding/margin/...
  • 定位:position/float
  • 显示:display/visibility/color/...
  • 边框:border/border-radus/...
  • ... ...

更多CSS样式参见W3School。

示例


CSS:基本样式_第1张图片
Copyright: Joshua 2016

你可能感兴趣的:(CSS:基本样式)