前端知识复习一(css)
1.清楚浮动
父盒子高度为0,子盒子全部定位、浮动。子盒子不会撑开父盒子,下面的盒子会顶上来
清楚方法:
clear:both;
overflow:hidden;
加空标签
单/双
//双标签
.clearfix:berore , .clearfix:after {
content:".";
didsplay:table;
}
.fixclear:after{
clear:both;
}
.fixclear{
*zoom:;
}
//单标签
.fixclear:after{
content:"0";
display:block;
height:;
ling-height:;
visibility:hidden;
clear:both;
}
.fixclear{
*zoom:;//兼容IE
}
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)的更多相关文章
- 前端知识复习: JS选中变色
前端知识复习:JS选中变色 上篇文章 :前端知识复习:Html DIV 图文混排(文字放在图片下边) Js选中图片效果 <!DOCTYPE html> <html xmlns=&qu ...
- 前端知识复习:Html DIV 图文混排(文字放在图片下边)
Html知识复习之图文混排 练习练习基础 先上效果图: 废话不多说,直接贴代码: <!DOCTYPE html> <html xmlns="http://www.w3.or ...
- 前端知识体系之CSS及其预处理器SASS/LESS
如果你是个前端设计师,很多时候我们都在写CSS,CSS是定义页面样式的脚本,并不是一种编程语言,只是一行行单纯的描述页面元素的样子,如果对英语熟练的话,它像说话一样简单,这里举个简单的例子: body ...
- (原)前端知识杂烩(css系列)
更新于 20160217 1. css hack .pad{ padding:17px 0 0 17px; /* 普通写法 */ *padding:17px 0 0 17px; /* *为IE7 *+ ...
- 前端知识复习二(js)
JS的作用 页面特效 移动端 异步交互(AJAX) 服务器端开发(node.js) 由ECMAScript和dom(操作网页上的api).bom组成(操作浏览器的部分api) 输出到页面内容 cons ...
- 移动端 Web 开发前端知识整理
文章来源: http://www.restran.net/2015/05/14/mobile-web-front-end-collections/ 最近整理的移动端 Web 开发前端知识,不定期更新. ...
- web前端知识体系总结
1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...
- Web 前端之HTML和CSS
Web 前端之HTML和CSS HTML被称为超文本标记语言(Hyper Text Markup Language),它不是一种编程语言,而是一种标记语言,标记语言是一套标记标签,HTML使用标记标签 ...
- 自己总结的web前端知识体系大全【欢迎补充】
1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...
随机推荐
- 使用计算监控(Using computed observables)
计算监控(Computed Observables) 如果有两个监控属性firstName, lastName,此时我们要显示full name,我们要怎么办呢? 这时,可以创建一个computed ...
- web上传大文件的配置
1.项目本身的webconfig 在<system.web>字段下 <httpRuntime targetFramework="4.5" requestLeng ...
- python基础(三)--列表、元组、字典
一.列表: 有序序列,支持索引.切片.循环(for,while) 元素可以被修改: 元素可以是任何数据类型(数字,字符串,列表,布尔值...),可以嵌套: ##增 1.append(object) ...
- 自定义Button成进度条
ProgressButton源码: package com.example.progressbutton; import android.content.Context; import android ...
- Hadoop上的中文分词与词频统计实践 (有待学习 http://www.cnblogs.com/jiejue/archive/2012/12/16/2820788.html)
解决问题的方案 Hadoop上的中文分词与词频统计实践 首先来推荐相关材料:http://xiaoxia.org/2011/12/18/map-reduce-program-of-rmm-word-c ...
- java代理的深入浅出(二)-CGLIB
java代理的深入浅出(二)-CGLIB 1.基本原理 CGLIB的原理就是生成一个要代理类的子类,子类重写要代理的类的所有不是final的方法.在子类中拦截所有父类方法的调用,拦截下来交给设置的Me ...
- php项目第三季
1.百度浏览器路径写相对路径 2.svn--setting中两个勾去掉,第二页一个勾打上.工程上右击update是更新,commit是提交. 3.Deprecated: mysql_connect() ...
- Eclipse配置--智能补全
定位到:Windows→Preferences→Java→Editor→Content Assist 将Auto Activation triggers for java的默认值“.”修改为" ...
- HDU2537:8球胜负
Problem Description 8球是一种台球竞赛的规则.台面上有7个红球.7个黄球以及一个黑球,当然还有一个白球.对于本题,我们使用如下的简化规则:红.黄两名选手轮流用白球击打各自颜色的球, ...
- 第4章 流程控制----编写Java程序,应用for循环打印菱形
package four; public class fouroneone { public static void main(String args[]){ ;i<=;i+=){ ;kong& ...