使用百分比确定的元素高度怎么确定行高保证行内元素居中对齐

zhang90

10231833

发布于
2017-01-03

比如 body 高度不确定设为百分百
div高度为body高度百分之20%
现在想要div内文本元素居中对齐,应该怎么设置呢

html css javascript

html5

阅读 2.3k

2 个回答

得票最新

cool_zjy

5.6k3723

发布于
2017-01-03

再内嵌一个元素使用定位和变形的垂直居中方法即可

八月末

101311

发布于
2017-01-04

<!DOCTYPE html>
<html>

<head>

<title>demo</title>
<meta charset="utf-8">
<style>
html,
body {
    position: relative;
    height: 100%;
    width: 100%;
}

div {
    background-color: red;
    position: absolute;
    height: 20%;
    width: 20%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}
</style>

</head>

<body>

<div></div>

</body>

</html>

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

相似问题

找不到问题？创建新问题

使用百分比确定的元素高度怎么确定行高保证行内元素居中对齐

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

为什么在谷歌浏览器中 'a' == ['a'] 返回 true？

vue项目如何在初始化之前跳转外部页面？

js如何控制移动端overflow:scroll容器滑动的最大速度？

前端代码更新如何通知用户刷新页面？

纯css如何绘制一个无背景色有边框色，带有文字的倒等腰梯形？

css布局怎么保证右边一直在可视范围内？