直接贴代码吧

先总结一下吧  有两种方法

一    最外层设置一个大div  给这个大div固定的宽度和高度

给里面两个小div 设置浮动  设置宽高

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>两个DIV并排</title>
<style>
.div-a{ float:left;width:500px;height:100px;border:1px solid #F00;}
.div-b{ float:left;width:500px;height:100px;border:1px solid #000;}
</style>
</head>
<body>
<div style="min-width:1200px;height:200px">
<div class="div-a">第一个DIV盒子</div>
<div class="div-b">第二个DIV盒子</div>
</div>
</body>
</html>

二   最外层设置一个大div  给这个大div设置display:flex

给里面两个小div 设置浮动  设置宽高

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>两个DIV并排</title>
<style>
.div-a{ float:left;width:500px;height:100px;border:1px solid #F00;}
.div-b{ float:left;width:500px;height:100px;border:1px solid #000;}
</style>
</head>
<body>
<div style="display: flex">
<div class="div-a">第一个DIV盒子</div>
<div class="div-b">第二个DIV盒子</div>
</div>
</body>
</html>

前端页面中如何在窗口缩放时让两个div始终在同一行显示的更多相关文章

  1. 设置一个div网页滚动时，使其固定在头部，当页面滚动到距离头部300px时，隐藏该div，另一个div在底部，此时显示；当页面滚动到起始位置时，头部div出现，底部div隐藏

    设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...

  2. 在前端页面中使用Markdown并且优化a标签

    近期在自己的项目中加入了对 Markdown 语法 的支持,主要用到的是markedjs这个项目.该项目托管在github上,地址为:https://github.com/markedjs/marke ...

  3. 在前端页面中使用@font-face来显示web自定义字体【转】

    本文转自W3CPLUS 的<CSS @font-face> @font-face是CSS3中的一个模块,他主要是把自己定义的Web字体嵌入到你的网页中,随着@font-face模块的出现, ...

  4. 使用原生ajax访问后台数据并将其展现在前端页面中（小菜鸟自己整理玩的，大神勿喷）

    首先你要有php的环境,关于php环境的搭建,php本地站点的搭建,此处不再重复请看这里:http://www.cnblogs.com/Gabriel-Wei/p/5950465.html我们把wam ...

  5. THINKPHP_(7)_THINKPHP6的controller模型接收前端页面通过ajax返回的数据，会因为一个div而失败

    这个随笔比较短. 同样的前端页面代码,修改了一下,后端模型接收不到数据. 利用beyond compare软件比对两个前端文件, 发现多了一个</div>标签. 多了一个</div& ...

  6. win32 窗口缩放时出现闪屏

    今天无意发现之前写的一个小工具在缩放窗口的时候,出现闪屏,主要有两个位置: 工具栏出一闪屏 右侧的控制面板出现闪屏 (这个控制面板与多层元件组合而成) 之前真没注意到这个问题,平时都是最大化/恢复窗口 ...

  7. JS 在open打开的子窗口页面中调用父窗口页面的JS方法

    需求的情景如下: 1:做新增或修改等操作的时候打开一个新的浏览器窗口(使用window.open(参数等)方法) 2:在新增或修改等的页面上有返回按钮.重置按钮.保存按钮,对于返回就直接关闭此窗口(使 ...

  8. web前端页面中异步使用百度地图API

    <div id="allmap"></div> //百度地图API功能 function loadJScript() { var script = docu ...

  9. 前端页面中：jsp和HTML的区别之处

    JSP和HTML的区别 HTML页面是静态页面,也就是事先由用户写好放在服务器上,固定内容,不会变,由web服务器向客户端发送,平时上网看的网页都是大部分都是基于html语言的. JSP页面是有JSP ...

随机推荐

  1. 201521123108 《Java程序设计》第13周学习总结

    1. 本周学习总结 2. 书面作业 Q1. 网络基础 1.1 比较ping www.baidu.com与ping cec.jmu.edu.cn,分析返回结果有何不同?为什么会有这样的不同? 答: 回复 ...

  2. centOS 6启动流程

      centOS6启动流程 centOS6启动流程 linux内核组成 centos6启动大致流程 1.post加电自检 2.Boot Sequence 3.MBR引导 4.Grub启动 制作init ...

  3. [07] String字符串

    1.相同又不同的字符串 String str1 = new String("String"); String str2 = "String"; String s ...

  4. mybatis-java代码调用部分

    只需要加入 mybatis-2.2.jar  和数据库驱动包即可 java代码实现的步骤 package com.yangwei.shop.test; import java.io.IOExcepti ...

  5. virtualbox修改主机名

    virtualbox修改主机名 /etc/hostname /etc/hosts

  6. 编译Linux-4.9.9内核流程记录

    本文部分资料出自: http://www.cnblogs.com/xiaocen/p/3717993.html 首先下载代码: https://www.kernel.org/pub/linux/ker ...

  7. iOS 信号量

      信号量就是一个资源计数器,对信号量有两个操作来达到互斥,分别是P和V操作. 一般情况是这样进行临界访问或互斥访问的: 设信号量值为1, 当一个进程1运行是,使用资源,进行P操作,即对信号量值减1, ...

  8. 为什么自学java的人99%都学不会？

    在学习java这条路上,有一类自学的学员,总让我感慨良多.这类学员,往往每天表现非常勤奋的学习,但学会的人却很少.他们极期勤奋,那么努力的学,也很认真,为什么就是学不会java呢? 通过小橙子我的大量 ...

  9. PHPFastCGI进程管理器PHP-FPM详解

    PHP-FPM是一个PHPFastCGI进程管理器,是只用于PHP的.      PHP-FPM其实是PHP源代码的一个补丁,旨在将FastCGI进程管理整合进PHP包中.必须将它patch到你的PH ...

  10. C "right-left" 从左到右

    葵花宝典:http://ieng9.ucsd.edu/~cs30x/rt_lt.rule.html C混带代码大赛