前端：HTML百度页面制作（快速简单）
落晗羽2.0 2024-07-03 08:03:01 阅读 77
如何快速、简单制作html百度页面
目录
准备条件
代码讲解
效果预览
本文开发出来的网页只是静态版本的，可以在搜索框里查询你想了解的东西，搜索出来的数据均是百度处理，并且只制作html，不涉及到css等，学会之后就可以制作任何一个搜索页面。
准备条件
为以后的学习，今天来简单的制作一个百度网页，如果是纯新手，需要准备HBuilder代码编辑器，如果有需要的话可以留言或私信哦，如果电脑上有编辑器，那么需要下载一个百度logo就可以啦！
代码讲解
首先打开编辑器，文件—新建—Web项目，选择想要储存的位置以及名字， 找到刚才新建的Web项目打开有css（美化网页），img（存放图片），js（调动网页），右键点击js—新建—HTML文件，更改一下名字就可以了。
先看一下代码，我们只需要完成body中间部分
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div style="text-align: center;">
<img src="img/PCtm_logo.png" style="height: 100px;width: 200px"/>
<form action="https://www.baidu.com/s">
<input name="wd" />
<input type="submit" value="百度一下" />
</form>
</div>
</body>
</html>
div可以划分html结构，也可用来做组合其他html元素的容器；
text-alogn: center：水平对齐，放在正中间的位置上；
img src：照片储存的地址；
style：样式，根据需求设置大小长或宽；
form action：输入需要制作的网址
"wd"：是百度网页搜索最常见的参数，制作每一个搜索引擎都不一样；
然后边框右边设置提交（submit），在用value命名一下；
<div></div> <from></from>等标签必须组合使用。
敲完代码之后一定要ctrl-s保存！ctrl-s保存！ctrl-s保存！（重要的事情说三遍）
效果预览
可以在搜索框里随意搜索之后跳转百度查找出来的结果。
总结
百度首页制作并不难，制作其他搜索网页与百度类似，重点是理解和熟练，学习没有捷径，多练习多积累才是正确的学习方法。
学无止境，期待变得更好的自己！
上一篇： 无码高清？Stable DIffusion教程 | 如何利用 Stable Diffusion webui 将图片变得更清晰？全方位对比4种放大方法！
下一篇： 前端如何控制权限_前端实战——技术篇(三、开发相关): 权限管理_手把手教网络安全技巧
本文标签
声明
本文内容仅代表作者观点，或转载于其他网站，本站不以此文作为商业用途
如有涉及侵权，请联系本站进行删除
转载本站原创文章，请注明来源及作者。