seo如何分析网站,seo广告优化,给用ps做的网站加div,企业网络搭建教程0. 写在前面 过年也不能停止学习#xff0c;一停下就难以为继#xff0c;实属不应 1. 盒子的水平宽度
当一个盒子出现在另一个盒子的内容区时#xff0c;该盒子的水平宽度“必须”等于父元素内容区的宽度 盒子水平宽度#xff1a; margin-left border-left padding-lef…0. 写在前面 过年也不能停止学习一停下就难以为继实属不应 1. 盒子的水平宽度
当一个盒子出现在另一个盒子的内容区时该盒子的水平宽度“必须”等于父元素内容区的宽度 盒子水平宽度 margin-left border-left padding-left width padding-right border-right margin-right
若强行设置盒子的水平宽度不等于父元素内容区的宽度时这种情况称为“过度约束” 若发生过度约束时浏览器会按照从左到右的顺序尽可能的满足条件若不满足则自动调整margin-right使等式成立 注现在好像不能在浏览器中通过F12选元素查看到浏览器的自动调整不知道是为啥
margin-left和margin-right的auto属性让浏览器自动设置左右外边距 margin-left和margin-right的值设置为auto后浏览器会根据上述公式平均分配左右外边距
盒子的水平居中 width: 100px; margin: 0 auto; 注意必须指明宽度width否则默认值为auto浏览器会默认使用width进行内容区的填充
示例如下
!DOCTYPE html
html langenheadmeta charsetUTF-8!-- meta nameviewport contentwidthdevice-width, initial-scale1.0 --titleBox horizontal layout/title.father {width: 1200px;height: 200px;border: 5px solid red;}.son {width: 200px;height: 200px;background-color: #c7decc;margin: 0 auto;}
/headbodydiv classfatherdiv classson/div/div
/body/html