如何用CSS设置下拉列表sel

  

  我们在进行CSS网页布局的时候,常常会遇到下拉列表select,我们可以应用CSS对表单的元素进行控制,可是下拉列表select的样式该如何设置呢?

  我们来看看下面的xhtml代码,这是一个典型的下拉列表select:

 

    <select>

    <option>我爱CSS</option>

    <option>Div+CSS教程</option>

    <option>CSS布局实例</option>

    <option>CSS2.0教程</option>

    <option>CSS在线手册</option>

    <option>Web标准</option>

    <option>XHTML教程</option>

    </select>

  我们再来看看控制它的CSS代码:

div {

        border:1px solid #C0C0C0;

        width:183px;

        height:18px;

        clip:rect(0px,18px,22px,0px);

        overflow:hidden;

}

select {

        position:relative;

        left:-2px;

        top:-2px;

        font-size:12px;

        width:185px;

        line-height:18px;border:0px;

        color:#909993;

}

  我们再来看看运行的效果吧:

Source Code to Run [www.fun52.com]

www.fun52.com

我爱CSS

Div+CSS教程

CSS布局实例

CSS2.0教程

CSS在线手册

Web标准

XHTML教程

   [ 可先修改部分代码 再运行查看效果 ]

第 1 2 页

如何用CSS设置下拉列表sel

相关文章:

你感兴趣的文章:

标签云: