标签归档:CSS

手机端固定定位元素不可点击问题处理_mobile fixed element can not click issue

在安卓手机若一个div设置了固定定位,在给其隐藏后再控制让其显示,会出现不可点击 … 继续阅读

发表在 CSS & HTML, javascript & Ajax, 移动端开发 | 标签为 , , , , , , | 留下评论

IE下overflow:hidden 失效解决方法

在父元素上加上position:relative; 继续阅读

发表在 CSS & HTML | 标签为 , | 2 条评论

CSS2技术讲解_Margin、Padding and Border

Padding 指的是内容和内容边距之间的空间
Border指的是在方框每一边上的直线
Margin指的是一个标签和另一个标签间的间隔
Margin 和 padding的快捷设定
margin:0 5px 5px 5px ;
padding: 5px 5px 5px 5px;其顺序是:top right bottom left 等同于padding:5px;
若css属性上值为0;则可以简写,如 margin:0;
Margin:0 2em;指的是top和bottom为0;left和right为2em; 继续阅读

发表在 CSS & HTML | 标签为 | 留下评论

CSS2技术讲解_伪类和伪元素(Pseudo–classes and Pseudo-Elements)

a:link 未使用的链接(a)
a:visted 已经点击过的链接
a:hover 鼠标滑过时改变链接的效果
a:active 点击时展示链接效果 继续阅读

发表在 CSS & HTML | 标签为 | 留下评论

CSS2技术讲解_HTML族谱(Family Tree)

关键词:祖先,派生,父标签,子标签,同胞标签
祖先:一个标签A包含了另一个标签B,那么A是B的祖先,标签是所有标签的祖先。
派生:在一个或是更多标签内部的标签就是一个派生标签,图中是派生标签。 继续阅读

发表在 CSS & HTML | 标签为 | 留下评论

CSS2技术讲解_ID选择器与类(ID Selector And Class)

id选择器,我们从另一个方面思考,它和数据库表里面的主键是同一个作用,唯一标示,所以id是唯一的.
对于class我们可以联想到java中的类,对于同样的功能,我们使用或继承同一个类就可以了,不需要编写新的类,css中的class也是如此,同样的样式用同一个class实现。 继续阅读

发表在 CSS & HTML | 标签为 | 留下评论

CSS2技术讲解_DIV 和SPAN(Div And Span)

我们使用div对页面进行分割,使用span包含某一两个文字或者一段话。事实上,div实现了页面的布局,它来主持着页面的全局,而span对其中各个细微的地方进行修饰。 继续阅读

发表在 CSS & HTML | 标签为 | 留下评论

CSS2技术讲解_样式(Style)

一个样式实际上有两个部分组成,要进行设置的网页元素(选择器)和格式化指令(声明块)。
我们要对任何一个页面的元素进行样式的设定,这时选择器使得我们能够选定该元素,而再者就是对它的各个属性进行设定,实际上我们没有设定前它使用的是html默认样式。 继续阅读

发表在 CSS & HTML | 标签为 | 留下评论

CSS2技术讲解_前言

我眼中的CSS
web领域是由统一的标记语言来进行推动和发展的,今天,w3c为我们定义了统一的html格式,并且我们可以通过css对页面元素的展现进行控制,所以学习css最终的目的是:1.使得页面更美观 2.让代码更简洁直观
css2技术讲解里面加入了很多个人的一些看法和技术经验,并会实时的进行修改和更新,欢迎读者多多批评指点^_^ 继续阅读

发表在 CSS & HTML | 标签为 | 留下评论

css3 gradient 渐变透明设置

background-image:         linear-gradient(left,rgba(255,255,255,0),#E1D9CD);}
这里用rgba颜色来设置颜色透明度,linear-gradient(left,rgba(255,255,255,0) 10%,#E1D9CD 10%);在颜色后面带上百分比来设置改颜色算占的比例 继续阅读

发表在 CSS & HTML | 标签为 , | 留下评论

CSS响应式设计iPad专有CSS3_CSS Responsive design iPad-Specific CSS3

摘自:http://css-tricks.com/snippets/css/ipad-specific-css/在做响应式设计的时候个人兼容性css代码则将下面ipad兼容代码加入:@media only screen and (device-width: 768px) { /* For general iPad layouts */} 继续阅读

发表在 CSS & HTML | 标签为 , , | 留下评论

Rain CSS框架基础类名简写_Use abbreviation class name in Rain CSS Framework

一直以来都有一个问题,rain css框架的类名过长,导致页面的class内容特别多,如:
现在个人将所有长类名增加了一个缩写,页面class内容长度大大缩短: 继续阅读

发表在 CSS & HTML | 标签为 , , , | 留下评论

CSS2中可视化格式模型的细节_Visual formatting model details in CSS2

10.1 包含块的定义 Definition of “containing block”
一个元素的框的尺寸和位置的计算有时相对于某个特定的长方形,称为该元素的包含块。一个元素的包含块的定义如下:
在根元素存在的包含块是一个矩形称作初始包含块.对于连续媒体,它具有视口的尺寸并且其锚在canvas的原点;它是分页媒体的页面区域.初始包含块的’direction’属性和根元素一样.
对于其它元素,如果元素的位置是’relative’ 或者 ‘static’,包含块由最近的块容器的祖先盒子的内容边界形成.
如果元素设置了’position: fixed’,在连续媒体或者页面区域在分页媒体这两种情况下包含块由视口创建.
如果元素设置了’position: absolute’,包含块由最近’position’是’absolute’, ‘relative’ 或者 ‘fixed’的祖先创建,方式如下 继续阅读

发表在 CSS & HTML | 标签为 , , | 留下评论

CSS3 2D和3D矩阵的原理_CSS3 2D and 3D matrix

2d的变形:
-webkit-transform: matrix3d(1, 0, 0, 1);
这里的(1, 0, 0, 1)是两个向量a(1,0) b(0,1),向量a是x轴方向上的,向量b是y轴方向上的.向量值的变化使得图形在方向和大小上有所改变. 继续阅读

发表在 CSS & HTML | 标签为 , , | 留下评论

CSS2中的可视化格式模型(2)_Visual fomatting model in CSS2(2)

9.7 ‘display’,'position’和’float’间的相互关系 Relationships between ‘display’, ‘position’, and ‘float’

影响盒子的生成和布局的三个属性——’display’,'position’和’float’——间的相互关系如下:

如果’display’值为’none’,那么’position’和’float’无效,元素不生成盒子.
否则,如果’postion’值为’absolute’或者’fixed’,盒子绝对地定位’float’计算的值为’none’,并且 display根据下面的表格进行设定.盒子的位置由’top’, ‘right’, ‘bottom’和’left’属性和包含块决定.
否则,如果’float’的值不是’none’,该盒子是浮动的,且’display’值根据下面的表格进行设定.
否则,如果元素是根元素,’display’值根据下面的表格进行设定,除了其在CSS2.1里面没有定义是否’list-item’的指定值成为’block’或者’list-item’计算值.
否则,应用指定的其它’display’属性. 继续阅读

发表在 CSS & HTML | 标签为 , , | 5 条评论