当前位置: 首页 > article >正文

盒子模型(内边距的设置)

  • 所有元素都可以设置内边距
  • 属性和外边距属性大体相同,可参考上一篇,但有区别
    • 内边距不能设置为负值
    • padding-方向:尺寸
  • 注意:使用内边距padding之后元素整体会变大,因为他是直接加上了内边距的大小,不改变元素本身的大小,因此可能会导致页面变形(正常情况下,内边距和边框是在元素设置的宽度和高度之外进行绘制)
  • 若想让padding元素改为在设置的宽度和高度之内进行设置,需要修改一个属性 box-sizing: border-box;;其默认值为box-sizing: content-box;即在之外绘制
  • 元素最终的宽度=左边框+右边框+左内边距+右内边距+元素内容宽度
  • 元素最终的高度=上边框+下边框+上内边距+下内边距+元素内容高度
  • 对某些浏览器可能不支持box-sizing属性的设置:(同时写上,若不支持,则自动选择适合的属性值)
    //火狐浏览器专有属性
     -moz-box-sizing: border-box; 
     //webkit内核浏览器
     -webkit-box-sizing: border-box;
     box-sizing: border-box;

http://www.kler.cn/a/449297.html

相关文章:

  • 算法day_3数组中的单一元素和二进制位颠倒
  • C++的侵入式链表
  • Odoo:免费开源ERP的AI技术赋能出海企业电子商务应用介绍
  • C/C++圣诞树
  • taiwindcss
  • kotlin中泛型中in和out的区别
  • 计算机组成原理的学习笔记(6)-- 存储器·其一 SRAM/DRAM/ROM/主存储器的初步认识
  • 学习threejs,scene.overrideMaterial全局材质效果
  • pycharm无法识别conda环境(已解决)
  • Jmeter对图片验证码的处理【超详细】
  • Html:点击图标链接发起QQ临时会话
  • 【LeetCode每日一题】——415.字符串相加
  • 【C++——迭代器】
  • 安科瑞能源物联网平台在老旧小区用电安全改造中的应用与优势
  • HTML+CSS+JS制作汽车网站(内附源码,含5个页面)
  • LLM与金融
  • Python绘制图表
  • SpringBoot3-第一篇(快速入门)
  • Source Insight 导入代码库 观察linux源码
  • canvas绘制仪表盘刻度盘
  • WorkManager
  • Centos8安装源出错 设置基础软件仓库出错(已解决-秒解)
  • ubuntu 安装docker
  • 【枚举】假币问题
  • 《Vue进阶教程》第十六课:深入完善响应式系统之单例模式
  • 从0到1手写实现Event Emitter