CSS
maomaolaoshi
每天进步一点点~
展开
-
块格式化上下文(BlockFormattingContext)
原文地址:http://www.cnblogs.com/elcarim5efil/p/4745796.html原文地址中有些图片不能正确显示了,在转载的地址还能够正确浏览图片。其他转载:http://web.jobbole.com/83274/转载 2017-08-19 15:02:54 · 242 阅读 · 0 评论 -
如何让boostrap的栅栏系统高度不坍塌
方法一(让内部div获取高度):height:0px;padding-bottom:100%方法二(让内部div获取高度,同时垂直居中。):height:0px;padding:50% 0;原创 2017-12-06 10:07:47 · 714 阅读 · 0 评论 -
为什么img标签高度显示不正常?
在一个div里面添加了一个img标签,img大小为80*80px,外边距为20px。但是img标签的位置显示的却不正确。浏览器对替换元素(行内块级元素)有一个默认3px或者4px空白,这个空白是造成img标签高度异常的原因。原创 2017-08-31 18:28:34 · 4003 阅读 · 0 评论 -
如何控制html中字符字体的宽度?
在盒子模型(二)——line box中我曾经说过,字符字体是没办法直接设置width的。 不过我们还有其他方法来控制字符字体的宽度。单个字符字体的宽度 单个字符字体的宽度只受font-size属性影响。font-size<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>单个字符字体的宽度原创 2017-09-09 00:00:38 · 17811 阅读 · 0 评论 -
盒子模型(二)——line box
在详细的介绍line box之前,我们先来了解两个概念:替换元素和非替换元素。替换元素 替换元素是浏览器根据其标签的元素与属性来判断显示具体的内容。 比如:<input type="text" /> ,这是一个文本输入框,当type是其他值的时候,浏览器显示就不一样 (X)HTML中的<img>、<input>、<textarea>、<select>、<object>都是替换元素,这些元素都没原创 2017-08-28 21:03:07 · 1738 阅读 · 1 评论 -
圣杯布局和双飞翼布局
圣杯布局和双飞翼布局解决的问题是一样的,就是两边顶宽,中间自适应的三栏布局,中间栏要在放在文档流前面以优先渲染。看了很多文章,发现有一篇文章的思路是最清晰的,所以专门转载一下: http://www.jianshu.com/p/f9bcddb0e8b4上述文章采用了圣杯布局: 即使用padding+position:relative的方式,配合right和left属性,防止中间div内容不被遮挡转载 2017-08-30 20:18:04 · 363 阅读 · 0 评论 -
字体垂直居中的几种实现方法
这几天遇到了好多关于字体垂直居中的问题,整理一下,希望对大家也有帮助。vertical-align:middle vertical-align 用来指定行内元素(inline)和行内块级元素(inline-block)或表格单元格(table-cell)元素的垂直对齐方式。inline和inline-block对于行内元素和行内块级元素,vertical-align对middle的处理方式都是原创 2017-09-13 18:00:03 · 40721 阅读 · 0 评论 -
CSS选择器权重计算规则
优先级就是分配给指定的CSS声明的一个权重,它由 匹配的选择器中的 每一种选择器类型的 数值 决定。而当优先级与多个CSS声明中任意一个声明的优先级相等的时候,CSS中最后的那个声明将会被应用到元素上。当同一个元素有多个声明的时候,优先级才会有意义。因为每一个直接作用于元素的CSS规则总是会接管/覆盖(take over)该元素从祖先元素继承而来的规则。选择器类型选择器可以分成几个大类转载 2017-08-23 17:09:52 · 999 阅读 · 0 评论 -
盒子模型(一)——block box
盒子模型作为CSS的一个重中之重,被大众所熟知。但是我们平时讨论的盒子模型更多的是块级盒子(block box),其实还有一种盒子模型叫做行级盒子(line box),行级盒子我将在下一篇文章中讲述。盒子模型这就是我们所熟悉的盒子模型,包含了margin(外边距)、border(边框)、padding(内边距)、content(内容)。Margin(外边距) - 清除边框区域。Margin没有背景原创 2017-08-26 13:51:18 · 1708 阅读 · 0 评论 -
关于CSS的布局的一些想法与建议
前言前段时间做了创匠科技官网的自适应网页,在编写过程中收益良多。之后又参与了公司的PC收银台的开发,对其中CSS的修改痛苦不已。痛定思痛,参考了阮一峰老师的《深入理解bootstrap》一书,总结出一些关于CSS布局的想法与建议。CSS框架的设计基本思想CSS使用的基本理论就是一个A/O模式。 A即append,添加; O即overwrite,覆写; 通过添加来逐步增加样式,原创 2018-01-05 19:39:16 · 437 阅读 · 0 评论