经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置：技术经验 » HTML/CSS » XHTML » 查看文章
HTML通过表单实现酒店筛选功能_HTML/Xhtml
来源：jb51　　时间：2021/5/24 10:34:36　　对本文有异议

HTML

  1. <!doctype html>
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html:charset=utf-8"/>
  5. <title>通过表单实现酒店筛选</title>
  6. <link rel="stylesheet" href="1-1.css">
  7. </head>
  8. <body>
  9. <div class="mr-content">
  10. <div class="mr-container">
  11.     <form>
  12.     	<div class="mr-line">
  13.     		<span>目的地</span><input type="text">
  14.     		<span>入住时间</span><input type="text">
  15.     		<span>退房时间</span><input type="text">
  16.     	</div>
  17.     	<div class="mr-line">
  18.     		<span>酒店位置</span>
  19.     		<select>
  20. 				<option selected>景点1</option>
  21. 				<option selected>景点2</option>
  22.     			<option selected>景点3</option>
  23. 				<option selected>景点</option>
  24.     		</select>
  25.     		<select>
  26. 				<option selected>交通枢纽1</option>
  27. 				<option selected>交通枢纽2</option>
  28. 				<option selected>交通枢纽3</option>
  29.     			<option selected>交通枢纽</option>
  30.     		</select>
  31.     		<select>
  32. 				<option selected>地铁周边1</option>
  33. 				<option selected>地铁周边2</option>
  34. 				<option selected>地铁周边3</option>
  35.     			<option selected>地铁周边</option>
  36.     		</select>
  37.     		<select>
  38.     			<option selected>行政区1</option>
  39. 				<option selected>行政区2</option>
  40. 				<option selected>行政区3</option>
  41. 				<option selected>行政区</option>
  42.     		</select>
  43.     	</div>
  44.     	<div class="mr-line">
  45.     		<span>酒店价格</span>
  46.     		<span>不限</span>
  47.     		<input type="radio">
  48.     		<span>100元以下</span>
  49.     		<input type="radio">
  50.     		<span>100-300元</span>
  51.     		<input type="radio">
  52.     		<span>300-600元</span>
  53.     		<input type="radio">
  54.     		<span>600-1500元</span>
  55.     	</div>
  56.     	<div class="mr-line">
  57.     		<span>酒店星级</span>
  58.     		<span>不限</span>
  59.     		<input type="checkbox">
  60.     		<span>五星/豪华</span>
  61.     		<input type="checkbox">
  62.     		<span>四星/高档</span>
  63.     		<input type="checkbox">
  64.     		<span>三星/舒适</span>
  65.     	</div>
  66.     	<div class="me-line">
  67.     		<span>主题风格</span>
  68.     		<span>不限</span>
  69.     		<input type="checkbox">
  70.     		<span>客栈</span>
  71.     		<input type="checkbox">
  72.     		<span>精品酒店</span>
  73.     		<input type="checkbox">
  74.     		<span>情侣酒店</span>
  75.     		<input type="checkbox">
  76.     		<span>园林庭院</span>
  77.     	</div>
  78.     </form>
  79. </div>
  80. 	</body>
  81. </html>

HTML

以上就是HTML通过表单实现酒店筛选功能的详细内容，更多关于html酒店筛选的资料请关注w3xue其它相关文章！

 友情链接：直通硅谷 　点职佳 　北美留学生论坛

XHTML热门文章

  • html中显示特殊符号(附带特殊字符对应表)_HTML/Xhtml
  • Html读取本地文件夹下图片并显示的示例代码_HTML/Xhtml
  • HTML+VUE分页实现炫酷物联网大屏功能_HTML/Xhtml
  • html中使用vue-router的示例代码_HTML/Xhtml
  • 使用html2canvas对有百度地图的Dom元素处理成图片的解决_HTML/Xhtml
  • html输入两个数实现加减乘除功能_HTML/Xhtml
  • HTML中table表格拆分合并(colspan、rowspan)_HTML/Xhtml
  • HTML中的if判断用法_HTML/Xhtml
  • HTML表格跨行跨列操作(rowspan、colspan)_HTML/Xhtml
  • html转pdf截图保存功能的实现_HTML/Xhtml

    • XHTML推荐文章

  • HTML基础详解(上)_HTML/Xhtml
  • HTML基础详解（下）_HTML/Xhtml
  • html中显示特殊符号(附带特殊字符对应表)_HTML/Xhtml
  • HTML中的表单Form实现居中效果_HTML/Xhtml
  • HTML+VUE分页实现炫酷物联网大屏功能_HTML/Xhtml

    • 本站QQ群：前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

    W3xue 的所有内容仅供测试，对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
    关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接（目前9元/月）请联系QQ：27243702 沸活量
    皖ICP备17017327号-2　皖公网安备34020702000426号