zoukankan      html  css  js  c++  java
  • css--盒子,浮动

     

    • Margin(外边距) - 清除边框外的区域,外边距是透明的。
    • Border(边框) - 围绕在内边距和内容外的边框。
    • Padding(内边距) - 清除内容周围的区域,内边距是透明的。
    • Content(内容) - 盒子的内容,显示文本和图像

    总元素的宽度=宽度+左填充+右填充+左边框+右边框+左边距+右边距

    总元素的高度=高度+顶部填充+底部填充+上边框+下边框+上边距+下边距

    外边距设置四周边距的顺序上右下左设定,

    Margin:                     上=下  左=右,也可以单独设定 例如margin-top

    Padding设置内边距 如padding:20px;

    Border边框border:2px solid black;

    溢出处理

                       溢出隐藏

                       overflow:hiddeen

                       溢出就加个滚动条

                       overflow:scroll;

    浮动

    1. 相对定位(相对本身div位置,原来的位置,)

                       posistion:relative

                       相对定位必须搭配position使用

    例如

    距离原来右边移动20px

    posistion:relative

                           right:20px;

                       2. 绝对定位:(相对于第一个带position样式的父元素

                        如果父元素没有position会一直往上找父元素直到找到为止, 

    如果元素没有已定位的父元素,那么它的位置相对于<html>:

    如果都没有就找body标签)

                       position:absolute;

                       3. 固定定位:(相对于屏幕定位)

                          position;fixed

            Z轴坐标,数值谁大谁先显示,用于两个div块重叠时使用

                       z-index: 1000;

    清除浮动

    1. 浮动:float:left/right;不能靠中间;

               两个div块并列就都向左浮动,

      2. 清除浮动, div块不想被浮动的div快盖住。

     clear:left/right; both(两者)

  • 相关阅读:
    转:选择学习“下一个”程序语言
    再谈 Web 字体的现状与未来
    堪称2008年最漂亮的50组图标(上)
    堪称2008年最漂亮的50组图标(下)
    回帖整理: 互联网的未来, 我们的未来, 算一个预告吧, 有空我会把这些观点一一展开
    [回帖整理]创业建议
    也论PageController/FrontController与MVC
    [回帖整理] 创业难
    是否非要用interface关键字来实现接口?
    又论社区风气, 与程序员是干嘛地的.
  • 原文地址:https://www.cnblogs.com/layuechuquwan/p/11075207.html
Copyright © 2011-2022 走看看