CSS盒子模型(溢出隐藏,块级元素和行级元素的居中对齐,元素样式重置)

overflow:值

规定了内容溢出元素框时所发生的事情

  • visible:内容不会被修剪,会显示在元素框之外,默认值 overflow: visible;

  • hidden:内容会被修剪,溢出内容不可见 overflow: hidden;

  • scroll:内容会被修剪,溢出内容会显示滚动条以便查看溢出内容 overflow: scroll;

  • auto:当内容多于元素框时,内容会被修剪并显示滚动条;当内容少于元素框时,不会显示滚动条,正常显示。

元素居中

  • 块级元素 水平居中可以用 margin: 0 auto;【只对块级元素有效】
  • 行级元素居中:对父级元素加入text-align属性:
css 复制代码
        body{
            text-align: center;
        }

元素样式重置

使样式在所有浏览器中显示的样式都一致,不因浏览器不同而导致样式的混乱

css 复制代码
* {margin: 0;
   padding: 0;
   -moz-box-sizing: border-box; 
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
}
img {
    border: none;
    vertical-align: top;
}
相关推荐
A_nanda3 分钟前
vue实现走马灯显示文字效果
前端·javascript·vue.js
小码哥_常5 分钟前
Kotlin 延迟初始化:lateinit与by lazy的华山论剑
前端
晴栀ay12 分钟前
一文详解JS中的执行顺序——事件循环(宏任务、微任务)
前端·javascript·面试
张元清27 分钟前
React 19 Hooks:新特性及高效使用指南
前端·javascript·面试
敏捷建模29 分钟前
Zig语言能够编写同时针对PC端和手机端自适应的软件吗
前端
Hello_Embed37 分钟前
LVGL 入门(四):大小坐标与盒子模型
前端·笔记·stm32·单片机·嵌入式
༄天M宇ༀ1 小时前
E10: e-builder 低代码构建平台接口管理(E9建模版)
java·前端·spring·servlet·reactjs
窝子面1 小时前
解决vite构建的项目中使用path报错
前端
kana_yonk1 小时前
如何设置前端vue程序开机自启(Windows)
前端·vue.js·windows