千峰前端css笔记-个人版

css语法

在这里插入图片描述

  • css内部样式:在head里写style,里面编变成css语法了 注释符号也变了,p{}修饰段落,要带单位。在这里插入图片描述
  • css外部样式:创建css文件,link或者import。最好用link
    在这里插入图片描述
 <link rel = "stylesheet" href = "css文件路径" type = "text/css" >
  • 行内样式(少用)
    在这里插入图片描述
选择器

在这里插入图片描述

  • 基本选择器
    在这里插入图片描述
    1.类型选择器:如p{ }在这里插入图片描述
  1. 类型选择器: 区分某个标签,取类名,类名调用
    在这里插入图片描述
    在这里插入图片描述
  2. id选择器:和上一个相比,一个标签只能一个id。一个id可以有多个标签
    在这里插入图片描述
  3. 通配符:改所有
    在这里插入图片描述
  4. 群组选择器:就是把相同的外观写在一起,减少代码在这里插入图片描述
  • 权重在这里插入图片描述
浮动
  • 浮动div后,文字环绕现象又叫脱离文档流
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
  • 页面顶端的间距消除

在这里插入图片描述

  • 后代选择器
    在这里插入图片描述
    在这里插入图片描述
    写法在这里插入图片描述
    在这里插入图片描述
margin外间距

在这里插入图片描述
也可以在这里插入图片描述

  • auto:左右居中
    注意float会覆盖auto
    在这里插入图片描述
    没有float的left时候
    在这里插入图片描述
  • margin间距重叠或者父子间距传递时候,这样可以解决
    在这里插入图片描述
padding内间距

(会把外边的盒子撑大)
解决方法:父盒子宽度、高度减去。

text相关属性

在这里插入图片描述

  • 1em = 16px
  • 字体:没有的话解析第二个
    在这里插入图片描述
    在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/foolbirdM/article/details/122555918
今日推荐