【HTML打卡】0114 盒模型margin、border、padding

今日成就:

刷完了gossip girl第三季。

心疼我Chuck bass...Clair...第四季虐起来吧微笑

有时候看S真的好烦哈哈哈哈哈


http://s15.sinaimg.cn/large/691795ebgc18b55cda03e&690


1、外边距margin(盒子与盒子之间)

设置方式:

(1)分别设置

margin-top

margin-bottom

margin-left

margin-right

(2)统一设置

margin:10px

margin:10px 20px(未设置的跟与对边长度相同)

margin:10px 20px 30px 40px(顺序上左下右)

(3)元素居中

margin:0 auto;


2、边框border

三要素:长度 形状 颜色

设置方式:

(1)border:10px solid blue;

(2)border-color:white white white red;(可用此方式画三角形)


3、内间距padding(文字与盒子之间)

颜色与盒子颜色相同。


总结:盒子实际占据位置为height+其他 / width+其他。


posted @ 2016-01-14 22:15  怡人Iris  阅读(124)  评论(0编辑  收藏  举报