把div的超链接文字各分成一行

Question

[code="js"]

$(document).ready(function(){ //鼠标进入一级菜单，显示div $("#sy").mouseover(function(){ $("div").show(); }); //div持续显示 $(".head_cp").mouseover(function(){ $(this).show(); }); //当鼠标离开div，该div隐藏 $(".head_cp").mouseout(function(){ $(this).hide(); }); });

[/code]
[code="html"]

.head_cp{ background-color:#FFFFFF; border:1px solid #c1c1c1; text-align:left; width:190px; float:left; font-size:14px; position:relative; } .head_cp a{ padding:3px 0px 3px 5px; line-height:150%; } a:link,a:visited{ text-decoration:none; /*超链接无下划线*/ color:#336666; } a:hover{ text-decoration:underline; /*鼠标放上去有下划线*/ color:#EAC100; }

我的应用

这行文字最多了测试使用行

这行文字最少

第三行的字数还可以

这一行文字有多了一个

字数最少

[/code]

我想: 1.换行不用
2.当鼠标移到一个div的超链接上，出现背景色充满整个一行

Answer 1

[code="java"]

$(document).ready(function(){ //鼠标进入一级菜单，显示div $("#sy").mouseover(function(){ $("div").show(); }); //div持续显示 $(".head_cp").mouseover(function(){ $(this).show(); }); //当鼠标离开div，该div隐藏 $(".head_cp").mouseout(function(){ $(this).hide(); }); $(".head_cp").children("div").hover( function(){ $(this).addClass("div_bg"); }, function(){ $(this).removeClass("div_bg"); } ); }); .head_cp{ background-color:#FFFFFF; border:1px solid #c1c1c1; text-align:left; width:190px; float:left; font-size:14px; position:relative; } a:link,a:visited{ text-decoration:none; /*超链接无下划线*/ color:#336666; } a:hover{ text-decoration:underline; /*鼠标放上去有下划线*/ color:#EAC100; } .head_cp div { position: relative; width: 100%; height: 35px; line-height: 35px; margin: 3px 0px; padding: 0px 3px; } .div_bg { background-color: gray; }

我的应用

这行文字最多了测试使用行

这行文字最少

第三行的字数还可以

这一行文字有多了一个

字数最少

[/code]