html css怎么让文字在页面底部居中

html-css08

html css怎么让文字在页面底部居中,第1张

想要让文字在底部，需要用到 position:fixed

bottom:0px

left:0px

想要让文字居中，需要用到 text-align:center

示例的截图

示例的代码

<!doctype

html>

<html>

<head>

<meta

charset="utf-8">

<title>文字底部居中</title>

<style>

*{margin:0px

padding:0px}

/*这行是为了清除代码默认的样式，不用拷贝*/

.botCenter{width:100%

height:35px

line-height:35px

background:#ccc

position:fixed

bottom:0px

left:0px

font-size:14px

color:#000

text-align:center}

</style>

</head>

<body>

<div

class="botCenter">就是一个在底部显示的文字</div>

</body>

</html>

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html。

2、在index.html中的<style>标签中，输入css代码：

div {position: relativewidth: 200pxheight: 80pxborder: 1px solid violet}

span {position: absolutebottom: 0left: 80px}

3、浏览器运行index.html页面，此时成功用css实现了内容在div的底部居中。