css3中search是什么意思?一个input标签里面,class定义为 search

html-css08

css3中search是什么意思?一个input标签里面,class定义为 search,第1张

这个search是个自定义的类名,也就是说如果有多个元素设定了这个类名,那么只要在css中给这个类设定样式,那么这些元素都会是同样的样式。

补充说一下:类名是可以任意设置的,只要符合html的命名规则即可。也就是说,“search”在这里只是个名字,本身不具有意义,就好像问“姚明是什么意思”一样。

另外,name在这里也是个类名,当一个class同时设置多个类名时,它会自动把这些类的css样式进行合并(如果样式之间存在冲突,则后面的会覆盖前面的)。

再再补充一下:一个元素具有多个类,你可以在生活中随处找到例子,比如说一个人按性别分是男人,按年龄分是青年,按文化程度分是大学生,那么他就同时具有男人、青年、大学生的属性,即 class="男人 青年 大学生"

这些都是学习前端基础最基本的东西,比如html里:

<form class="search"><input type="text" /></form>

在css样式表中修改form的样式,你就可以用.search获取到他,

.search input就是包含在这个标签内部的子标签

@.....这个咋个说呢,虽然很简单……

就拿verycd那搜索框做例吧……,自己写了个……

HTML:

<div id="top-search">

<input type="text" id="top-search-input" name="kw" value="" />

<input type="submit" id="top-search-lib" class="top-search-button" value="资源" />

<input type="button" id="top-search-site" class="top-search-button" value="高级搜索" />

<input type="button" id="top-search-advance" class="top-search-button" value="发布资源"

/></div>

CSS:

#top-search/*背景*/

#top-search input/*整体input设置*/

#top-search #top-search-input/*调整输入框*/

#top-search-lib,#top-search-site,#top-search-advance/*其它三个按钮,隐藏字体*/

图片就用下面这张: