• 盒子模型


    1、盒子模型

    content(内容):必需的一部分,可以是文字、图片等元素。

    padding(空白):也称内边距或补白,用来设置内容和边框之间的内容。

    border(边框):可以设置内容边框线的粗细、颜色、样式等。

    margin(边界):外边距,用来设置内容边框线的粗细、颜色、样式等。

    2、盒子的定位与浮动

          相对定位时,无论是否进行移动,元素仍然占据原来的空间,移动元素会导致其覆盖其他框。通过设置垂直或水平位置,可以让其“相对于”它的原始起点进行移动。postion:relative

          绝对定位是参考浏览器的左上角,配合top、left、bottom和right进行定位的,若没有上述四个值,则默认依据父级的坐标原点为原始点。在父层position为默认值时:上、下、左、右的坐标原点以body的坐标原点为起始点位置。position:absolute

          固定定位是绝对定位的一种特殊形式。固定定位的容器不会随着滚动条的拖动而变化位置。可以把一些特殊效果固定在浏览器的视线位置。

    区别:

          绝对定位的坐标原点为上级元素的原点,与上级元素有关;相对定位的坐标原点为本身偏移前的原点,与上级元素无关。

    注意:

          页面设计要适应各种屏幕分辨率,并且要能够正常显示。在定位时最好使用相对定位。在使用绝对定位时会产生一个问题。目前。大多数网页都是居中显示的,而且元素与元素之间的布局是紧密的。而绝对定位的开始位置是浏览器左上角的原点,当设定各元素块边偏移属性时,由于客户端分辨率的不同,各元素块的显示可能会有偏差。

  • 相关阅读:
    HDU 5546 深搜吧 主要是提取的时候容易重复
    HDU 5543 新型01背包 两端放一半就可以有其价值
    HDU 2586 查找两点之间的距离
    HDU 5652 二分加搜索 http://acm.split.hdu.edu.cn/showproblem.php?pid=5652
    美句
    最短路径问题
    1766 装果子
    Watchcow
    codevs 4768 跳石头
    noi 7219:复杂的整数划分问题
  • 原文地址:https://www.cnblogs.com/qfdy123/p/10920350.html
Copyright © 2020-2023  润新知