标签：box padding 伪类 solid 元素 content 默认值 border

伪类元素

用于存放文本和其他元素大的区域

类似于一个箱子之间存放东西

边框盒boder box{由boder，padding content 组成}

填充盒padding box{由padding content 组成}

内容盒 content box{由content组成}

什么是继承

继承（inherit） 是指子元素会自动拥有父元素的某些css属性

继承发生的场景

一个元素某个属性满足一下两个条件可继承

• 是可继承属性

• 该属性在样式表中没有声明

  强制继承

  强制继承也叫显示继承是指将指定的css属性值设置为inherit

  盒模型中只有magin能给负值

  / overflow: scroll; 两个方向都有都活有滚动条/**

  overflow: hidden;

  /即只显示填充盒内容区域的内容/

  / 超出部分隐藏 hidden/**

  / overflow-y: scroll; /

  / c超出部分使用滑轮 /

  / overflow: auto; /

  / 哪个方向有超出内容 就会自动添加滚动条/**

  / overflow: visible; /

  / 显示超出部分 /

  / display:flex;*

  *flex-direction: column-reverse; /

  / 断词规则*

  英文空格符 标点符号

  中文 标点符号、空格

  *数字 标点符 空格 /

  / word-break: break-all;*

  *word-break: normal; /

  **/按照断词规则进行 /

  border-top: 10px solid black;

  border-top-color: rgb(5, 26, 26);

  border-bottom: 10px solid black;

  border-bottom-color: rgb(12, 12, 12);

  background-clip: padding-box ;

  ---

  / 改变渲染区域 背景的剪切/**

  / 设置背景的渲染区域*

  bodding-box（默认值）边框盒的左上角开始

  padding-box（默认值）填充盒的左上角开始

  *content-box（默认值） 内容盒的左上角开始 /

  }

  ---

  ---

  / 设置背景的显示区域*

  bodding-box（默认值）边框盒的左上角开始

  padding-box（默认值）填充盒的左上角开始

  *content-box（默认值） 内容盒的左上角开始 /

  / 普通盒模型与IE浏览器的区别*

  *设置元素的宽高不同 /

  }

  /设置盒子的计算规则 他没有填充盒的取值 默认值是 box-sizing: content-box;/

  }

  div:hover{

  / border: 10px solid black; /

  / 轮廓 缺点不占像素*

  缺点不可以分别设置4个方向的值 （即4个方向样式统一）*/

  outline:5px solid red;

  input:focus{

  / focus激活 /

  outline: 1px solid red;

  / border: 1px solid red; /

  }

标签：box,padding,伪类,solid,元素,content,默认值,border
来源： https://blog.csdn.net/w1148817747/article/details/115447048

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。