css基础知识整理

CSS

层叠样式表，美化html页面

div、span、p标签

• 都是容器，用来包裹html代码统一设置样式

引入css

• 标签上添加style属性，不推荐！
• 通过style标签引入css
• 引入外部的css文件

选择器

• 基本选择器

  • 标签名选择器
  • 类选择器
  • id选择器

• 扩展选择器

  • 后代选择器

  • 子元素选择器

  • 分组选择器

  • 属性选择器

  • 相邻兄弟选择器

  • 伪元素选择器

    • :link未点击状态
    • :hover鼠标悬停状态
    • :active点击时状态
    • :visited点击后状态

• 边框、边距

  • 边框：border
  • 外边距：margin
  • 内边距：padding

• 元素类型

  • 块级元素

    • 独占一行，可以设置所有属性，可以包含任何元素

  • 行内元素

    • 同行显示，宽高、上下外边距不生效，只能包含行内元素

• display属性

  • block：块级元素默认值
  • inline：行内元素默认值
  • inline-block：兼顾行内元素和块级元素
  • none：隐藏元素

• css属性

  • 字体样式设置
  • 背景样式设置
  • 其他样式