css模型
外边距：
margin:1px 2px 3px 4px;
上 右 下 左
内边距：
padding:1px 2px 3px 4px;
上 右 下 左
边框不影响内边距的内容
width height指的是内容区域的width height
浮动：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
/*在此定义相应的类选择器，并根据要求设置相关CSS属性*/
/*------法一
.mainBox{width:960px;
height:300px;
background-color:#cff;
clear:left;}
------*/
/*------法二------*/
.mainBox{width:960px;
background-color:#CFF;
overflow:hidden;
*zoom:1;}
.lBox{width:740px;
height:300px;
background-color:#c9f;
float:left;}
.rBox{width:210px;
height:300px;
background-color:#fcf;
float:right;}
/*------总结：常用的清除浮动的方法。
1、使用空标签清除浮动。我用了很久的一种方法，空标签可以是div标签，也可以是P标签。我习惯用<P>，够简短，也有很多人用<hr>，只是需要另外 为其清除边框，但理论上可以是任何标签。这种方式是在需要清除浮动的父级元素内部的所有浮动元素后添加这样一个标签清除浮动，并为其定义CSS代 码：clear:both。此方法的弊端在于增加了无意义的结构元素。
对于使用额外标签清除浮动（闭合浮动元素），是W3C推荐的 做法。至于使用<br />元素还是空<div></div>可以根据自己的喜好来选（当然你也可以使用其它块级元素）。不过要注意的 是，<br />本身是有表现的，它会多出一个换行出来，所以要设定它的heigh为0，以隐藏它的表现。所以大多数情况下使用空<div>比较合 适。
2、使用overflow属性。此方法有效地解决了通过空标签元素清除浮动而不得不增加无意代码的弊端。使用该方法是只需在需要清除浮动的元素中定义CSS属性：overflow:auto，即可！”zoom:1″用于兼容IE6,也可以用width:100%。
不过使用overflow的时候，可能会对页面表现带来影响，而且这种影响是不确定的，你最好是能在多个浏览器上测试你的页面；
3、使用after伪对象清除浮动。 该方法只适用于非IE浏览器 。具体写法可参照以下示例。使用中需注意以下几点。一、该方法中必须为需要清除浮动元素的伪对象中设置height:0，否则该元素会比实际高出若干像 素；二、content属性是必须的，但其值可以为空，蓝色理想讨论该方法的时候content属性的值设为”.”，但我发现为空亦是可以的。
此三种方法各有利弊，使用时应择优选择，个人习惯于第一种，比较稳定可靠。
参考链接：http://www.cnblogs.com/fengzheng126/archive/2012/05/19/2508778.html
------*/
</style>
</head>
<body>
<!--在此添加相应的div标签-->
<div class="mainBox">
<div class="lBox"></div>
<div class="rBox"></div>
</div>
</body>
</html>
css模型的更多相关文章
- 来谈谈你对CSS盒模型的认识？
任何一个网页的搭建都离不开盒模型的堆砌.应该说css模型是web的一个根基,最后呈现出来的效果不同无非就是在高宽.内容与背景删的区别而已. 那么CSS模型有什么认识的呢? 首先,css盒模型有几种呢? ...
- 2 CSS盒子模型&边框&轮廓&外边距&填充&分组嵌套&尺寸&display与visibility
盒子模型 Box Model 所有HTML元素可以看做盒子,CSS模型本质上是一个盒子,封装周围的HTML元素 包括:边距,边框,填充和实际内容 盒子模型允许我们在其他元素和周围元素边框之间的空间放 ...
- css 简析folat
1.float?? 不知道大家是否还记得之前我们讲过页面是文档流,具体什么是文档流,我就不说了?于是我们页面布局如果用div的话,那么块状的元素是怎么排列的,什么叫块状自己去看? 如果我们呢用div布 ...
- 让css初学者抓狂的属性float
挣扎了好久,始终没有决定要不要写博客,心里有几个顾虑一是我是小白,我写的文章有没有人看?二是我是小白,我写的文章假如存在诸多错误,理解的不对发表上去再去误导别人.三是写一篇文章费时费力.但是我现在想明 ...
- [css] line boxes
原文链接:http://www.zhangxinxu.com/wordpress/2010/01/css-float%E6%B5%AE%E5%8A%A8%E7%9A%84%E6%B7%B1%E5%85 ...
- 2015第10周五CSS—2
经常遇到的浏览器兼容性有哪些?如何解决? 1.浏览器默认的margin和padding不同.解决方案是加一个全局的*{margin:0;padding:0;}来统一. 2.IE6双边距bug:块属性标 ...
- ReactNative学习之css样式使用
前言: 前面学习了html,今天学习一下css的基本使用,看下html与css之间是如何结合来编写前端网页的. CSS 是什么? CSS 是 Cascading Style Sheets(级联样式表) ...
- Webkit内核探究【2】——Webkit CSS实现
注:[转载请注明文章来源.保持原样] 出处:http://www.cnblogs.com/jyli/archive/2010/01/31/1660364.html 作者:李嘉昱 CSS在Webkit中 ...
- Webkit内核探究【2】——css简介
注:[转载请注明文章来源.保持原样] 出处:http://www.cnblogs.com/jyli/archive/2010/01/31/1660364.html 作者:李嘉昱 CSS在Webkit中 ...
随机推荐
- 一致性哈希算法-----> 解决memecache 服务器扩容后的数据丢失。
1 基本场景 比如你有 N 个 cache 服务器(后面简称 cache ),那么如何将一个对象 object 映射到 N 个 cache 上呢,你很可能会采用类似下面的通用方法计算 object 的 ...
- Topcoder SRM 657DIV2
前言: 像我这样一直在DIV2的弱菜..不知道说什么了. A:一定判断有8个‘R’,每行 每列只有一个 B题:大概是 int E,int EM,int M,int MH,int H 然后EM可以给值 ...
- jq自定义裁剪，代码超级简单，易修改
1.自定义宽高效果 1.html 代码 index.html <!DOCTYPE html> <html lang="en"> <head> ...
- maven打包时的三方包的选择顺序
在一个项目有多个模块引用多个版本的某个插件(或者叫三方包.jar包等)时,如何解决版本冲突问题?最终选用某个版本还是选择几个版本? maven在遇到上面的情况时,会智能处理版本冲突,最终选择一个版本, ...
- 深度学习综述（LeCun、Bengio和Hinton）
原文摘要:深度学习可以让那些拥有多个处理层的计算模型来学习具有多层次抽象的数据的表示.这些方法在很多方面都带来了显著的改善,包含最先进的语音识别.视觉对象识别.对象检測和很多其他领域,比如药物发现和基 ...
- Design Pattern Visitor 訪问者设计模式
訪问者设计模式是已经有了一组Person对象了,然后不同的訪问者訪问这组对象.会有不同效果. 这些訪问者实际上就是一个能够让Person对象组运行的动作行为等. 至于这些Person对象是怎样运行这些 ...
- 【APUE】线程与信号
每个线程都有自己的信号屏蔽字,但是信号的处理是进程中所有线程共享的.进程中的信号是递送到单个线程的. 线程中pthread_sigmask函数类似与进程的sigprocmask函数,可以用来阻塞信号. ...
- linux动态库的种种要点
linux下使用动态库,基本用起来还是非常easy.但假设我们的程序中大量使用动态库来实现各种框架/插件,那么就会遇到一些坑,掌握这些坑才有利于程序更稳健地执行. 本篇先谈谈动态库符号方面的问题. 測 ...
- Linux下怎么添加和查看PATH环境变量
linux下查看和添加PATH环境变量来自:http://apps.hi.baidu.com/share/detail/32942984 $PATH:决定了shell将到哪些目录中寻找命令或程序,PA ...
- Cocos2dx 小技巧（十三）聊聊坐标系
一好友考上了空姐.她说:以后基本上不会回来了.等下次见面时请叫我白富美!尽管有点羡慕.但我依然不甘示弱回复:下次见面时请叫我高富帅! 未来,谁说得准呢? ------------------有段时间没 ...