通过css布局完成div位置的存放实例

零下一度
Lepaskan: 2017-06-24 11:43:23
asal
1389 orang telah melayarinya

CSS+DIV

将数据封装到div中,页面中都是有很多div组成的,通过css布局(通过css属性布局)完成这些div位置的存放,一个div就是一个盒子。

边框   border:{

      --left

      --right

      --top

      --bottom

    };

#div_1{

    border-top:1px solid #ccc;

    border-bottom:1px dashed #ccc;

    border-right:1px dotted #ccc;

    border-left:1px double #ccc;

};

solid:实线

dashed:虚线

dotted:点线

double:双线

 

内边距/内填充

属性:padding{

      --top

      --bottom

      --right

      --left

};

padding:20px 20px 20px 20px;

 

外边距

margin 属性{

      --top

      --bottom

      --right

      --left

};

margin:20px 20px 20px 20px

在div中,如果margin是0,px,为什么还要空白?那空白就是body本身距离浏览器边框的距离。

所以要设置body{margin:0px};

浏览器解析body的方式不同,造成边宽边窄不同。

Atas ialah kandungan terperinci 通过css布局完成div位置的存放实例. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan