搜索制作

 

1分析盒子

外边是一个盒子search，里面是两个Input

2.css布局

外边盒子search

高度：30

宽度：195

位置：右浮动

边框：1 solid #ECECEC

Input

高度：30

宽度：165 30

位置：把元素的顶端与行中最高元素的顶端对齐

边框：使用search边框

使用到的知识：

3.浮动

可以避免浮动的重复书写，直接定义左右浮动的类

.fl{

float:left;

}

.fr{

float:right;

}

4.类选择器

类选择器

.自定义类名(属性:值;)

特点:谁调用，谁生效.

一个标签可以多个类选择器。

多个标签可以调用同一个类选择器。

属性选择器；

.search input[type="text"]{

width: 165px;

height: 30px;

vertical-align: top;

}