下拉框宽度问题,真心方法

时间：2022-11-21 19:39:01
下拉框宽度问题,真心方法
就如图的效果,想把下拉框宽度固定,但是要求显示所有内容,求思路

14 个解决方案

#1

给它加上css样式就可以了

<asp:DropDownList ID="DDL_CateT" runat="server" CssClass="Inputs"></asp:DropDownList>

Inputs样式
.Inputs{ width:100px; height:20px}

#2

<asp:DropDownList ID="DDL_CateT" runat="server" CssClass="Inputs" style="width:100px;"></asp:DropDownList>

#3

回复:qiujialongjjj
我想知道的是固定了下拉框,但是内容能全部显示出来,你这个代码,貌似不起作用啊

#4

很长很长的名字不知道能不能显示出来

内容是以上内容，我测试了一条，完全没有超出。

下拉框宽度问题,真心方法

如果你的不行的话 在css里加一个红色部分试试。
.Inputs{width:100px;  overflow:hidden}

#5

也许你的CSS 没有加正确，你怎么加的？

#6

比如a标签，<a href="" title="毛片正在缓冲"></a>

当鼠标放在这上面的时候就算a【drp】的宽度不够，可以通过title来提示！是这个效果吗？？？？

#7

引用 5 楼  的回复:
也许你的CSS 没有加正确，你怎么加的？

我没有加啊,就是不知道怎么加东西能变成这个效果,如果不加宽度吧,下拉框长度太长,与页面无法匹配,加上吧,又不能显示全部内容,就上面那个图的效果是最好的,有没有研究过,求解答

#8

引用 4 楼  的回复:
很长很长的名字不知道能不能显示出来

内容是以上内容，我测试了一条，完全没有超出。



如果你的不行的话 在css里加一个红色部分试试。
.Inputs{width:100px; overflow:hidden}


不是我就是不想要这个效果,我就是想要我发的那张图的效果,固定下拉框长度,又想让内容都显示出来

#9

不是我就是不想要这个效果,我就是想要我发的那张图的效果,固定下拉框长度,又想让内容都显示出来

#10

原来是这样。那就用DIV模拟列表好了。 单纯的dropdownlist应该是不行的。

#11

改了一下 居然可以的。
下拉框宽度问题,真心方法

#12

IE9 之前的版本指定了 select 的 width 内容也会随select width走，长的内容显示不下。

IE9 以上才修复了这个bug

#13

要不固定宽度，然后多余的隐藏，改成放上去，显示全部

#14

谢谢大家的耐心解答,其实是浏览器兼容问题,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>dropdown test</title>  <style type="text/css"> select.center_pull {     background:#eeeeee none repeat scroll 0 0;     border:1px solid #7E7E7E;     color:#333333;     font-size:12px;     margin-bottom:4px;     margin-right:4px;     margin-top:4px;     width:145px; } </style> </head>  <body> <p>Select width test</p> <form id="form1" name="form1" method="post" action=""> <select id="select_1" class="center_pull backend_dropbox" name="select_1"> <option value="-1" selected="selected">Browse options</option> <option value="-1">------------------------------------</option> <option value="224">Option 1</option> <option value="234">Longer title for option 2</option> <option value="242">Very long and extensivelydfsdfdf descriptive title for option 3</option> </select> </form> </body> </html> 

这是完整效果,IE,360都不显示的,感谢各位了,马上给分 啊

#1

给它加上css样式就可以了

<asp:DropDownList ID="DDL_CateT" runat="server" CssClass="Inputs"></asp:DropDownList>

Inputs样式
.Inputs{ width:100px; height:20px}

#2

<asp:DropDownList ID="DDL_CateT" runat="server" CssClass="Inputs" style="width:100px;"></asp:DropDownList>

#3

回复:qiujialongjjj
我想知道的是固定了下拉框,但是内容能全部显示出来,你这个代码,貌似不起作用啊

#4

很长很长的名字不知道能不能显示出来

内容是以上内容，我测试了一条，完全没有超出。

下拉框宽度问题,真心方法

如果你的不行的话 在css里加一个红色部分试试。
.Inputs{width:100px;  overflow:hidden}

#5

也许你的CSS 没有加正确，你怎么加的？

#6

比如a标签，<a href="" title="毛片正在缓冲"></a>

当鼠标放在这上面的时候就算a【drp】的宽度不够，可以通过title来提示！是这个效果吗？？？？

#7

引用 5 楼  的回复:
也许你的CSS 没有加正确，你怎么加的？

我没有加啊,就是不知道怎么加东西能变成这个效果,如果不加宽度吧,下拉框长度太长,与页面无法匹配,加上吧,又不能显示全部内容,就上面那个图的效果是最好的,有没有研究过,求解答

#8

引用 4 楼  的回复:
很长很长的名字不知道能不能显示出来

内容是以上内容，我测试了一条，完全没有超出。



如果你的不行的话 在css里加一个红色部分试试。
.Inputs{width:100px; overflow:hidden}


不是我就是不想要这个效果,我就是想要我发的那张图的效果,固定下拉框长度,又想让内容都显示出来

#9

不是我就是不想要这个效果,我就是想要我发的那张图的效果,固定下拉框长度,又想让内容都显示出来

#10

原来是这样。那就用DIV模拟列表好了。 单纯的dropdownlist应该是不行的。

#11

改了一下 居然可以的。
下拉框宽度问题,真心方法

#12

IE9 之前的版本指定了 select 的 width 内容也会随select width走，长的内容显示不下。

IE9 以上才修复了这个bug

#13

要不固定宽度，然后多余的隐藏，改成放上去，显示全部

#14

谢谢大家的耐心解答,其实是浏览器兼容问题,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>dropdown test</title>  <style type="text/css"> select.center_pull {     background:#eeeeee none repeat scroll 0 0;     border:1px solid #7E7E7E;     color:#333333;     font-size:12px;     margin-bottom:4px;     margin-right:4px;     margin-top:4px;     width:145px; } </style> </head>  <body> <p>Select width test</p> <form id="form1" name="form1" method="post" action=""> <select id="select_1" class="center_pull backend_dropbox" name="select_1"> <option value="-1" selected="selected">Browse options</option> <option value="-1">------------------------------------</option> <option value="224">Option 1</option> <option value="234">Longer title for option 2</option> <option value="242">Very long and extensivelydfsdfdf descriptive title for option 3</option> </select> </form> </body> </html> 

这是完整效果,IE,360都不显示的,感谢各位了,马上给分 啊
标签：

相关文章