div+css一些技巧 li前面插入小图标居中+marquee

1.公告滚动。想做一个滚动的公告前面加一个小图标,而且是居中的,本可以在li前面设置背景,然后padding left 但是由于 加了padding后,公告的下一列也会有padding,样式不好看,我想还是在li里面加个图片吧。但是图片又不居中。因为li的 line-height设置了。图片这个css是没有影响的。经过查找。下面方法可以实现:

img{ border:solid 1px #dddddd; padding:2px;vertical-align: middle;}
    <marquee scrollamount='2' scrolldelay='2'  direction='up' οnmοuseοver="stop()" οnmοuseοut="start()" bgcolor="#ececec"  height="192px">

应用:

<asp:Repeater ID="rpt_gggs" runat="server">
<HeaderTemplate> <ul class="ul_marquee"></HeaderTemplate>
<ItemTemplate><li><a href="../Content.aspx?id=<%# Eval("id")%>"><img src="/village/Content/icon/notice.jpg" /><%# Eval("title")%></a></li></ItemTemplate>
<FooterTemplate> </ul></FooterTemplate>
</asp:Repeater></marquee>
</div>

好了 效果就是:

image

 

==================marquee在ul中使用============
css 代码:
.ul_marquee{ margin-left:5px; display:table;}
.ul_marquee li
{
    line-height: 150%;
    width: 100%;
    text-align: left;
    font-size: 12px;
}

切记:不能这样 不能出现float
.ul_marquee li
{
    float:left
    line-height: 150%;
    width: 100%;
    text-align: left;
    font-size: 12px;
}

---------应用----------------------------------------

<div id="main_right">
<div class="notice">
<h3><a href="#" target="_blank">公告公示</a></h3>
<div style=" width:228px; height:300px;">
     <marquee scrollamount='2' scrolldelay='2'  direction='up' οnmοuseοver="stop()" οnmοuseοut="start()" bgcolor="#ececec"  height="192px">
<asp:Repeater ID="rpt_gggs" runat="server">
<HeaderTemplate> <ul class="ul_marquee"></HeaderTemplate>
<ItemTemplate><li><a href="../Content.aspx?id=<%# Eval("id")%>"><img src="/village/Content/icon/notice.jpg" /><%# Eval("title")%></a></li></ItemTemplate>
<FooterTemplate> </ul></FooterTemplate>
</asp:Repeater></marquee>
</div>

转载于:https://www.cnblogs.com/zxlin25/archive/2009/10/15/1584131.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值