HTML通过表单实现酒店筛选功能


Posted in HTML / CSS onMay 18, 2021

HTML通过表单实现酒店筛选功能

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html:charset=utf-8"/>
<title>通过表单实现酒店筛选</title>
<link rel="stylesheet" href="1-1.css">
</head>
<body>
<div class="mr-content">
<div class="mr-container">
    <form>
    	<div class="mr-line">
    		<span>目的地</span><input type="text">
    		<span>入住时间</span><input type="text">
    		<span>退房时间</span><input type="text">
    	</div>
    	<div class="mr-line">
    		<span>酒店位置</span>
    		<select>
				<option selected>景点1</option>
				<option selected>景点2</option>
    			<option selected>景点3</option>
				<option selected>景点</option>
    		</select>
    		<select>
				<option selected>交通枢纽1</option>
				<option selected>交通枢纽2</option>
				<option selected>交通枢纽3</option>
    			<option selected>交通枢纽</option>
    		</select>
    		<select>
				<option selected>地铁周边1</option>
				<option selected>地铁周边2</option>
				<option selected>地铁周边3</option>
    			<option selected>地铁周边</option>
    		</select>
    		<select>
    			<option selected>行政区1</option>
				<option selected>行政区2</option>
				<option selected>行政区3</option>
				<option selected>行政区</option>
    		</select>
    	</div>
    	<div class="mr-line">
    		<span>酒店价格</span>
    		<span>不限</span>
    		<input type="radio">
    		<span>100元以下</span>
    		<input type="radio">
    		<span>100-300元</span>
    		<input type="radio">
    		<span>300-600元</span>
    		<input type="radio">
    		<span>600-1500元</span>
    	</div>
    	<div class="mr-line">
    		<span>酒店星级</span>
    		<span>不限</span>
    		<input type="checkbox">
    		<span>五星/豪华</span>
    		<input type="checkbox">
    		<span>四星/高档</span>
    		<input type="checkbox">
    		<span>三星/舒适</span>
    	</div>
    	<div class="me-line">
    		<span>主题风格</span>
    		<span>不限</span>
    		<input type="checkbox">
    		<span>客栈</span>
    		<input type="checkbox">
    		<span>精品酒店</span>
    		<input type="checkbox">
    		<span>情侣酒店</span>
    		<input type="checkbox">
    		<span>园林庭院</span>
    	</div>
    </form>
</div>
	</body>
</html>

HTML通过表单实现酒店筛选功能

以上就是HTML通过表单实现酒店筛选功能的详细内容,更多关于html酒店筛选的资料请关注三水点靠木其它相关文章!

 
HTML / CSS 相关文章推荐
CSS3系列之3D制作方法案例
Aug 14 HTML / CSS
CSS3实现类似翻书效果的过渡动画的示例代码
Sep 06 HTML / CSS
css3中新增的样式使用示例附效果图
Aug 19 HTML / CSS
纯CSS3单页切换导航菜单界面设计的简单实现
Aug 16 HTML / CSS
css3针对移动端卡顿问题的解决(动画性能优化)
Feb 14 HTML / CSS
html5 div布局与table布局详解
Nov 16 HTML / CSS
HTML5 Canvas 旋转风车绘制
Aug 18 HTML / CSS
HTML5 拖放(Drag 和 Drop)详解与实例代码
Sep 14 HTML / CSS
基于 HTML5 WebGL 实现的医疗物流系统
Oct 08 HTML / CSS
html5简介及新增功能介绍
May 18 HTML / CSS
CSS3实现的侧滑菜单
Apr 27 HTML / CSS
使用CSS自定义属性实现骨架屏效果
Jun 21 HTML / CSS
面试必问:圣杯布局和双飞翼布局的区别
May 13 #HTML / CSS
HTML5简单实现添加背景音乐的几种方法
May 12 #HTML / CSS
CSS 实现多彩、智能的阴影效果
解析CSS 提取图片主题色功能(小技巧)
为什么你写的height:100%不起作用
HTML+css盒子模型案例(圆,半圆等)“border-radius” 简单易上手
May 10 #HTML / CSS
background-position百分比原理详解
You might like
介绍一些PHP判断变量的函数
2012/04/24 PHP
HTML代码中标签的全部属性 中文注释说明
2009/03/26 Javascript
Mootools 1.2教程 定时器和哈希简介
2009/09/15 Javascript
主页面中的两个iframe实现鼠标拖动改变其大小
2013/04/16 Javascript
js拖拽一些常见的思路方法整理
2014/03/19 Javascript
JS实现点击颜色块切换指定区域背景颜色的方法
2015/02/25 Javascript
jQuery实现统计输入文字个数的方法
2015/03/11 Javascript
JavaScript模块规范之AMD规范和CMD规范
2015/10/27 Javascript
基于javascript实现窗口抖动效果
2016/01/03 Javascript
javascript实现倒计时跳转页面
2016/01/17 Javascript
漂亮! js实现颜色渐变效果
2016/08/12 Javascript
原生js封装的一些jquery方法(详解)
2016/09/20 Javascript
nodejs socket实现的服务端和客户端功能示例
2017/06/02 NodeJs
vue.js 底部导航栏 一级路由显示 子路由不显示的解决方法
2018/03/09 Javascript
vue源码学习之Object.defineProperty 对数组监听
2018/05/30 Javascript
react+redux仿微信聊天界面
2019/06/21 Javascript
vue draggable resizable gorkys与v-chart使用与总结
2019/09/05 Javascript
node.js中npm包管理工具用法分析
2020/02/14 Javascript
JavaScript JSON使用原理及注意事项
2020/07/30 Javascript
jquery实现简易验证插件封装
2020/09/13 jQuery
React实现评论的添加和删除
2020/10/20 Javascript
python字典快速保存于读取的方法
2018/03/23 Python
Python实现找出数组中第2大数字的方法示例
2018/03/26 Python
Python实现简易过滤删除数字的方法小结
2019/01/09 Python
python实现二维数组的对角线遍历
2019/03/02 Python
django框架使用方法详解
2019/07/18 Python
Python打开文件、文件读写操作、with方式、文件常用函数实例分析
2020/01/07 Python
浅析CSS3中鲜为人知的属性:-webkit-tap-highlight-color
2017/01/12 HTML / CSS
正隆泰信息技术有限公司上机题
2012/06/14 面试题
校班主任推荐信范文
2013/12/03 职场文书
中学生操行评语
2014/04/24 职场文书
2015年毕业实习工作总结
2014/12/12 职场文书
小时代观后感
2015/06/10 职场文书
导游词之山西-五老峰
2019/10/07 职场文书
Kubernetes关键组件与结构组成介绍
2022/03/31 Servers
一文搞懂PHP中的抽象类和接口
2022/05/25 PHP