我们知道,在网页的DIV+CSS布局中,很多时候要用到浮动。

既然有浮动,那就有清除浮动。

清除浮动有很多种方式,而在实际项目中,比较常用的是这一种。

.clearfix:after {
content: "";
display: block;
clear: both;
}
.clearfix {
zoom:;
}

我们可以把这部分代码复制到项目中的CSS文件中,也可以保存为一个CSS文件,然后引入。

那么怎么引入呢?这时,我们就需要用到 @import。

@import url("clear.css");

把引入的样式的名字换成你取的名字,然后复制到项目中的CSS文件中就可以了。

.clearfix 清除浮动,@import的更多相关文章

  1. clearfix清除浮动

    首先在很多很多年以前我们常用的清除浮动是这样的. 1 .clear{clear:both;line-height:0;} 现在可能还可以在很多老的站点上可以看到这样的代码,相当暴力有效的解决浮动的问题 ...

  2. css用clearfix清除浮动

    本文从http://www.studyofnet.com/news/196.html复制.   本文导读:写css 时总为浮动而烦恼,如果用了浮动,浮动的父层不会跟着浮动框的高度增加而增加,在Fire ...

  3. [笔记]使用clearfix清除浮动

    转载自奶牛博客 .clearfix { *zoom: 1; } .clearfix:before, .clearfix:after { display: table; line-height: 0; ...

  4. clearfix清除浮动进化史

    我想大家在写CSS的时候应该都对清除浮动的用法深有体会,今天我们就还讨论下clearfix的进化史吧. clearfix清除浮动 首先在很多很多年以前我们常用的清除浮动是这样的. .clear{cle ...

  5. clear-fix清除浮动的两种写法

    1. [代码]clearfix 清除浮动 .clearfix:after { content: "."; display: block; height: 0; font-size: ...

  6. css中clearfix清除浮动的用法及其原理示例介绍

    clearfix的定义: .clearfix:after {}{ content: "."; /**//*内容为“.”就是一个英文的句号而已.也可以不写.*/ display: b ...

  7. CSS - clearfix清除浮动

    首先,我们来解释一下为什么要使用 clearfix(清除浮动). 通常我们在写html+css的时候,如果一个父级元素内部的子元素是浮动的(float),那么常会发生父元素不能被子元素正常撑开的情况, ...

  8. clearfix 清除浮动的问题

    今天看一篇博文,发现其实有很多方法实现清除浮动,各有利弊 采用伪类:after进行后续空制的高度位零的伪类层清除 采用CSS overflow:auto的方式撑高 采用CSS overflow:hid ...

  9. ie7 用 clearfix 清除浮动时遇到的问题

    <!doctype html> <html> <head> <style> .fr{float:right;display:inline} li{bor ...

随机推荐

  1. Oracle SQL调优系列之SQL Monitor Report

    @ 目录 1.SQL Monitor简介 2.捕捉sql的前提 3.SQL Monitor 参数设置 4.SQL Monitor Report 4.1.SQL_ID获取 4.2.Text文本格式 4. ...

  2. java中“”==“” equals hashcode的关系

    ava中的数据类型,可分为两类: 1.基本数据类型,也称原始数据类型.byte,short,char,int,long,float,double,boolean 他们之间的比较,应用双等号(==),比 ...

  3. C#数据结构与算法系列(十四):递归——八皇后问题(回溯算法)

    1.介绍 八皇后问题,是一个古老而著名的问题,是回溯算法的经典案例,该问题是国际西洋棋棋手马克斯.贝瑟尔于1848年提出:在8×8格的国际象棋上摆放八个皇后,使其不能互相攻击,即 任意两个皇后都不能处 ...

  4. Git报错信息

    1. 解决办法: 当在最后提交的时候,出现的错误. 解决办法: git remote rm origin 执行下面代码: git remote add origin https://github.co ...

  5. SpringBoot--使用redis实现分布式限流

    1.引入依赖 <!-- 默认就内嵌了Tomcat 容器,如需要更换容器也极其简单--> <dependency> <groupId>org.springframew ...

  6. selenium(12)-web UI自动化项目实战(PO模式,代码封装)

    web UI自动化项目实战-项目 项目使用禅道,所以你需要搭建1个禅道,搭建禅道的方法和步骤见 https://www.cnblogs.com/xinhua19/p/13151296.html 搭建U ...

  7. python 批量重命名文件

    # -*- coding: utf-8 -*- import os import sys def rename(): path = input("路径(例如D:\\\\picture):&q ...

  8. linux简单介绍

    Linux是一套免费使用和自由传播的类Unix操作系统,是一个基于POSIX和UNIX的多用户.多任务.支持多线程和多CPU的操作系统. linux基本思想有两点,1.一切都是文件:2.每个软件有确定 ...

  9. 利用binarySearch实现抽奖计算逻辑

    前言 我们平时抽奖总感觉想抽到最高的奖那么难,哈哈当然不会那么容易啦,正巧写了个抽奖的功能,趁着有时间把抽奖的功能实现整理一下,我们要抽奖首先要定义一个奖品的实体类,这个实体类中包含奖品的基本信息,比 ...

  10. CF1051F The Shortest Statement 题解

    题目 You are given a weighed undirected connected graph, consisting of n vertices and m edges. You sho ...