zoukankan      html  css  js  c++  java
  • css布局与盒子模型

    一、    盒子模型

     

    注:

    1、红色为border;

    2、背景应用于内容、内边距、边框组成的区域;

    3、Width和height指的是内容区域的高度和宽度。

    边框属性:

    1、  padding属性:(默认靠左上)

     padding: 10px;           ---------内容与四边框的距离为10px;

            10px, 0px, 10px, 0px;-------上右下左

    padding-left: 10px;       ----------内容与上边框的距离为10px;

    2、  margin属性:(同上)

    3、  border属性:

    border: 5px solid blue;

    border-5px;

    border-style:solid/dashed;

    border-color:blue;

    border-top: 5px solid blue;

    border-top-8px;

    注:

    距离可以用像素表示,也可以用百分比表示;也可设置AUTO.

    二、css定位

    position: relative/fixed/absolute

    1、  相对定位:

    会按照元素的原始位置对改元素进行移动;

    2、  绝对定位:

    相对与最近的已定位的父级元素进行移动如果没有已定位的父级元素,则系那个对于最初的包含快;

    3、  固定定位:相对于浏览器的定位liru某些网站的右下角弹窗;

    4、  流式布局:

    Float: right (从右往左依次) /left(从左往右)

    注:一条边框会占一个像素; 所有div都必须设置定位。

  • 相关阅读:
    流形学习(Mainfold Learning)
    陈皓的博客
    背包九讲
    阮一峰的个人网站
    PyTorch教程【六】Transforms的使用
    PyCharm设置代码提示忽略大小写
    PyTorch教程【五】TensoBoard的使用
    pip 换源
    PyCharm常用快捷键
    JAVA基础篇—HashMap
  • 原文地址:https://www.cnblogs.com/chenguanai/p/6567809.html
Copyright © 2011-2022 走看看