关于css里<li>内文字 竖直居中 ?

html-css011

关于css里<li>内文字 竖直居中 ?,第1张

1.首先,打开HTML编辑器并创建一个新的HTML文件,比如index。说明:html,用于填写代码的基本层次的问题。-

2.在index.html中的<style>标签中,将“.shoucang .sc_ul li”中的“height: 73px”调整为:height: 73pxpadding-top: 7px。

3.最后,浏览器运行index.html页面,发现li标记中的文本垂直和水平居中。

扩展资料:

其他代码:

Thecodeisasfollows:

<style type = "text/CSS" >

.Shoucang{

Width:58px;

Height:300px;

Float:correct;

Background-color:#CCC;

Border:1pxentity#999;

.Shoucang.Sc_ul{

Width:21px;

Margin-right:car;

Margin-left:car;

Thelist-style-type:no;

Padding-top:20px;

Padding-right:0px;

Padding-bottom:0px;

Padding-left:0px;

Margin-top:0px;

Margin-bottom:0px;

.Shoucang.Sc_ulli{

Thetext-align:center;

Vertical-align:intermediate;

Height:80px;

Width:21px;

Margin-bottom:9px;

Color:#FFF.

Textmodification:no;

Thetext-align:center;

Vertical-align:intermediate;

Background-color:#FF0000;

Fontsize:12px;

Border:1pxentity#666;

-->

></ style

</ a >

The <body >

<div class = "shoucang" >

<ul class = "sc_ul" ><li >set as home </ li ><li >lee </ >

<li class = "no" >contact way lee </ a >

</ ul >

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

1、首先,打开html编辑器,新建一个html文件,例如:index.html,填充问题基础代码。

2、在index.html中的<style>标签中,将“.shoucang .sc_ul li”中的“height: 73px”调整为:height: 73pxpadding-top: 7px。

3、最后,浏览器运行index.html页面,此时发现li标签中的文字被垂直和水平居中了。

居中:text-align:center( 而默认就是左对齐的),

再设置:text-align:left

代码如下:

.box{text-align:center;text-align:left}

<ul class=“box”>

<li>内容1</li>

<li>内容2</li>

<li>内容3</li>

</ul>