html5+css3 h5页面生成的思路
<!DOCTYPE html>
<html style="height: 100%;">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<title>预约体检</title>
<link rel="stylesheet" type="text/css" href="<?php echo CSS_DOMAIN; ?>/1.0/model.css?v=<?php echo VERSION_NUMBER ?>" />
<style type="text/css">
html,body{
background-color: #F8F7F7;
}
.examination_top{
width: 100%;
/* height: 8rem;*/
background-color:#FFFFFF;
}
.examination_top_text{
width: 100%;
height: 4rem;
text-align: center;
line-height: 5rem;
font-weight: 600;
color: #F85D35;
}
.examination_top_date{
width: 90%;
height: 5rem;
margin-left: 5%;
border-top: 2px #A8A7A7 dashed;
text-align: center;
line-height: 3rem;
}
.examination_top_date>.examination_top_date_time{
color: #6C6B6C;
}
.examination_top_date>.examination_top_date_fuhao{
color: #6C6B6C;
}
.examination_bottom{
width: 100%;
background-color: #FFFFFF;
position: absolute;
top: 9.7rem;
bottom: 0;
}
.examination_bottom_text{
margin: .5rem 0 .5rem .5rem;
font-weight: 500;
color: #6C6B6C;
}
.examination_bottom_textarea{
margin: 0 .5rem .5rem .5rem;
}
.examination_bottom_textarea>textarea{
width: 100%;
height: 10rem;
border-radius: 5px;
}
.examination_bottom_button{
text-align: center;
padding: .5rem 0;
color: #FFFFFF;
background-color: #12B9F7;
position: absolute;
bottom: 2rem;
left: .5rem;
right: .5rem;
border-radius: 5px;
}
</style>
</head>
<body>
<div class="examination_top">
<div class="examination_top_text">体检日期</div>
<div class="examination_top_date">
<span class="examination_top_date_time">
<?php echo date('Y-m-d', time()); ?>
</span>
<span class="examination_top_date_fuhao">></span>
</div>
</div>
<div class="examination_bottom">
<div class="examination_bottom_text">备注</div>
<div class="examination_bottom_textarea">
<textarea></textarea>
<div id="titlelen" style="float:right;color: gray;">0/100</div>
</div>
<div class="examination_bottom_button">提 交</div>
</div>
</body>
<!-- <script src="<?php echo JS_DOMAIN; ?>/1.0/jquery-3.1.0.min.js?v=<?php echo VERSION_NUMBER ?>"></script> -->
</html>
html5+css3 h5页面生成的思路的更多相关文章
- HTML5+CSS3静态页面项目-PayPaul的总结
学习前端有一段时间了,一直在看书上的理论知识,而实战项目却很少.师兄常说,想要知道自己的实力有多少,知识掌握了多少,最好的方法就是去实践了,实践出真知嘛.于是决定在这个假期里,主要是通过项目的实践以及 ...
- HTML5+CSS3静态页面项目-BusinessTheme的总结
因为期末考试.调整心态等等的种种原因,距离上一次的项目练习已经过了很久了,今天终于有时间继续练习HTML5+CSS3的页面架构和设计稿还原.设计图很长,整个页面分为了好几个区域,所以就不放完整的设计图 ...
- 超棒的HTML5/CSS3单页面响应式模板（支持Bootstrap）
在线演示 使用Bootstrap实现的响应式单页面模板. 桌面效果: 移动设备效果: 阅读全文:超棒的HTML5/CSS3单页面响应式模板(支持Bootstrap)
- H5页面项目的思路整理
这是H5项目完成后的一些整理,有些理解不能非常准确,希望大家能帮忙指出. 移动端的适配 一些名词解释 visual viewport 可视视图 layout viewport 布局视图 vm 可视视图 ...
- 记录一个h5页面生成canvas画布做签名的js插件--signature_pad
demo地址:https://jsfiddle.net/02dLn15g/5/ GitHub地址:https://github.com/szimek/signature_pad 配置项: dotSiz ...
- 2019.4.25 表格表单与HTML5 && CSS3
目录 表格 标签 属性 表格间距离 表格的内边距 表格的边框 样式 边框合并 行合并 列合并 display 表单 标签 属性 提交的网址 请求方式 input相关 扩大响应范围 字符 密码 单选框 ...
- HTML5+CSS3学习笔记（二） 页面布局：HTML5新元素及其特性
HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页面显得非常简单. 本次学习HTML5的新标签元素有: <head ...
- 07. Web大前端时代之：HTML5+CSS3入门系列~H5 地理位置
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...
- 05. Web大前端时代之：HTML5+CSS3入门系列~H5 多媒体系
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 1.引入 概述 音频文件或视频文件都可以看做是一个容器文 ...
随机推荐
- ETL测试
今天让我在休息之余给我的测试朋友介绍一个在我的测试沙龙上的需要和提升技能之一,例如ETL测试(Extract,Transform,and Load,中文名称为数据提取.转换和加载),这篇文章告诉你ET ...
- 单进程单线程的Redis如何能够高并发
redis快的原因: 1.纯内存操作2.异步非阻塞 IO 参考文档: (1)http://yaocoder.blog.51cto.com/2668309/888374 (2)http://www.cn ...
- 新的玩具：Windows上的awesome
平铺式窗口管理器 基于xwindow(Linux/Unix采用的图形系统)有成千上百种窗口管理器.其中有一类窗口管理器很古怪,所有应用程序的窗口没有互相遮挡,而是平铺到屏幕上,这类窗口管理器叫 平铺式 ...
- opencv产生随机的颜色
//将HSV颜色空间值转换成RGB值,参考这里cv::Scalar HSV2RGB(const float h, const float s, const float v) { ); - h_i; - ...
- 【codeforces】【比赛题解】#854 CF Round #433 (Div.2)
cf一如既往挺丧 看丧题点我! [A]分数 Petya是数学迷,特别是有关于分数的数学.最近他学了所谓一个分数被叫做“真分数”当且仅当其分子小于分母,而一个分数被叫做“最简分数”当且仅当其分子分母互质 ...
- 渗透测试===kali linux的安装
方法一: kali linux 安装在本地的vitural box 或者 wm ware中 方法二: 安装在移动硬盘或者储存卡中,插到电脑就能用
- 【Android开发】之Fragment开发1
一直知道Fragment很强大,但是一直都没有去学习,现在有些空闲的时间,所以就去学习了一下Fragment的简单入门.我也会把自己的学习过程写下来,如果有什么不足的地方希望大牛指正,共同进步! 一. ...
- Golang新起航！（编译安装go）
别废话,直接上~ linux下安装GO1.8 1.下载go的版本 国内地址源:https://dl.gocn.io/ 在这里选择源码的方式安装,在安装go的时候是需要gcc的,所以你的linux系统需 ...
- BatchNorm caffe源码
1.计算的均值和方差是channel的 2.test/predict 或者use_global_stats的时候,直接使用moving average use_global_stats 表示是否使用全 ...
- json在线工具
1.json在线格式化工具 http://www.choujone.com/json/ 2.json在线比较工具 http://tlrobinson.net/projects/javascript-f ...