css样式之浮动
什么是浮动?
添加了浮动的的元素会脱离正常的文档流。
浮动的特点:
1、可以让块级元素排在同一排
2、可以让行属性标签支持所有的css样式
3、遇到相邻的浮动元素或者父级元素会停下来
4、浮动会影响其他元素的布局
清除浮动的办法:
1、给父级添加高度,扩展性比较差,特殊情况下不能使用
2、overflow:hidden (子元素比父元素大的时候不能使用)
3、clear:both 最完美的方式
:clear:after{
content:'';
display:block;
clear:both;
}
css样式之浮动的更多相关文章
- css样式float造成的浮动“塌陷”问题的解决办法
什么是CSS Float? 定义: float 属性定义元素浮动到左侧或右侧.以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动.浮动元素会生成一个块级元素,而不论 ...
- 一、CSS概述 二、CSS的选择器(认识) 三、CSS样式和属性(练习) 四、重构商城首页DIV+CSS(页面布局)(重点) 浮动/更改显示方式
一.CSS概述###<1>概念 DIV,就是一个HTML元素,块级元素,通常结合CSS进行页面的布局. CSS,层叠样式表,给HTML元素增强显示. ###<2>作用 样式定义 ...
- bootstrap-全局css样式
bootstrap-全局css样式 1.bootstrap是一个前端框架 2.基本模板:viewport视口可以解决移动端设备网页自适应问题 3.版心(.container) 流式版心(.con ...
- CSS样式表(三)
前端人员在学习开发过程中常用的CSS样式总结: [margin] margin 检索或设置对象四边的外延边距 margin-top 检索或设置对象顶边的外延边距 margin-right 检索或设置对 ...
- 记一次项目中的css样式复用
本文同步至微信公众号:http://mp.weixin.qq.com/s?__biz=MzAxMzgwNDU3Mg==&mid=401616238&idx=1&sn=3c6e9 ...
- CSS样式----图文详解(二):css属性
主要内容 CSS的单位 字体属性 文本属性 背景属性 列表属性 盒子模型 定位属性:position.float.overflow.z-index等 导航栏的制作 鼠标的属性cursor 滤镜的介绍 ...
- CSS样式----图文详解:css样式表和选择器
主要内容 CSS概述 CSS和HTML结合的三种方式:行内样式表.内嵌样式表.外部样式表 CSS四种基本选择器:标签选择器.类选择器.ID选择器.通用选择器 CSS三种扩展选择器:组合选择器.后代选择 ...
- HTML 学习笔记 CSS样式(定位)
CSS定位(Positioning)属性 允许你对元素进行定位. CSS定位和浮动 CSS为定位和浮动提供了一些属性,利用这些属性 可以建立列式布局,将布局的一部分与另一部分重叠.还可以完成多年来通常 ...
- bootstrap全局CSS样式学习
参考http://v3.bootcss.com/css/,根据自己的记忆进行的复述,加深记忆. 首先介绍bootstrap全局CSS样式 只通过使用bootstrap.css,即可获得统一的样式设置. ...
随机推荐
- c#代码设计:子类和父类
哭辽,事情是这样的 我想写个产品类用来放点相机参数,想类似这种的使用方式:(时间关系不改了,产品=Zoo,animals=相机) Zoo Zooxx= new Zoo (); Zoo.Animals ...
- RefactoringGuru 代码异味和重构技巧总结
整理自 RefactoringGuru 代码异味 --什么?代码如何"闻味道"?? --它没有鼻子...但它肯定会发臭! 代码膨胀 [代码膨胀]是代码.方法和类,它们的规模已经增加 ...
- 数论同余学习笔记 Part 2
逆元 准确地说,这里讲的是模意义下的乘法逆元. 定义:如果有同余方程 \(ax\equiv 1\pmod p\),则 \(x\) 称为 \(a\bmod p\) 的逆元,记作 \(a^{-1}\). ...
- 生成"cmd.exe"错误
转载请注明来源:https://www.cnblogs.com/hookjc/ 在VC2005里打开"工具"菜单,选择"选项",打开"选项" ...
- Java8 Stream 的一些操作和介绍
原创:转载需注明原创地址 https://www.cnblogs.com/fanerwei222/p/11858186.html Java8 Stream 是一个新的东西, 就是能够将常见的数据结构转 ...
- jdk1.5出现的新特性---->增强for循环
import java.util.HashMap; import java.util.HashSet; import java.util.Iterator; import java.util.Map; ...
- 栈(stack)、递归(八皇后问题)、排序算法分类,时间和空间复杂度简介
一.栈的介绍: 1)栈的英文为(stack)2)栈是一个先入后出(FILO-First In Last Out)的有序列表.3)栈(stack)是限制线性表中元素的插入和删除只能在线性表的同一端进行的 ...
- LeetCode随缘刷题之赎金信
欢迎评论区讨论. package leetcode.day_12_04; /** * 为了不在赎金信中暴露字迹,从杂志上搜索各个需要的字母,组成单词来表达意思. * * 给你一个赎金信 (ransom ...
- JS快速入门(二)
目录 JS快速入门(二) 结构图 BOM window对象 open() window子对象 location对象 history对象(了解) navigator 对象 screen对象 BOM 定时 ...
- PHP宝典面试笔试题目
PHP宝典面试笔试题目 来自<PHP程序员面试笔试宝典>,涵盖了近三年了各大型企业常考的PHP面试题,针对面试题提取出来各种面试知识也涵盖在了本书. PHP题目 [真题68] ( ) ...