css3学习笔记

css学习笔记

  1. 元素分类
    (1) 块级元素:块元素是一个元素,占用了全部宽度,在前后都是换行符,例如:h,p,div
    (2) 内联元素:内联元素只需要必要的宽度,不强制换行,例如:span,image,a
    (3) inline-block元素:既可以同行排列又可以设置大小,
    参考:https://blog.csdn.net/gabby____/article/details/82121095

  2. display
    可以更改元素的显示方式,在inline和block中进行转换

  3. 定位
    参考:https://www.runoob.com/css/css-positioning.html
    (1) 定位的类型:static/relative/absolute/fixed/sticky

    • static:HTML 元素的默认值,即没有定位,遵循正常的文档流对象。静态定位的元素不会受到 top, bottom, left, right影响。
    • fixed:元素的位置相对于浏览器窗口是固定位置。即使窗口是滚动的它也不会移动,Fixed定位使元素的位置与文档流无关,因此不占据空间。Fixed定位的元素和其他元素重叠。
    • relative:相对定位元素的定位是相对其正常位置。移动相对定位元素,但它原本所占的空间不会改变。相对定位元素经常被用来作为绝对定位元素的容器块。
    • absolute:绝对定位的元素的位置相对于最近的已定位父元素,如果元素没有已定位的父元素,那么它的位置相对于。absolute 定位使元素的位置与文档流无关,因此不占据空间。absolute 定位的元素和其他元素重叠。
    • sticky:粘性定位的元素是依赖于用户的滚动,在position :relative 与 position:fixed 定位之间切换。

    (2)元素重叠

    • 元素的定位与文档流无关,所以它们可以覆盖页面上的其它元素,z-index属性指定了一个元素的堆叠顺序(哪个元素应该放在前面,或后面)。一个元素可以有正数或负数的堆叠顺序。

    (3)元素溢出

    • over-flow:overflow 属性可以控制内容溢出元素框时在对应的元素区间内添加滚动条。overflow 属性只工作于指定高度的块元素上。属性:visible/hidden/scroll/auto/inherit
  4. 浮动
    参考:https://blog.csdn.net/Czc1357618897/article/details/122980847
    教程:https://www.runoob.com/css/css-float.html

  5. 文本多行省略
    参考:https://blog.csdn.net/qq_46112274/article/details/124300761

posted on 2022-07-13 10:37  朝朝暮Mu  阅读(31)  评论(0)    收藏  举报