HTML+CSS第八课2:利用DIV+CSS制作一个百度搜索框和按钮的无缝对接

知识点:盒子模型、CSS样式设置、form表单。

网页效果要求:HTML+CSS第八课2:利用DIV+CSS制作一个百度搜索框和按钮的无缝对接_第1张图片

制作思路:

1、将百度logo+搜索框+按钮,作为整体放在一个div盒子里,通过设置div来控制他们在网页中的位置

2、涉及到表单,所以写一个form标签,将他们放在form标签中

3、搜索功能的实现,参考资料:利用表单标签制作一个百度搜索框

4、搜索框和按钮的样式,设置css属性,控制宽高、边框、背景颜色、文本颜色等

5、搜索框和按钮要无缝对接,两个input标签之间不要出现空格或换行

实现代码:





无标题文档




    

 

代码结果演示HTML+CSS第八课2:利用DIV+CSS制作一个百度搜索框和按钮的无缝对接_第2张图片

 

 

 

 

=============================结束分割线==============================

 

 

你可能感兴趣的:(HTML+CSS网页设计)