使用Float

<!--已知两个div的宽度使用[Float]使两个DIV同行！注：float使用后需要清除；所以多写一个div-->

    <div style="width: 300px; height: 200px; border: 1px solid #4cff00;">

        <div style="width: 70%; height: 50%; float: left; background-color: red;">我是第一个div</div>

        <div style="width: 30%; height: 50%; float: right; background-color: yellow;">我是第二个div</div>

        <div style="clear: both;"></div>

    </div>

网页效果：

div不换行_div同行_div强制不换行的更多相关文章

  1. CSS强制英文、中文换行与不换行 强制英文换行

    1. word-break:break-all;只对英文起作用,以字母作为换行依据 2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 3. white-space: ...

  2. CSS强制中英文换行与不换行

    1. word-break:break-all; 只对英文起作用,以字母作为换行依据 2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 3. white-space ...

  3. CSS强制英文换行

    1. word-break:break-all;只对英文起作用,以字母作为换行依据 2. word-wrap:break-word; 只对英文起作用,以单词作为换行依据 3. white-space: ...

  4. html 元素 强制不换行

    html 中 nowrap是用来强制不换行的 在排版中 对包裹plain text的标签使用nowrap属性即刻实现强制不换行. 如:<p nowrap>强制不换行</p>&l ...

  5. 同级div设置display:inline-block，父级div强制不换行

    同级div设置display:inline-block,父级div强制不换行 <html> <head></head> <body> <div i ...

  6. CSS样式自动换行(强制换行)与强制不换行

    自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法 对于div,p等块级元素,正常文字的换行(亚洲文字和非亚洲文字)元素拥 ...

  7. css实现强制不换行/自动换行/强制换行

    在我们日常的编码中经常会遇到这段文字不可以换行,或者自动换行的需求.虽然这个功能在我们平时很常见但是我相信大家一定不会可以的去记住它吧(至少小月是很懒惰的从来是用什么查什么 ♦ 嘻嘻...).今天我们 ...

  8. CSS - 如何实现强制不换行、自动换行、强制换行 以及 chrom默认焦点 IE下 Input 默认出现叉

    *:focus {outline: none;} input::-ms-clear {display:none;} 一般的文字截断(适用于内联与块): .text-overflow { display ...

  9. css 强制不换行

    强制不换行 div{white-space:nowrap;} 自动换行 div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行 div{w ...

随机推荐

  1. 【原】小玩node+express爬虫-1

    最近开始重新学习node.js,之前学的都忘了.所以准备重新学一下,那么,先从一个简单的爬虫开始吧. 什么是爬虫 百度百科的解释: 爬虫即网络爬虫,是一种自动获取网页内容的程序.是搜索引擎的重要组成部 ...

  2. canvas刮刮乐效果（pc端&H5、zepto-touchmove）

    一.html <div id="canvasArea" style="width:300px;height:200px;position:relative;&quo ...

  3. javascript的console.log用法

    f1.html代码 <iframe id="frame2" name="frame1" src="ww.html"></i ...

  4. 常用HTTP状态码和CURL 000问题

      最近在测试CDN服务质量问题,测试过程中返回了一些不同的状态码,当然有一些常用的,也有一些不常用的.最奇葩的是在使用curl命令的时候出现000状态码,问了很多同事,对这个000的反应跟新事物是的 ...

  5. .net core教程

    https://docs.microsoft.com/en-us/aspnet/core/tutorials/first-mvc-app/start-mvc

  6. MyEclipse：各种提示图标的含义

    1.新建的项目,项目名称前有黄色小警示号的原因, 2.项目名称上有红色叹号,说明缺少jar包,仔细找一下,看看缺了什么,添加进去一般就好了. 3.出现红色叉号,那说明代码错误,需要修改代码.

  7. ubuntu14.04下搭建python+mysql环境

    简略记录ubuntu14.04下搭建python操作的mysql服务器的过程和其中遇到的问题及解决方法. 第一部分: 安装mysql 安装步骤:1. sudo apt-get install mysq ...

  8. 纵观jBPM：从jBPM3到jBPM5以及Activiti5

    http://www.infoq.com/cn/articles/rh-jbpm5-activiti5/ 作者 荣浩 发布于 2010年12月28日 | 注意:GTLC全球技术领导力峰会,500+CT ...

  9. C#调用百度地图 api

    转  http://blog.csdn.net/kkkkkxiaofei/article/details/8663377 这一篇,记录一下我调用的地图API实现的功能.下面介绍的都是一些片段的节选,不 ...

  10. 适配ios9出现的问题：-canOpenURL: failed for URL

    -canOpenURL: failed for URL: "wtloginmqq2://qzapp" - error: "(null)" 2015-09-13 ...