导航:首页 > 文字图片 > li中让图片文字等高

li中让图片文字等高

发布时间:2022-05-09 17:08:01

① li 标签里的文字上下居中,与图片处于同一水平线

你还可以设置文字内边距为
padding:3px 0 3px 0
或者只加个padding-bottom:2px
大小自己调整吧

怎么控制li内图片和文字的位置与其他li在同一水平线上

添加css sprite可以添加在父级的背景里面,你现在写的就可以写在li的背景里面,再给定位就行了,不是所有图片都要用img,在整个网页上面,只有logo和一些重要的图片用img。

③ li标签中的文字和图片水平居中,ie6怎么兼容

图片要浮动,
文字居中就是在li里设置行高和li的高一样,line-height:24px;

给个例子你看

.abc li{
float:left;
display:inline;
font-size:12px;
height:24px;
line-height:24px;
}
.abc li img{
cursor:pointer;
float:left;
display:inline;
margin-left:10px;
margin-top:8px;
}

④ html li 图片与文字对齐

在html中让图片和文本对齐,这个的话,你可以将图片和文本放到2个div中然后用一个div包裹着,给那2个div设置float属性,当然宽度,高度是不能少的,然后在使用margin使这2个有点间隔,这里我提交一段代码:
<html>
<head>
<title>图片和文本的对齐</title>
</head>

<body>
<div>
<div style='flaot:left; width:330px; height:200px;'>
<img src='图片地址'>
</div>
<div style='flaot:left; width:330px; height:200px; margin-left:30px;'>
<p>我是右边的测试文字</p>
</div>
</div>
</body>

</html>

⑤ 在LI里怎么让文字左对齐图片右对齐

如果你打算把后面的箭头图片直接放在HTML里的话; 用左右浮动;
例子:(把里面的span换成图片即可,兼容IE6,7,8,火狐)

<style type="text/css">
div,ul,li{ margin:0; padding:0;}
ul,li{ list-style:none}
.new{ border:solid 1px #990033; width:200px; line-height:24px;}
.new li{ border-bottom:solid 1px #CCC; overflow:hidden;}
.new li a{ float:left;}
.new li span{ float:right}
</style>
<div class="new">
<ul>
<li><a href="#">1 燃气热水</a><span>图片</span></li>
<li><a href="#">1 燃气热水</a><span>图片</span></li>
<li><a href="#">1 燃气热水</a><span>图片</span></li>
<li><a href="#">1 燃气热水</a><span>图片</span></li>
<li><a href="#">1 燃气热水</a><span>图片</span></li>
<li><a href="#">1 燃气热水</a><span>图片</span></li>
</ul>
</div>

其实像你上面的效果,用背景图片做最好,有简单,兼容性好等优点;

不过竟然没分.难怪没人答...呵呵.. 你好像还是我好友...巧....

⑥ css中如果项目列表图像高于本行文字怎么设置他们顶端对齐

实现这个效果
我给你2种方法!

第一

用dl
dt
dd

结构
<dl>

<dt>前面的小图标</dt>

<dd>文字</dd>

</dl>

在写样式控制

第二

给li里面的文字(a标签)定义背景
这个
应该很实用!

结构

<ul
class="style">

<li><a
href="#">
wenzi
</a></li>

</ul>

样式

.style
li
a
{background:url(前面小图片的路径)
no-repeat
3px
3px(定义小图片的位置,可以自己调试);padding-left:10px(要是小图片后面的文字离图片近了可以这样定义);

⑦ div + css,UL的LI 中,对LI设置了list-style-image,LI中的文字是放在a标签中的,如何让图片和文字对齐

把li设置个高度,然后把a设置设置同样的高度,最后让两个里面的文字上下居中
li,li a {height:25px;line-height:25px;}
也可能只要设置li的高度并上下居中就可以了,你试试

一般设置文字上下居中都是height和line-height相同就可以了

⑧ css布局中,<ul>中<li>列表,有图片,有文字,如何设置图片和文字平行对齐

把文字的line-height设置和图片的高度设置成一样就OK了。

⑨ 急!CSS中,怎么让ul li中的图片和文字横向水平居中

建一个div,ul里面包括四个li,在css样式里面设置li水平对齐就行了,text-align:center; 如果发现图片不能对齐的话,可以对它单独设置个padding值。

⑩ li中的list-style-images图片标记影响文字垂直居中,如何才让图片与文字保持垂直居中。。

这个呀好办,你在做时就用你要打印的纸张的大小,比如你要用A4的你就在PS中的画布大小设成A4的大小,在在PS中打好字,在按R 时你就会发现PS边上会出现标尺,你可以在那上面调你要的位置,这样做出来的字就会很精确的放在你要的地方了

阅读全文

与li中让图片文字等高相关的资料

热点内容
下雨女孩唯美图片大全 浏览:471
粘人的衣服搭配图片 浏览:563
小word中如何调整图片 浏览:89
幻灯片图片文字组合 浏览:571
图片男生动漫 浏览:262
3d图片可爱的 浏览:629
郁闷卡通图片可爱 浏览:612
如何去除word里插入的图片底色 浏览:838
文字的发展图片 浏览:273
数字卡通14图片大全可爱 浏览:6
男生盖头烫发图片 浏览:791
网红卷发发型图片 浏览:836
真实女孩可爱图片 浏览:493
卡通图片加文字的图片 浏览:628
嚣张动漫男生图片 浏览:244
适合印在衣服上的图片肖战 浏览:68
图片人物怎么做成手绘 浏览:300
雨图片大全图片高清 浏览:541
手工可爱笑脸的图片 浏览:786
女生三点式图片欣赏 浏览:184