html - 是否可以按元素的中心定位元素?

标签 html css layout positioning

使用 position: absolute,您可以通过定义其中一个 Angular 来放置元素(通常使用 top 和 left 属性)。是否可以通过定义它的中心来放置它? (不知道它的宽度/高度?)。

最佳答案

我用这个 jsFiddle link 回答了一个类似的问题

链接到与我的回答相似的问题:Position the center of an image using css

然后您可以使用像素使用顶部/左侧坐标,无论宽度/高度如何,它都将使用对象的中心,这可能是动态适合内容的。一个问题可能是您需要设置一些 z-index 和样式,以便其他包装 div 不会打扰您的其余内容,这可能是使用这种方法的一个缺点。

解决方案在于使用具有真实位置的包装 div,并在该包装内包含样式的另一个包装 div:position: relative;padding-top: 25%;margin-top: -100% ;左边距:-100%;。 margin-left 样式很容易应用,但 margin-top 需要填充,因此需要额外的包装 div。

如果你想要另一种方法,我想你将不得不使用 Javascript。

关于html - 是否可以按元素的中心定位元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13662792/

相关文章:

javascript - 树中的子节点需要设置验证只能添加6层

html - 在 CSS 中保持 div 直接

react-native - React Native FlatList - 如何在下方为按钮留出空间?

javascript - jQuery 移动 |页面之间的导航

html - 鼠标悬停的图像 : Transparent Boxes Not Same Size as Image

Jquery 自动完成菜单项文本对齐/填充/两端对齐

html - 如何在 Firefox 和 Chrome 中实现相同的行高?

javascript - 以模式显示来自表单提交(Mailchimp)的响应

delphi - 搜索具有动态布局的自定义缩略图查看器组件

java - 带有 ADT 插件的 Eclipse - 布局编辑器不显示内容(卡在 "Loading editor"上)