css层叠样式表

css的使用方式

  • 在元素的style属性内 行内式 内联式
  • 写在<style>标签内
  • 写在外部css文件中,用<link>关联到html中
  • @import可以引入css,用于css中引入css

css的格式

选择器{
        属性:值;
        属性:值;
    }

css的长度单位

  • px 像素
  • em 相对于默认大小倍数
  • 百分比

颜色的表示

  • 英文单词
  • rgb方式
    • rgb(0~255,0~255,0~255)
    • rgb(百分比,百分比,百分比)
    • rgb(255,255,255) 白色
    • rgb(0,0,0) 黑色
    • rgb(100,100,100)灰色 只要三个一样都是黑色,只是深浅不一样
  • 十六进制

css选择器

  • 元素选择器(p,div,tr...)
  • ID选择器 #id名
  • class选择器 .类名
  • 关联选择器-后代元素选择器 selecter selecter
  • 关联选择器-子元素选择器 selecteer>selecter
  • 组合元素选择器 两种基本选择器的组合
  • 伪类选择器(love-hate)
    • :link(未点击时的颜色)
    • :visited(访问后的颜色)
    • :hover(鼠标经过时的颜色) 唯一一个伪类选择器不需要与a连用
    • :active(鼠标按着不放的效果)
  • ###选择器的优先级
  • ID>CLASS>TAG
  • 组合选择器 ID权重100 CLASS权重10 TAG权重1

css属性

字体属性

  • font-family 宋体 楷体...,衬线字体(serif)非衬线字体(sans-serif)(可设置多个字体,防止用户没有某字体)
  • font-style 字体风格 normal(默认)/italic(斜体)/oblique(强制变斜)
  • font-weight 字体粗度 normal(默认)/bold(加粗)/bodler(更粗)/lighter(细)/数字>=600粗/
  • font-variant字变形 normal(默认)/small-caps(小型大写字母)
  • font-size 字体大小
  • font 统一设置 font:[style/weight/varient]size family

颜色属性

  • color

文本属性

  • letter-spacing 字母间距
  • word-spacing 单词间距
  • text-decoration 文本修饰
    • none
    • underline
    • overline
    • line-through
posted on 2017-07-26 21:45  半个句号  阅读(106)  评论(0编辑  收藏  举报