<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <div style="width: 20%;background-color: brown;float: left">1</div>

    <div style="width: 80%;background-color: aquamarine;float: left">2</div>

</body>

</html>

可以解决拼接行的问题。

float样式的使用的更多相关文章

  1. CSS之float样式总结

    从四大开始开始慢慢接触前端,大概半年多过去了,虽然做了一些东西,但感觉有些点始终不是很清晰.有时候为了赶进度,没有太多时间对某个点进行全面深入思考分析,只能从网上搜一搜,试一试,只要效果出来了,任务就 ...

  2. 关于float样式

    在认识float样式之前务必要认识position:absolute position:absolute 功能是:当前节点脱离文档流,对于其兄弟节点(即同一父节点下的节点)已经感觉不到他的存在(即他的 ...

  3. CSS之float样式

    一.简介 Css样式的float浮动属性,用于设置标签对象(如:<div>标签盒子.<span>标签.<a>标签.<em>标签等html标签)的浮动布局 ...

  4. float是什么样式？

    什么是float样式? 让标签浮动起来,总体方向往上 right,left(右浮,左浮) 联合height,width使用,分别占用y方向和x方向多少,单位px或百分比(%) 作用对象不是页面,而是作 ...

  5. JavaScript特性（attribute）、属性（property）和样式（style）

    最近在研读一本巨著<JavaScript忍者秘籍>,里面有一篇文章提到了这3个概念. 书中的源码可以在此下载.我将源码放到了线上,如果不想下载,可以直接访问在线网址,修改页面名就能访问到相 ...

  6. 使用样式“clear”和“overflow”消除浮动元素对环绕行框的影响

    为元素设置“float”样式之后,元素会脱离标准文档流,不再占据原来的空间.后续元素会向前移动,占据这个新的空间.后续的文本会围绕着浮动元素分布,形成一种环绕布局的现象. 示例代码: <!DOC ...

  7. 关于float的感悟

    给元素设置了float样式后,最终的结果是: 1:这个元素漂浮起来, 2:其他的元素位置可以视为 这个元素不存在 的时候的位置:但是float样式还是对整个页面有所影响 3:float的影响就是他附近 ...

  8. 转载：Clear Float

    众所周知,平时在写HTML代码时,难免少不了使用Float样式,这样一来,假使您没有清除浮动,那么有浮动元素的父元素容器将元素将无法自动撑 开.换句简单好理解的话来说,假如你在写CODE时,其中div ...

  9. CSS 之 清除 float 常用的方法

    大多数前端使用.clearfix:after{ .....}  和 .clearit{....}的组合来清除浮动. 前端开发经常用到浮动 float:left; float:right; 有浮动就需要 ...

随机推荐

  1. ubuntu18.04.2LTS下如何用五笔输入法 --Linux

    ubuntu18.04.2LTS下自带五笔输入法,不用去单独下载 1.在设置中找到区域和语言 2.点击加号添加输入源 3.选择,选择「汉语」 4.选择「极点五笔」 开始你的五笔输入法之旅…… 友情链接 ...

  2. 学习web components

    javascript里的两种组件 1 autonomous custom elements 一般extends HTMLElement, 可以通过<popup-info>或doducmen ...

  3. spring boot2.0(一 ) 基础环境搭建

    1.基础配置 开发环境:window jdk版本:1.8(spring boot2.0最低要求1.8) 开发工具:eclipse 构建方式:maven3 2.POM配置文件 <project x ...

  4. Python生产者producer和consumer消费者案例写法，含有多线程，包含队列queue、JoinableQueue队列的用法

    import timeimport random import queuefrom multiprocessing import Process,Queue 案例一:def consumer(q,na ...

  5. cmd非运行完再保存，结果显示&保存同时进行

    #coding:utf-8 """ fps信息获取到文件 """ import sys import subprocess class Lo ...

  6. React文档（二十一）协调

    React提供了一个声明式地API因此你不用担心每一次更新什么东西改变了.这使得开发应用变得简单,但是这个东西在React中如何实现的并不是很明显.这篇文章会解释我们在React的算法中所做的选择以便 ...

  7. dynamics crm跳转到手机版本的页面

    https://community.dynamics.com/crm/f/117/t/210393 https://community.dynamics.com/crm/f/117/t/118414 ...

  8. hive的排序，分組练习

    hive的排序,分組练习 数据: 添加表和插入数据(数据在Linux本地中) create table if not exists tab1( IP string, SOURCE string, TY ...

  9. 转载（略有修改）：Windows 8的承载网络设置方法（w8 创建无线网络/ap）

    第一步.查看电脑是否支持网络共享 在命令提示符(打开方式看文章最后)中输入:netsh wlan show drivers,然后回车. 找到"支持的承载网络"一项,如果后面显示的是 ...

  10. stackExchange.redis 实现模糊匹配批量查询

    如果使用redis的频次较高,那么业务中经常会出现需要根据关键字进行批量查询,所以总结一下StackExchange中使用批量查询的方法(如果数据量很大,那么在redis中模糊查询很耗时,请慎用!) ...