首页前端开发HTMLDreamweaver怎么制作百度搜索栏静态页面?

Dreamweaver怎么制作百度搜索栏静态页面?

时间2024-01-28 13:30:03发布访客分类HTML浏览795
导读:收集整理的这篇文章主要介绍了Dreamweaver怎么制作百度搜索栏静态页面?,觉得挺不错的,现在分享给大家,也给大家做个参考。 Dreamweaver中想要使用代码制作百度搜索栏静态页面,该怎么制作呢?下面我们就来看看详细的教程...
收集整理的这篇文章主要介绍了Dreamweaver怎么制作百度搜索栏静态页面?,觉得挺不错的,现在分享给大家,也给大家做个参考。

Dreamweaver中想要使用代码制作百度搜索栏静态页面,该怎么制作呢?下面我们就来看看详细的教程。

Adobe Dreamweaver CC 2017 v17.0 中文版(附安装教程) 64位

  • 类型:网页设计
  • 大小:758MB
  • 语言:简体中文
  • 时间:2016-11-05
查看详情

1、如果将搜索框分为块状,可以将他分为4段,如图所示

2、打开DW软件新建一个htML文件并保存。

在body中输入内容,

 

body>
    div>
    img src="img/LOGo_bd.png" alt="">
    /div>
    input tyPE="text">
    h1>
    搜索经验/h1>
    h2>
    a href="">
    帮助/a>
    /h2>
    /body>
    

如下图

3、然后建立style样式,清除标签自带的一些属性,

 

img{
    display:block;
}
input{
    margin:0;
    padding:0;
}
h1,h2{
    margin:0;
    font-weight:normal;
}
    

4、对logo图片设置具体宽高,并浮动,如图所示

5、对input标签添加属性设置,如图所示

6、最后添加h1和h2的属性值,如图所示,这样一个简单的搜索框就出来了。

以上就是dw制作百度搜索栏效果的教程,希望大家喜欢,请继续关注。

相关推荐:

Dreamweaver怎么上传站点到服务器?

Dreamweaver网页中怎么添加电子邮箱链接?

Dreamweaver cc2018新版页面怎么切换回旧版本布局?

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

Dreamweaver百度

若转载请注明出处: Dreamweaver怎么制作百度搜索栏静态页面?
本文地址: https://pptw.com/jishu/589702.html
Dreamweaver CS5新增启用/禁用样式表功能 DreamWeaver插件 Javascript文件美化、自动缩进

游客 回复需填写必要信息