1.清楚浮动

  父盒子高度为0,子盒子全部定位、浮动。子盒子不会撑开父盒子,下面的盒子会顶上来

  清楚方法:

    clear:both;

    overflow:hidden;

    加空标签

    单/双

  1. //双标签
  2. .clearfix:berore , .clearfix:after {
  3. content:".";
  4. didsplay:table;
  5. }
  6. .fixclear:after{
  7. clear:both;
  8. }
  9. .fixclear{
  10. *zoom:;
  11. }
  1. //单标签
  2. .fixclear:after{
  3. content:"0";
  4. display:block;
  5. height:;
  6. ling-height:;
  7. visibilityhidden;
  8. clear:both;
  9. }
  10. .fixclear{
  11. *zoom:;//兼容IE
  12. }

2.隐藏盒子的物种方法

  1.display:none;  隐藏盒子,不占位置

  2.overflow:hidden;  隐藏溢出部分

  3.visibility:hidden:  隐藏盒子,占位置

  4.opacity:0;  隐藏盒子,占位置(设置透明之后,里面包含的内容也透明)

  5.position-left/top:-999em;  隐藏盒子,不占位置

3.有高度的盒子,子盒子高度超过父盒子高度,父盒子会被撑破;

4.没有高度的盒子,子盒子会撑开父盒子

5.浮动的盒子遮挡不住标准流的文字

6.cursor:pointer;模拟鼠标小手

7.dotted  点线  dashed  虚线

8.层级

  浮动的比标准的高。定位的比浮动的高

  z-index为负值的比标准流的盒子层级低

    

      

前端知识复习一(css)的更多相关文章

  1. 前端知识复习: JS选中变色

    前端知识复习:JS选中变色 上篇文章 :前端知识复习:Html DIV 图文混排(文字放在图片下边) Js选中图片效果 <!DOCTYPE html> <html xmlns=&qu ...

  2. 前端知识复习:Html DIV 图文混排(文字放在图片下边)

    Html知识复习之图文混排 练习练习基础 先上效果图: 废话不多说,直接贴代码: <!DOCTYPE html> <html xmlns="http://www.w3.or ...

  3. 前端知识体系之CSS及其预处理器SASS/LESS

    如果你是个前端设计师,很多时候我们都在写CSS,CSS是定义页面样式的脚本,并不是一种编程语言,只是一行行单纯的描述页面元素的样子,如果对英语熟练的话,它像说话一样简单,这里举个简单的例子: body ...

  4. (原)前端知识杂烩(css系列)

    更新于 20160217 1. css hack .pad{ padding:17px 0 0 17px; /* 普通写法 */ *padding:17px 0 0 17px; /* *为IE7 *+ ...

  5. 前端知识复习二(js)

    JS的作用 页面特效 移动端 异步交互(AJAX) 服务器端开发(node.js) 由ECMAScript和dom(操作网页上的api).bom组成(操作浏览器的部分api) 输出到页面内容 cons ...

  6. 移动端 Web 开发前端知识整理

    文章来源: http://www.restran.net/2015/05/14/mobile-web-front-end-collections/ 最近整理的移动端 Web 开发前端知识,不定期更新. ...

  7. web前端知识体系总结

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  8. Web 前端之HTML和CSS

    Web 前端之HTML和CSS HTML被称为超文本标记语言(Hyper Text Markup Language),它不是一种编程语言,而是一种标记语言,标记语言是一套标记标签,HTML使用标记标签 ...

  9. 自己总结的web前端知识体系大全【欢迎补充】

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

随机推荐

  1. Gentoo解决Udev升级的网卡重命名问题

    问题描述: 配置网络时,很多新手运行ifconfig命令查看网卡时,会发现我们熟悉的eth0网卡没有了,或是发现一些不规则命名的东东,不错,那就是你的网卡. 因为内核升级(忘记具体哪个版本了)从ude ...

  2. 获取 Windows 任务栏 Rect

    获取当前Windows系统的任务栏尺寸 1: RECT rect; 2: HWND hwndTaskbar = FindWindow(TEXT("Shell_TrayWnd"), ...

  3. mariaDB安装完成后设置root密码等初始化操作

    修改root密码1.以root身份在终端登陆(必须)2.输入 mysqladmin -u root -p password ex后面的 ex 是要设置的密码3.回车后出现 Enter password ...

  4. mysql5.6 online ddl—索引

    尝试对mysiam表(1500万)删除索引失败 #uk表字段类型比较简单,都是int/tinyint/timestamp类型. CREATE TABLE `uk` (  `id` int(11) NO ...

  5. mvc的IIS 配置问题 runAllManagedModulesForAllRequests 与 HtmlFileHandler

    runAllManagedModulesForAllRequests 一般设置为false,当为true时所有的资源将进入mvc处理,无疑会给服务器加大压力. 解决办法是时使用HtmlFileHand ...

  6. 杭电OJ分类

    基础题:1000.1001.1004.1005.1008.1012.1013.1014.1017.1019.1021.1028.1029.1032.1037.1040.1048.1056.1058.1 ...

  7. Table隔行变色的JavaScript代码

    <table id="datatable"> <tr> <td>脚本之家</td> </tr> <tr> & ...

  8. hdu_4823_Energy Conversion

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=4823 题意:中文题,很清楚,要注意的是乘起来会爆int 题解: #include<cstdio& ...

  9. LeetCode OJ 337. House Robber III

    The thief has found himself a new place for his thievery again. There is only one entrance to this a ...

  10. Lowest Bit

    Lowest Bit Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other) Total Su ...