学习基地

?找回密码
?加入基地
搜索
热搜: discuz 网站
打印 上一主题 下一主题

[从HTML开始制作DZ模板] 第十六课 网站搜索制作

崖柏造假过程
跳转到指定楼层
崖柏造假过程
发表于 2019-4-14 13:58:44 | 只看该作者 回帖奖励 |倒序崖柏造假过程 |阅读模式
学习基地在这节课为大家提供的教程是??网站搜索制作




搜索框在 header 模板文件中,是调用的另外一个模板文件,这个模板文件存放在公共样式里。因为我们的搜索框在每一个页面都会被调用,他的模板名称 pubsearchform.htm 。

在header 文件中引入方法 “"

把??pubsearchform.htm 复制到我们新建模板里面,编辑器打开。
把td 里面的样式去掉:
删掉。


把搜索按钮 {lang search} 也删掉。

接着开始修改搜索框的样式
在新建的 extend_common 公共样式中添加 如图这段代码

#scbar{background: none;border: none;height: 48px;margin-top: 40px;}
#scbar_txt{width: 200px;height: 46px;line-height:46px;border: 1px solid#E9E9E9;font-size: 14px;text-indent: 10px;border-right:none;}
#scbar_type{background:#fff;height: 48px;line-height:46px;border:1px #e9e9e9;border-left:none;padding:0 10px;font-size:14px;}
#scbar_btn{width: 48px;height: 48px;background:#FF0099 url({STYLEIMGDIR}/search.png)center no-repeat; }
#scbar_bth:hover{background:#77084b url({STYLEIMGDIR}/search.png)center no-repeat;}


调整搜索框位置
把搜索框的代码 提到搜索 div 里面 ,搜索的 div 加属性调到右边,
? ? ? ?

? ? ? ? ? ? ? ?
? ? ? ? ? ? ? ?


把这段代码 放到 logo 后面





本节课的视频教程地址链接:https://pan.baidu.com/s/1N1ftGSkhHmVfFRdlGKTzIQ 密码:
游客,如果您要查看本帖隐藏内容请回复





学习基地本节课为大家介绍了即将开始的第一章介绍,若有不懂可加学习基地QQ交流群:735979492 一起研究探讨


本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?加入基地

x
您需要登录后才可以回帖 登录 | 加入基地

本版积分规则

关闭

站长推荐上一条 /1 下一条

QQ|手机版|学习基地 ( 赣ICP备17008572号 )

GMT+8, 2019-8-20 16:42 , Processed in 1.114556 second(s), 20 queries .

Powered by Discuz! X3.4 Licensed

? 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表