导读：操作步骤/方法1在html页面找到<title>标签，在<title>标签后新建一个<style>标签；2在<style>标签创建relativeabsolute类；3relative类设置内容为：position:relative;4absolute类设置内容为：position:absolute;text-align:center;5相关代码：6...
操作步骤/方法
1
在html页面找到<title>标签，在<title>标签后新建一个<style>标签；
2
在<style>标签创建relativeabsolute类；
3
relative类设置内容为：position:relative;
4
absolute类设置内容为：position:absolute;text-align:center;
5
相关代码：
6
<style>
7
.relative{
8
position:relative;
9
}
10
.absolute{
11
position:absolute;
12
text-align:center;
13
}
14
</style>
15
发现text-align:center无效。
16
把html页面代码保存后我们使用浏览访问，发现内容无法居中。如图：
17
解决内容无法居中。
18
回到html代码页面找到absolute类，在这个类中添加：left:0;right:0；然后保存;如图：
19
重新使用浏览器打开，我们会发现内容已经自动居中了。如图：
20
所有代码：
21
<!DOCTYPEhtml>
22
<html>
23
<head>
24
<metacharset="UTF-8">
25
<title>absolute定位内容居中</title>
26
<style>
27
.relative{
28
position:relative;
29
}
30
.absolute{
31
position:absolute;
32
text-align:center;
33
left:0;
34
right:0;
35
}
36
</style>
37
</head>
38
<body>
39
<div>
40
<div>
41
就算你用了absolute定位，我也要居中
42
</div>
43
</div>
44
</body>
45
</html>
END
以上就是小编为大家介绍的absolute内容自适应居中的全部内容，如果大家还对相关的内容感兴趣，请持续关注上海建站网！
标签：
内容声明：网站所展示的内容均由第三方用户投稿提供，内容的真实性、准确性和合法性均由发布用户负责。上海建站网对此不承担任何相关连带责任。上海建站网遵循相关法律法规严格审核相关关内容，如您发现页面有任何违法或侵权信息，欢迎向网站举报并提供有效线索，我们将认真核查、及时处理。感谢您的参与和支持！
