如何让两个div在同一行显示?一个float搞定
最近在学习div和css，遇到了一些问题也解决了很多以前以为很难搞定的问题。比如：如何让两个div显示在同一行呢？（不是用table表格，table对SE不太友好）其实，<div> 是一个块级元素，也就是说，浏览器通常会在 div 元素前后放置一个换行符。可以加一个属性float:left，演示代码如下
<div>
<div style="float:left; width:100px; border:2px solid #aa00FF; ">第一个div</div>
<div style="float:left; width:100px; border:2px solid #0033FF; ">第二个div</div>
</div>
实现效果如下：
怎么样，是不是很简单？
如何让两个div在同一行显示?一个float搞定的更多相关文章
- 两个div在同一行显示
栅格系统需要引用bootstrap插件 <script src="~/Scripts/BootStrap/bootstrap.js"> </script> ...
- html/css 两个div在同一行
在界面设计的时候,经常需要将两个div在同一行显示. 但是每次都会忘记怎么做,特此随笔,备忘. 如以下要将“第一个div”和“第二个div”显示在同一行: <div id="id1&q ...
- css：多个div在同一行显示
使用float:left,也可以使用display : inline-block,可以使多个div在同一行显示. 示例如下: <div class="search_row"& ...
- Jquery一个slideToggle搞定div的隐藏与显示
Jquery一个slideToggle搞定div的隐藏与显示 <!DOCTYPE html> <html> <head> <script src=" ...
- 忘带U盘了？？别急！一行python代码即可搞定文件传输
近日发现了python一个很有趣的功能,今天在这里给大伙儿做一下分享 需求前提 1.想要拷贝电脑的文件到另一台电脑但是又没有U盘2.手机上想获取到存储在电脑的文件3.忘带U盘- 您也太丢三落四了吧,但 ...
- 两个div在同一行，两个div不换行
方法一: <div style="display:inline"> <div id="div1" style="float:left ...
- 两个div不同高度并排显示
在HTML中让两个div并排显示,通常情况下有三种实现方式,包括: (1)设置为行内样式,display:inline-block (2)设置float浮动 (3)设置position定位属性为abs ...
- css实现两个div并排等高（一个div高度随另一个高度变化而变化）
方法一.两个div都设置 display: table-cell; 方法二.父级div设置 display: -webkit-box;
- 点击按钮对两个div的隐藏与显示进行切换
HTML: <button type="button" id="showHidden">点击切换div的隐藏与显示</button> ...
随机推荐
- git 修改最后一次提交的用户名 或者 commit的内容
修改git最后一次提交的命令 $ git commit --amend 修改git最后一次提交用户名的相关命令 git config user.name 'wangz' git config user ...
- Linux 共享内存详解一
共享内存段被多个进程附加的时候,如果不是所有进程都已经调用shmdt,那么删除该共享内存段时,会出现一个临时的不完整的共享内存段(key值是0),无法彻底删除.只有当所有进程都调用shmdt,这个临时 ...
- 【三石视频教程】当FineUIPro遇到ReportViewer
FineUIPro 下个版本(v2.8.0)即将支持 ReportViewer,为此三石特别制作了一期视频教程,供大家参考. 运行效果图: 视频下载:http://pan.baidu.com/s/ ...
- Codeforces Round #384(div 2)
A 题意:有n个机场处于一直线上,可两两到达,每个机场只可能属于两家公司中的一家(用0,1表示),现在要从a机场到b机场,可任意次转机.若机场i与机场j从属同一公司,则费用为0,否则费用为1.问最小费 ...
- asp.net获取服务器绝对路径和相对路径
绝对路径 AppDomain.CurrentDomain.SetupInformation.ApplicationBase 相对路径 Server.MapPath("~/")表示当 ...
- bootstrop 日期控件 datepicker被弹出框dialog覆盖的解决办法
筒子们在使用bootstrap的日期控件(datepicker , 现在官网提供的名称叫 datetimepicker)时可能会遇到如上图的问题这是啥原因造成的呢? 答案很简单时输出的优先级造成的(z ...
- APP逆向常识
SO库Linux系统下的动态库文件,就像win系统下的dll文件一样.将APK,改成RAR,在Lib目录下.dex(classes.dex)Dex是Android系统中可以在Dalvik虚拟机上直接运 ...
- canvas钟表
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Java学习笔记（二）
再次更新,有问题大家一起讨论 Java中的class文件转换成.java文件 下载转换器Java Decompiler 使用此转换器打开.jar文件 就可以看到由.class转换来的.java文件 亲 ...
- Entity Framework 6连接Postgresql、SQLite、LocalDB的注意事项和配置文件
Postgresql Postgresql支持Code First的方式自动生成表,不过默认的模式是dbo而不是public,而且还可以自动生成自增主键. <?xml version=" ...