div用了浮动,且使用百分比,浏览器缩放布局就乱了,小白一个求大神,挺急的 1C

questionnaire.css
body {
/* 这里相对于css文件 /
/
background-image: url(../images/3b77dc0bbd41ef396690eb32a9803998[1].jpg); */
background-color: #E8F2FE;
width: 100%;
height: 100%;
}

font {
font-family: "楷体";/* Trebuchet MS /
}
/
整个表单作为一个outer*/
.StuQuestionnaire_outer {
position: relative;
/* height: 100%; /
width: 100%;
left: 2%;
background-color: #E8F2FE;
/
border: 1px red solid; /
}
/
尊敬的女士...开始 /
.StuQuestionnaire_top {
/
border: 1px black solid; /
/
position: absolute; /
float: left;
width: 90%;
height: 10%;
border-bottom: 1px #EFEFEF dashed;
margin-top: 2%;
margin-left: 2%;
padding: 1%;
}
/
尊敬的女士...结束 /
/
***************************/
/* 表单内容开始...开始 /
.StuQuestionnaire_content {
/
position: absolute; /
float: left;
margin-top: 0%;
margin-left: 2%;
padding: 1%;
width: 90%;
/
border: 1px blue solid; /
}
/
表单内容开始...结束 /
/
***************************/
/* 一、个人就业信息...开始*/
.StuQuestionnaire_content1_top {
float: left;
/* border: 1px yellow solid; /
width: 100%;
}
/
一、个人就业信息...结束*/
/****************************/
/* 一、个人就业信息问卷内容...开始*/
.StuQuestionnaire_content1_bottom {
width: 80%;
/* border: 1px black solid; /
float: left;
padding: 1%;
margin-left: 11%;
}
/
一、个人就业信息问卷内容...结束*/
/****************************/
/* 一、个人就业信息问卷内容的每一条...开始*/
.StuQuestionnaire_content1_bottom_div {
width: 90%;
float: left;
padding-left: 1%;
/* padding-top: 1%; /
padding-bottom: 1%;
/
border: 1px blue solid; */
}

.StuQuestionnaire_content1_bottom_div:HOVER {
background-color: #EDFAFE;
} /* 一、个人就业信息问卷内容的每一条...结束*/
/****************************/
/* 一、个人就业信息问卷内容的每一条的标题...开始*/
.StuQuestionnaire_content1_bottom_div_title {
float: left;
/* border: 1px red solid; /
width: 20%;
}
/
一、个人就业信息问卷内容的每一条的标题...开始*/
/****************************/
/* 一、个人就业信息问卷内容的每一条的input...开始*/
.StuQuestionnaire_content1_bottom_div_input {
width: 40%;
float: left;
}

/* 一、个人就业信息问卷内容的每一条的input...结束*/
/****************************/
/* 一、个人就业信息问卷内容的每一条的text...开始*/
.StuQuestionnaire_content1_bottom_div_text {
width: 100%;
/* color: #A79776; /
}
/
一、个人就业信息问卷内容的每一条的text...结束*/
/****************************/
/* 一、个人就业信息问卷内容的控制信息的图片div..开始 */
.imgDiv {
float: left;
height: 2.5%;
width: 2%;
visibility: hidden;
margin-left: 1%;
}

.imgDiv img {
height: 100%;
background: transparent; /*完全透明*/
opacity: 1; /*整个按钮的不透明度,会影响到文字,0完全透明,1完全不透明*/
background: rgba(255, 255, 255, 0.5);
}
/* 一、个人就业信息问卷内容的控制信息的图片div..结束 /
.controlMessages {
float: left;
height: 2.5%;
margin-left: 0.5%;
}
/
***************************/
/* 二、工作满意度..开始*/
.StuQuestionnaire_content2_top {
float: left;
/* border: 1px yellow solid; /
width: 100%;
}
/
二、工作满意度..结束*/
/****************************/
/* 二、工作满意度答卷内容...开始*/
.StuQuestionnaire_content2_bottom {
width: 98%;
/* border: 1px black solid; /
float: left;
padding: 1%;
}
/
二、工作满意度答卷内容...结束*/
/****************************/
/* 二、工作满意度答卷内容的每一条...开始*/
.StuQuestionnaire_content2_bottom_div {
width: 80%;
float: left;
padding-left: 1%;
/* padding-top: 1%; /
padding-bottom: 1%;
/
border: 1px red solid; /
border-bottom: 10% red solid;
/
border-bottom: 10%;
border-bottom-width: 80%;
border-bottom-color: black; */
margin-left: 10%;
}

.StuQuestionnaire_content2_bottom_div:HOVER {
background-color: #EDFAFE; /* #EDFAFE*/
}
/* 二、工作满意度答卷内容的每一条...结束*/
/****************************/
/* 二、工作满意度答卷内容的每一条的标题...开始*/
.StuQuestionnaire_content2_bottom_div_title {
float: left;
width: 80%;
/* border: 1px red solid; /
margin-left: 1%;
}
/
二、工作满意度答卷内容的每一条的标题...开始*/
/****************************/
/* 二、工作满意度答卷内容的每一条的input...开始*/
.StuQuestionnaire_content2_bottom_div_input {
width: 78%;
float: left;
/* border: 1px black solid; /
padding: 1%;
margin-left: 1%;
}
/
二、工作满意度答卷内容的每一条的input...结束*/
/****************************/
/* 二、工作满意度答卷内容的每一条的input的每个选项...开始*/
.StuQuestionnaire_content2_bottom_input_choose {
width: 95%;
float: left;
/* border: 1px red solid; */
margin-bottom: 1%;
margin-left: 1%;
}

.StuQuestionnaire_content2_bottom_input_choose:HOVER {
background-color: #EFEFEF;
cursor: pointer;
}
/* 二、工作满意度答卷内容的每一条的input的每个选项...开始*/
.StuQuestionnaire_content2_bottom_input_choose input {
width: 3%;
height: 2.5%;
float: left;
/* border-radius: 100%; */
-webkit-box-shadow: 0% 18% 30% rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0% 18% 30% rgba(0, 0, 0, 0.5);
box-shadow: 0% 18% 30% rgba(0, 0, 0, 0.5);
background: #ddd;
}

.StuQuestionnaire_content2_bottom_input_choose label {
float: left;
margin-left: 0.5%;
}
/**设置红色字体**/
.redFont {
color: red;
}

.StuQuestionnaire_content2_bottom_submit {
width: 80%;
float: left;
padding-left: 1%;
/* padding-top: 1%; /
padding-bottom: 1%;
/
border: 1px red solid; */
margin-left: 10%;
}

.StuQuestionnaire_content2_bottom_div_submit {
width: 78%;
float: left;
padding: 1%;
margin-left: 1%;
}

.StuQuestionnaire_content2_bottom_div_submit input {
background-color: #DEDEDD;
float: left;
height: 30px;
width: 8%;
margin-left: 40%;
}

.StuQuestionnaire_content2_bottom_div_submit input:HOVER {
cursor: pointer;
position: relative;
-webkit-animation-name: buzz-out;
-webkit-animation-duration: 0.5s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: 1;
top: 2%;
margin-left: 40.5%;
margin-top: 0.5%;
}

.StuQuestionnaire_content2_bottom_div_submit input:AFTER {
cursor: pointer;
position: relative;
top: 0%;
left: 0%;
}

3个回答

 system("cls");

这个是什么~~~~~··

用了浮动之后有没有清除浮动?(没看你代码)

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
关于div浮动!网页布局
-
DIV元素使用浮动时无效的问题
-
div布局时如何防止浏览器窗口缩小的错误情况??
-
CSS+div网页设计 电脑浏览器打开网页正常 但手机浏览器打开col-sm-4位置乱了
-
关于div布局问题,怎样使div大小不随浏览器窗口大小改变
-
jquery Div隐藏 DIV浮动在iframe上时隐藏失效
-
页面布局什么时候用固定像素什么时候用百分比?
-
背景图片background-position:center,之后,浏览器缩放,内容错位???
-
不会div+css盒子的布局
-
如何让浮动的子DIV在父DIV上居中(水平方向和垂直方向)
-
IE6~7浮动div导致cpu过高
-
如何让子div的内容显示不受父div的影响
-
一个div内含三个div,内部三个div向左浮动,最后一个自适应大小
-
form中div设置浮动,div元素会向左浮动到哪个元素为止??
-
div中加div,如果里面的div给margin-top,则外面的div就会整体下移,如何解决
-
关于DIV在浏览器中定位的问题
-
jquery Div隐藏 当DIV浮动在iframe上时隐藏失效
-
div布局,上中下结构,怎么让高度固定的div始终在高度自适应的div下面
-
急急急!!div盖住整个浏览器
-
程序员那些必须掌握的排序算法(下)
接着上一篇的排序算法,我们废话不多,直接进入主题。 1.快速排序 快速排序(Quicksort)是对冒泡排序的一种改进。 快速排序由C. A. R. Hoare在1960年提出。它的基本思想是:通过一趟排序将要排序的数据分割成独立的两部分,其中一部分的所有数据都比另外一部分的所有数据都要小,然后再按此方法对这两部分数据分别进行快速排序,整个排序过程可以递归进行,以此达到整个数据变成有序序列。 演示...
学会了这些技术,你离BAT大厂不远了
每一个程序员都有一个梦想,梦想着能够进入阿里、腾讯、字节跳动、百度等一线互联网公司,由于身边的环境等原因,不知道 BAT 等一线互联网公司使用哪些技术?或者该如何去学习这些技术?或者我该去哪些获取这些技术资料?没关系,平头哥一站式服务,上面统统不是问题。平头哥整理了 BAT 等一线大厂的必备技能,并且帮你准备了对应的资料。对于整理出来的技术,如果你掌握的不牢固,那就赶快巩固,如果你还没有涉及,现在...
程序员真是太太太太太有趣了!!!
网络上虽然已经有了很多关于程序员的话题,但大部分人对这个群体还是很陌生。我们在谈论程序员的时候,究竟该聊些什么呢?各位程序员大佬们,请让我听到你们的声音!不管你是前端开发...
史上最详细的IDEA优雅整合Maven+SSM框架(详细思路+附带源码)
网上很多整合SSM博客文章并不能让初探ssm的同学思路完全的清晰,可以试着关掉整合教程,摇两下头骨,哈一大口气,就在万事具备的时候,开整,这个时候你可能思路全无 ~中招了咩~ ,还有一些同学依旧在使用eclipse或者Myeclipse开发,我想对这些朋友说IDEA 的编译速度很快,人生苦短,来不及解释了,直接上手idea吧。这篇文章每一步搭建过程都测试过了,应该不会有什么差错。本文章还有个比较优秀的特点,就是idea的使用,基本上关于idea的操作都算是比较详细的,所以不用太担心不会撸idea!最后,本文
知乎上 40 个有趣回复,很精辟很提神
点击蓝色“五分钟学算法”关注我哟加个“星标”,天天中午 12:15,一起学算法作者 |佚名来源 |网络整理,版权归原作者所有,侵删。1交朋友的标准是什么?- Ques...
从入门到精通,Java学习路线导航
引言 最近也有很多人来向我"请教",他们大都是一些刚入门的新手,还不了解这个行业,也不知道从何学起,开始的时候非常迷茫,实在是每天回复很多人也很麻烦,所以在这里统一作个回复吧。 Java学习路线 当然,这里我只是说Java学习路线,因为自己就是学Java的,对Java理当很熟悉,对于其它方面,我也不是很了解。 基础阶段 首先是基础阶段,在基础阶段,我们必须掌握Java基础,Mysql数据库,Ora...
我花了一夜用数据结构给女朋友写个H5走迷宫游戏
起因 又到深夜了,我按照以往在csdn和公众号写着数据结构!这占用了我大量的时间!我的超越妹妹严重缺乏陪伴而 怨气满满! 而女朋友时常埋怨,认为数据结构这么抽象难懂的东西没啥作用,常会问道:天天写这玩意,有啥作用。而我答道:能干事情多了,比如写个迷宫小游戏啥的! 当我码完字准备睡觉时:写不好别睡觉! 分析 如果用数据结构与算法造出东西来呢? ...
实现 Java 本地缓存,该从这几点开始
缓存,我相信大家对它一定不陌生,在项目中,缓存肯定是必不可少的。市面上有非常多的缓存工具,比如 Redis、Guava Cache 或者 EHcache。对于这些工具,我想大家肯定都非常熟悉,所以今天我们不聊它们,我们来聊一聊如何实现本地缓存。参考上面几种工具,要实现一个较好的本地缓存,平头哥认为要从以下三个方面开始。 1、存储集合的选择 实现本地缓存,存储容器肯定是 key/value 形式的数...
揭开 Python 内存分配时的小秘密!
作者 | 豌豆花下猫 责编 | 胡巍巍 Python 中的sys模块极为基础而重要,它主要提供了一些给解释器使用(或由它维护)的变量,以及一些与解释器强交互的函数。 本文将会频繁地使用该模块的getsizeof()方法,因此,我先简要介绍一下: 该方法用于获取一个对象的字节大小(bytes) 它只计算直接占用的内存,而不计算对象内所引用对象的内存 这里有个直观的例...
让程序员崩溃的瞬间(非程序员勿入)
今天给大家带来点快乐,程序员才能看懂。 来源:https://zhuanlan.zhihu.com/p/47066521 1. 公司实习生找 Bug 2.在调试时,将断点设置在错误的位置 3.当我有一个很棒的调试想法时 4.偶然间看到自己多年前写的代码 5.当我第一次启动我的单元测试时 ...
用Python分析2000款避孕套,得出这些有趣的结论
到现在为止,我们的淘宝教程已经写到了第四篇,前三篇分别是: 第一篇:Python模拟登录淘宝,详细讲解如何使用requests库登录淘宝pc端。 第二篇:淘宝自动登录2.0,新增Cookies序列化,教大家如何将cookies保存起来。 第三篇:Python爬取淘宝商品避孕套,教大家如何爬取淘宝pc端商品信息。 今天,我们来看看淘宝系列的第四篇 我们在上一篇的时候已经将淘宝数据爬取下来了,...
做好以下四点,拒做 “ 空心 ” 程序员
01、注重原理性知识 现在的互联网环境下,注重原理性知识学习的程序员越来越少,特别是在这种培训机构大爆炸的环境下,在网上你会经常看到类似三个月从入门到精通高并发、分布式的广告,我相信培训机构有这套技术的能力,但是我不相信一个初学者有这么好的接收能力。甚至某个培训机构的讲师里,有一个1997年出生的架构师,20岁出头就当上了架构师,真的是后生可畏呀。在我的思维里,架构师不是学出来的,架构师是...
分享靠写代码赚钱的一些门路
作者 mezod,译者 josephchang10如今,通过自己的代码去赚钱变得越来越简单,不过对很多人来说依然还是很难,因为他们不知道有哪些门路。今天给大家分享一个精彩...
技术人员要拿百万年薪,必须要经历这9个段位
很多人都问,技术人员如何成长,每个阶段又是怎样的,如何才能走出当前的迷茫,实现自我的突破。所以我结合我自己10多年的从业经验,总结了技术人员成长的9个段位,希望对大家的职...
面试官:兄弟,说说基本类型和包装类型的区别吧
Java 的每个基本类型都对应了一个包装类型,比如说 int 的包装类型为 Integer,double 的包装类型为 Double。基本类型和包装类型的区别主要有以下 4 点。
进程和线程的区别(超详细)
进程和线程 进程 一个在内存中运行的应用程序。每个进程都有自己独立的一块内存空间,一个进程可以有多个线程,比如在Windows系统中,一个运行的xx.exe就是一个进程。 线程 进程中的一个执行任务(控制单元),负责当前进程中程序的执行。一个进程至少有一个线程,一个进程可以运行多个线程,多个线程可共享数据。 与进程不同的是同类的多个线程共享进程的堆和方法区资源,但每个线程有自己的程序计数器、虚拟...
第二弹!python爬虫批量下载高清大图
文章目录前言下载免费高清大图下载带水印的精选图代码与总结 前言 在上一篇写文章没高质量配图?python爬虫绕过限制一键搜索下载图虫创意图片!中,我们在未登录的情况下实现了图虫创意无水印高清小图的批量下载。虽然小图能够在一些移动端可能展示的还行,但是放到pc端展示图片太小效果真的是很一般!建议阅读本文查看上一篇文章,在具体实现不做太多介绍,只讲个分析思路。 当然,本文可能技术要求不是特别高,但可以...
面试官,不要再问我三次握手和四次挥手
三次握手和四次挥手是各个公司常见的考点,也具有一定的水平区分度,也被一些面试官作为热身题。很多小伙伴说这个问题刚开始回答的挺好,但是后面越回答越冒冷汗,最后就歇菜了。 见过比较典型的面试场景是这样的: 面试官:请介绍下三次握手 求职者:第一次握手就是客户端给服务器端发送一个报文,第二次就是服务器收到报文之后,会应答一个报文给客户端,第三次握手就是客户端收到报文后再给服务器发送一个报文,三次握手就...
为什么说 Web 开发永远不会退出历史舞台?
早在 PC 崛起之际,Web 从蹒跚学步一路走到了主导市场的地位,但是随着移动互联网时代的来临,业界曾有不少人猜测,“Web 应该被杀死,App 才是未来”。不过时间是检...
Java 爬虫遇到需要登录的网站,该怎么办?
这是 Java 网络爬虫系列博文的第二篇,在上一篇 Java 网络爬虫,就是这么的简单 中,我们简单的学习了一下如何利用 Java 进行网络爬虫。在这一篇中我们将简单的聊一聊在网络爬虫时,遇到需要登录的网站,我们该怎么办? 在做爬虫时,遇到需要登陆的问题也比较常见,比如写脚本抢票之类的,但凡需要个人信息的都需要登陆,对于这类问题主要有两种解决方式:一种方式是手动设置 cookie ,就是先在网站上...
nginx学习,看这一篇就够了:下载、安装。使用:正向代理、反向代理、负载均衡。常用命令和配置文件
文章目录前言一、nginx简介1. 什么是 nginx 和可以做什么事情2.Nginx 作为 web 服务器3. 正向代理4. 反向代理5. 动静分离6.动静分离二、Nginx 的安装三、 Nginx 的常用命令和配置文件四、 Nginx 配置实例 1 反向代理五、 Nginx 配置实例 2 负载均衡六、 Nginx 配置实例 3 动静分离七、 Nginx 的高可用集群 前言 一、nginx简介...
相关热词 c#sdf数据库连接 c# 使用配置文件 c#float 转int c#报警指示灯 c#复制二维数组 c# 歌词滚动 c#获取数据库一列数据 c#中parse用法 c#异步编程是什么意思 c#验证手机号正则