![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css布局基础
文甜心
这个作者很懒,什么都没留下…
展开
-
清除浮动的方式
清除浮动的方法原创 2017-02-26 20:15:56 · 204 阅读 · 0 评论 -
浏览器内核
一、各大主流浏览器的内核: 1、IE : Trident内核(众所周知的低版本兼容性问题)。 2、FF : Gecho内核,c++编写,开源,可开发程度很高。 3、Opera : Presto内核,由opera software开发的浏览器排版引擎,在opear7~10中使用,特点是渲染速度的优化达到了极致,是公认的网页浏览速度最快的浏览器内核,然后代价是牺牲了网页的兼容性。本质上是原创 2017-06-15 18:27:11 · 225 阅读 · 0 评论 -
box-sizing属性
content-box:让元素维持W3C的标准盒子模型。即宽高由border、padding、content的宽高决定。简单一点说就是我们定义一个元素的width或者height的时候,不包括元素的padding和borderborder-box:让元素维持IE传统盒子模型。定义一个元素的width或者height的时候,包括了元素的padding和border,改变border和padding原创 2017-06-10 12:21:10 · 229 阅读 · 0 评论 -
如何让height:100%起作用
首先要了解浏览器是如何计算高度和宽度的。 Web浏览器在计算有效宽度时会考虑浏览器窗口的打开宽度。如果你不给宽度设定任何缺省值,那浏览器会自动将页面内容平铺填满整个横向宽度。但是高度的计算就完全不同了,事实上,浏览器根本就不计算内容的高度,除非内容超出了视口(出现滚动条),或者你给父级设定了高度。否则,浏览器就会让内容简单的往下堆砌,页面的高度根本就不会考虑。因为页面并没有缺省的高度值,所以原创 2017-06-21 18:34:06 · 301 阅读 · 0 评论 -
Canvas与SVG的比较
SVG是一种使用XML描述2D图形的语言 基于XML,意味着SVG DOM 中的每个元素都是可用的。您可以为某个元素附加 JavaScript 事件处理器。 在 SVG 中,每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化,那么浏览器能够自动重现图形。 Canvas 通过 JavaScript 来绘制 2D 图形。 Canvas 是逐像素进行渲染的。 在 canvas 中,一原创 2017-06-19 23:15:32 · 448 阅读 · 0 评论 -
DOM与HTML DOM的区别与联系
DOM分为三部分: 1、核心DOM:遍历DOM树、添加新节点、删除节点、修改节点 2、HTML DOM:以一种简便的方法访问DOM树 3、XML DOM:准用于操作XML文档核心DOM与HTML DOM的区别: 核心DOM: 对象:Document/Node/ElementNode/TextNode/AttributeNode/CommentNode/NodeList//核心DOM提供了统原创 2017-06-19 23:10:46 · 2353 阅读 · 0 评论 -
div模拟textarea
核心属性contenteditable=true!.text_box{ width: 400px; min-height: 120px; max-height: 300px; _height: 120px; margin-left: auto;原创 2017-06-06 20:04:15 · 211 阅读 · 0 评论 -
如何居中DIV
水平居中原创 2017-02-26 16:12:44 · 392 阅读 · 0 评论 -
清除浮动(伪元素)
文档结构<div id="container"> <div id="content"></div> <div id="sidebar"></div></div>1.最新的清除浮动(block比table的优势在于不会造成两个container之间的margin塌陷):.container::after { content:""; display:block; cle翻译 2017-03-02 15:53:01 · 450 阅读 · 0 评论 -
三栏式布局
1、绝对定位法 这或许是三种方法里最直观,最容易理解的:左右两栏采用绝对定位,分别固定于页面的左右两侧,中间的主体栏用左右margin值撑开距离。于是实现了三栏自适应布局。绝对定位法下的css代码(不再赘述)HTML代码为: 绝对定位法的HTML代码<div class="container"> <div class="left"></div> <div clas原创 2017-03-02 14:35:03 · 317 阅读 · 0 评论