音乐分享(点击链接可以听哦)
带我去很远地方 - 黄霄雲
⭐⭐⭐️️️
目录
⭐案例1
原因:
⭐案例2
法一:
法二:
平时学的时候没有在意这一点,感觉很简单,但是真正实践的时候就傻眼了
先来一个题目
盒子尺寸300*300,背景天蓝色,边框10px实线黄绿色,上下左右20px的内边距,水平居中
错误代码
错误代码
错误代码
Document
右击检查,发现盒子大小已经超出300px了
⭐border会撑大盒子
⭐padding会撑大盒子
解决方法
那么为了实现需求,可以改变盒子的实际宽度
(实际大小=左border+左padding+内容宽度+右padding+右border)
那么变成width: 240px即可
下面我将用两种方法来实现下图的布局
使用浮动
Document
header
leftside
rightside
使用位置定位
父相子绝(父亲属性是:relative,儿子属性是:absolate)
Document
header
leftside
rightside
Code over!