简述如何使用CSS设置表单元素及创建个性化表单

html-css019

简述如何使用CSS设置表单元素及创建个性化表单,第1张

以控制的比较多

直接在select上加class就可以设置CSS了

例:

<style type="text/css">

.selectYs

</style>

<form action="#">

<select class="selectYs">

<option value="">1111

<option value="">1111

<option value="">1111

<option value="">1111

</select>

</form>

有的属性浏览器不兼容,但大部分还是可以的你自己试试就知道了

CSS只是定义样式 的,表单在CSS里怎么写问的不对。我觉得你可能问的是如果定义表单里的样式吧?单说一个真实姓名:<input type="text" name="yhm" id="yhm" />

这样写的话是不是觉得不好看?你再看看这个:

<input type="text" name="yhm" id="yhm" style="background-color:#009933border:10px #666666 solid" />

是不是变样了?再看看这样

<style type="text/css">

<!--

#yhm {background-color:#009933border:10px #666666 solid

}

-->

</style>

<input type="text" name="yhm" id="yhm" />

和上面的一样吧? #yhm {}指的就是ID="YHM"

再试试这样

<style type="text/css">

<!--

input {background-color:#009933border:10px #666666 solid

}

-->

</style>

<input type="text" name="yhm" id="yhm" />

和上面的一样吧? input指的是INPUT标签,如果用了这样的定义,你里面所有的INPUT标签都会变成这样的。

常用的还有一个

<style type="text/css">

<!--

.YHM {background-color:#009933border:10px #666666 solid

}

-->

</style>

<input type="text" name="yhm" id="yhm" class="YHM" />

和上面的还是一样的。

但这个的作用范围就是你指定了class="YHM"的标签