如何让div在页面中居中? (高度宽度)?

2023-12-05

愚蠢的问题,但我找不到答案,因为所有答案都假设 div 的宽度居中。

我需要的是以高度和宽度的方式将 div 居中,以便位于页面的非常中心。

我尝试了这个,但它只是以页面宽度而不是高度的方式将 div 居中。

#myDiv {
   width: 500px;
   height: 500px;
   margin: auto;
}

那么我怎样才能把它放在页面的正中央呢? )))


创建带有 ID 的包装器wrapper周围的#myDiv元素,并应用以下 CSS 代码:

#wrapper{
    display: table;
}
#myDiv{
    display: table-cell;
    vertical-align: middle; /*Vertically centered*/
    text-align: center; /* Horizontally centered */
}

此代码将任意宽度/高度的元素居中。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何让div在页面中居中? (高度宽度)? 的相关文章

  • Sass 负变量值?

    我有几个 scss 选择器 其中我使用相同数量的正数和负数 如下所示 padding 0 15px 15px margin 0 15px 20px 15px 我更喜欢对所有 15px 量使用一个变量 但这不起作用 pad 15px padd
  • mailto:相当于电话的链接? [复制]

    这个问题在这里已经有答案了 有没有办法使用 html 和 或 JS 链接图像以便拨打电话 类似于 mailto 链接 如果可能的话 这只会让生活变得更加轻松 假设如果一个人有 Skype 是否可以通过一个按钮为他们打开 Skype 并拨打电
  • Angular 和 Node JS 中的路由问题 [Angular]

    我有角度js的问题 我创建了 login html 和 home html 成功登录后我想将页面更改为 home html 我的路由不起作用 默认 url 是 localhost angular 我尝试路由 realpath 即 local
  • 如何使用 javascript 触发表单验证的本机验证气泡/工具提示?

    我有一个附加了 html5 验证 必需 等 属性的表单 有没有一种方法可以触发本机验证气泡 工具提示的出现 而无需模拟表单的提交按钮上的 单击 正如评论中所述 您可以使用 reportValidity 方法 这是广泛支持 https dev
  • 带有旋转文本的垂直导航

    我正在尝试实现一个包含链接的垂直导航菜单 并且我已使用 css3 将链接文本旋转到 270 度 我旋转了它 因为我希望文本从下到上 问题是当我添加顶部填充时 间距不一致 你可以看到我的代码here http jsbin com ravudu
  • 具有固定位置的平滑滚动标题

    当我将位置更改为固定时如何创建平滑滚动 我尝试添加动画但不起作用 最好使用jquery动画 window scroll function var sticky mobile menu scroll window scrollTop if s
  • 通过搜索查找下一个文本并突出显示不起作用

    当在搜索框中搜索任何文本时 它可以找到并突出显示正确的文本 但是当搜索下一个 新文本时 它无法找到下一个 新文本 再次搜索时它不起作用 我无法找到问题 这JS below JS button search click function va
  • 如何在 jQuery 中使用 CSS“background-image”属性添加的图像上绑定单击事件

    这是我的小提琴link http jsbin com otisur 1 edit 我想我的问题通过标题本身就很清楚了 尽管如此 我正在寻找一种绑定的方法click使用 css 添加的图像上的事件background image财产 我知道
  • 动态检测屏幕高度和屏幕宽度,以精简图像的高度和宽度

    我以前可以display a div标签仅在portrait使用下面提到的代码corrl https stackoverflow com users 15388872 corrl in this https stackoverflow co
  • jQuery - 拖动div css背景

    我希望能够在 div 内按住鼠标并移动它的背景 在谷歌上搜索了很多 没有找到我想要的 这是目标 显示的地图是要拖动的对象 http pontografico net pvt gamemap http pontografico net pvt
  • 如何中和 CSS 定义而不覆盖

    有没有一种方法可以中和元素的 CSS 规则而不覆盖所有内容 例如 我正在使用 Twitter Bootstrap 它有许多预定义的 CSS 定义table 在某些地方 我不想要它们 对某些table元素 我想知道我是否可以做这样的事情 ta
  • 在 Apache 服务器上将特定的 .htm 页面处理为 .php [重复]

    这个问题在这里已经有答案了 我正在为 Apache 服务器编程 并且只需要将一个特定的 html 页面 例如 first htm 作为 PHP 脚本进行处理 可以设置吗 SetHandler http httpd apache org do
  • 从 html 页面和 javascript 调用 java webservice

    我正在尝试从 javascript 调用 java 实现的 Web 服务 使用 NetBeans IDE 我读过很多关于 jQuery 和 AJAX 的内容 但我似乎无法掌握它 假设我的 Web 服务 WSDL 位于 http localh
  • 为 Gmail 设计 HTML 电子邮件

    我正在生成一封使用内部样式表的 html 电子邮件 即 h2 class foo Email content here 在 Gmail 中查看时 内部样式表中的所有样式似乎都被忽略 Gmail 似乎忽略了内联规则以外的所有样式 例如 h2
  • iframe 位置居中

    所以我找到了这段用于将内容放在中心的代码 但我的问题是它是为容器制作的 你知道如何为 iframe 制作它吗 或者你知道另一个代码吗 代码 center margin auto width 60 border 3px solid 73AD2
  • 在 Selenium WebDriver 上如何从 Span 标签获取文本

    在 Selenium Webdriver 上 如何从 span 标记检索文本并打印 我需要提取文本UPS Overnight Free HTML代码如下 div id customSelect 3 class select wrapper
  • CSS 字体在 Firefox 中不起作用

    我下面有这个字体代码 它在谷歌浏览器中工作正常 但在火狐浏览器中根本不起作用 为什么
  • 两个 div 之间的匿名空白

    这里是Fiddle http jsfiddle net y6hSV 1 我有两个divs一个用于标题 另一个用于主体 在 的里面div这是标题 我还有另一个div那个 div 是floated left 因为那个floating 两者之间出
  • 浏览器正在加载两张图像 - 一张用于 srcset,一张用于 src(Chrome 41 等)

    我正在开发的网页上使用 srcset 属性 img src img picture 820x496 jpg 如果我检查页面加载了哪些资源 我会发现 Chrome 41 以及使用 polyfill 的 FF 以及 Safari 7 总是加载图
  • 允许 iframe 跨域链接到目标父框架

    我有 2 个域 域 1 上的一个页面使用 iframe 加载域 2 中的内容 如何允许来自domain2 iframe 内 的链接在domain1 的完整父框架中打开 我一直在关注IE和w3c的新沙箱属性 http www w3 org T

随机推荐

  • IOError:13,通过 Python 写入 /etc/hosts 时“权限被拒绝”

    我正在开发一个 Python 应用程序 需要访问主机文件以添加几行 一切都在我的测试文件上运行 但是当我告诉程序实际修改 etc hosts 中的主机文件时 我收到 IOError 13 据我了解 我的应用程序没有 root 权限 我的问题
  • 如何使用优先队列?

    我如何获得PriorityQueue对我想要它排序的内容进行排序 另外 两者之间有区别吗offer and add方法 使用构造函数重载 它需要一个Comparator
  • arulesSequences 中的 cspade 函数引发连接错误

    我在用arulesSequencesR 库 这部分代码工作正常 x lt read baskets con system file misc zaki2 txt package arulesSequences info c sequence
  • __m256d TRANSPOSE4 等效吗?

    Intel 已包含 MM TRANPOSE4 PS 来转置 4x4 向量矩阵 我想用 m256d 做同样的事情 但是 我似乎无法弄清楚如何以相同的方式获取 mm256 shuffle pd MM TRANSPOSE4 PS代码 define
  • Zebra打印机C#代码打印条码标签

    这是我的 prn 文件 I8 A 001 Q0001 0 q831 rN S5 D10 ZT JF O R20 0 f100 N B775 188 2 1 2 6 160 B SM00020000 X0 199 1 0 200 P1 SM0
  • os x 上自定义类似 emacs 的键绑定:DefaultKeyBinding.dict 无法按预期工作

    我正在尝试添加 OS X 10 7 5 中类似 emacs 的键绑定 特别是 在默认键绑定中 alt d 和 alt b 插入特殊字符 而我希望它们删除一个单词并移回一个单词 我已经创建了一个文件 Library KeyBindings D
  • $("select>option[text='xxx']") 不起作用

    我需要用文本设置默认选定值 这是我的代码 HTML
  • 绘制给定半径和两个位置的曲线

    我有两个位置 我必须在两个位置之间根据半径绘制一条曲线 我画了一张图 我知道怎么画圆 但如何只绘制圆的一部分呢 以下是已知参数 当前位置 下一个地点 曲线 圆的半径 如果有人可以告诉我如何获取当前位置和下一个位置之间的圆上的点 我可以使用折
  • (方案)递归函数来计算某些列表的所有可能组合?

    计算所有可能的列表组合的递归函数的示例是什么 例如 combine list 1 2 3 list 1 2 应该返回 1 1 1 2 2 1 2 2 3 1 3 2 这是我的看法 我首先定义一个助手concat map 它需要一个列表和一个
  • OracleCommand命令,ExecuteNonQuery问题

    但是 当我运行以下代码时遇到问题时 我必须清除 Oracle 数据库中的某些表 public static void ClearDataTables IList
  • foreach 循环并返回未定义的值

    我想知道是否有人可以解释为什么这个函数返回undefined而不是建立的对象 var people name John name Dean name Jim function test name people forEach functio
  • cy.origin() 和立即重定向

    我在测试受 oauth 保护的应用程序时遇到问题 当没有公共页面时 问题就会显现出来 如果用户未经过身份验证 就会立即重定向到 OAuth 服务器 我设法以更简单的设置重现该问题 在 fake app 域中运行的假应用程序 在 fake o
  • Android Google Maps,如何让每个Marker InfoWindow打开不同的Activity?

    我使用以下代码段在谷歌地图上显示多个位置 我将这些坐标作为数组获取 在地图上显示标记后 我想在单击标记的信息窗口后进行活动 单个标记的每个信息窗口在单击后应具有不同的活动 我有 4 个标记 我想通过单击信息窗口来访问 4 个不同的活动 我应
  • 如何在 bash shell 中使用部分读取配置文件

    我有这样的配置文件 rsync includes user data conf rsync exclude tmp pyc vendor javascript utils data 我有我想在 rsync 和该文件中的其他配置数据中排除的模
  • 网站真的需要迎合未启用 Javascript 的浏览器吗? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心以获得指导 为什么许多专业的 Web
  • Objective-C中有没有类似于C#的yield return的东西

    Objective C 中有没有类似于 C 的东西yield return 不 Objective C 中没有任何东西可以让您轻松构建可迭代的解决方案 一般来说 快速枚举Objective C 是使用与 C Java 或 C 完全不同的机制
  • 如何将odoo 8数据库升级到odoo 9?

    我正在尝试将 odoo 安装从 8 0 升级到 9 0 到目前为止我所做的如下 从生产系统备份odoo数据库 在我当前的系统中安装备份数据库作为测试 将 odoo 文件夹复制到我系统上的文件夹中 检查一下 是否一切正常 有用 更新到最新v8
  • 递归调用 Firestore

    我有一个 Firebase Firestore 其中 Components 作为根集合 集合中的每个文档 组件 可能有一个名为 children 的数组 数组中的每个项目都是另一个组件的 id 本质上是一对多关系 由于每个孩子也是一个组件
  • AWS Lambda并发请求限制以及如何增加它?

    我想要同时处理 1000 万个请求 AWS lambda 是否能够做到这一点 因为他们提到 AWS lambda 限制仅为 100 个并发请求 在 AWS 控制台内导航至支持中心 在这里您可以创建一个服务限额增加用于 AWS Lambda
  • 如何让div在页面中居中? (高度宽度)?

    愚蠢的问题 但我找不到答案 因为所有答案都假设 div 的宽度居中 我需要的是以高度和宽度的方式将 div 居中 以便位于页面的非常中心 我尝试了这个 但它只是以页面宽度而不是高度的方式将 div 居中 myDiv width 500px