手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >css中ul li的背景小图标属性设置的两种情况
css中ul li的背景小图标属性设置的两种情况
摘要:这里我们分两种情况列出:①当标题前的图标是很长的一绺而不是单独的一个点或者类似图标时,在定义背景图background要定义在里。因为很长,...

这里我们分两种情况列出:

①当标题前的图标是很长的一绺而不是单独的一个点或者类似图标时,在定义背景图background要定义在<ul>里。因为很长,所以放在<li>的外边<ul>里

②当标题前的图标时单独的一个点儿或者方块或者其他类似图标时,定义背景图background要放在<li>里

A

<style>

.test1 { width:100px; height:265px; background:url(http://www.86image.cn/statics/images/show/li.jpg) no-repeat scroll 0 8px; }

.test1 li {padding-left:30px; line-height:27px; list-style-type:none;}

</style>

<ul>

<li>one</li>

<li>two</li>

<li>three</li>

<li>four</li>

<li>five</li>

<li>six</li>

<li>seven</li>

<li>eight</li>

<li>nine</li>

<li>ten</li>

</ul>

如图示:

css中ul li的背景小图标属性设置的两种情况1

B

<style>

.test1 li { padding-left:15px; background:url("http:www.86image.cn/statics/images/tpl1/images/icon_fk.gif" ) no-repeat scroll 1px 8px; line-height:22px; list-style-type:none;}

</style>

<ul>

<li>1</li>

<li>2</li>

<li>3</li>

</ul>

如图示:

css中ul li的背景小图标属性设置的两种情况2

【css中ul li的背景小图标属性设置的两种情况】相关文章:

css的字体属性详解

CSS怎么将背景图左移/上移/右移10px

css在不同浏览器中的唯一标识以height属性为例

使用CSS布局定位属性轻松实现优美站点布局

熟练掌握CSS样式 轻松设计N种网站模板风格

css中换行的几种常用方式整理

css 的border属性改变hr颜色小示例

css如何设置全屏背景图片

css中ul li的背景小图标属性设置的两种情况

在div底部显示背景图片实现代码

精品推荐
分类导航