CSS
High_Mount
这个作者很懒,什么都没留下…
展开
-
CSS2快速参考
自W3C(The World Wide Web Consortium)制定了代号为Cougar的HTML的4.0版本以来,存在在Web页面中的动态效果首次被正式的承认了,W3C把动态超文本(Dynamic HTML)的实现分为了三个部分:脚本、支持动态效果的浏览器和CSS。前两者也许你经常用到,但CSS是什么或许你并不清楚,如果有过制作Web页面的经历,你可能听说过样式单或风格单,如果对此你转载 2007-08-30 17:29:00 · 1202 阅读 · 0 评论 -
display:inline-block
在使用CSS实现表现的时候,会经常接触到display:inline-block这一属性,无论是初接触Web标准还是接触标准已久的朋友,大都会对这一属性感觉很迷惑和模糊。display:inline-block引用:将对象呈递为内联对象,但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内,允许空格。但对于这个属性不是所有浏览器都识别。支持的浏览器有:Opera、Safa转载 2008-05-13 14:14:00 · 1020 阅读 · 5 评论 -
inline-block从入门到精通
首先先对行内元素(inline elements,比如span,a,b等。)和块元素(block elements,比如div,h1,p等)进行一下知识回顾.简而言之,它们的区别可以分为下几点 块元素会自动在末尾加一个换行,而行内元素不会。 块元素可以定义自身的高度(width)和宽度(height),而行内元素不可以。 块对象定义的自身垂直边距可以改变行高,转载 2008-05-15 16:29:00 · 1069 阅读 · 2 评论 -
CSS Hacks / Conditional Comments For IE
浏览器一多,问题就多,现在IE7也出来,我又多了一个要考虑的浏览器IE7与IE6相比还是有很大的区别的,跟FF也有不一样的地方在这里先不讲有哪些区别,主要来讲如何解决这些问题放在以前都是用CSS Hack来解决IE6以下(包括IE^)以及Firefox(下面简称FF)的问题例:div.content {width:300px !important; //大部分支持!important标记的浏览转载 2008-05-12 22:47:00 · 867 阅读 · 0 评论 -
IE条件注释参考
[非原创, 网摘]条件注释,就是判断浏览器类型,然后定义什么浏览器下显示什么内容。 条件注释是在IE5.0/Win以后才被IE支持的,一般用于hack。 IE条件注释的优秀的区分浏览器的能力,让很多设计师用于hack,解决浏览器对CSS解析的不同。 基本例子: 仅IE可见仅IE 5.0可见 参数属性: gt : greater than,选择条件版本以上版本,不包含条件版本lt : less转载 2008-05-12 22:24:00 · 980 阅读 · 0 评论 -
未知高度的非表格垂直对齐
非已知高度的垂直对齐的条件: 表格单元格 行内块(inline-block) 第一个比较好理解,第二个很多人可能会忽略。比如,很多人在图片与文本混排的时候想让图片相对于文本垂直居中除了用IE的私有特性 valign="absmiddle"别无他法。记住,默认下图片就是属于inline-block,你只需简单的img {vertical-align:middle;}转载 2008-05-15 10:33:00 · 788 阅读 · 0 评论 -
IE6.O下使用iframe出现横向滚动条问题
IES MOMENTARY LAPSE OF REASON:The reason this occurs is because when you set the width of the iframe, the body of the included page inherits that width. So if the iframe has its width set to 400px,转载 2008-07-04 09:21:00 · 3309 阅读 · 1 评论 -
CSS定位的原理
把浏览器窗口想象成一个坐标系统:CSS定位的原理是:你可以将任何盒子(box)放置在坐标系统的任何位置上。采用CSS定位技术来放置元素是非常精确的。相对于使用表格、透明图像或其他方法而言,CSS定位要简单得多。 绝对定位一个采用绝对定位的元素不获得任何空间。这意味着:该元素在被定位后不会留下空位。要对元素进行绝对定位,应将position属性的值设为absolute。接着,你可转载 2008-07-07 10:56:00 · 2253 阅读 · 0 评论 -
使用CSS完美实现垂直居中的方法
使用XHTML+CSS来实现元素的垂直居中一直是前端开发中的一个比较复杂且棘手的问题,作为网页设计师或前端开发工程师,这个垂直居中问题也是必须掌握的技巧之一,一些互联网公司面试题中也会出现这类题目。今天暴风彬彬将分享一个完美通过CSS实现垂直居中的方法,该方法是由aka Yuhů发明的,这个方法也是目前暴风彬彬觉得最完美最简洁的CSS垂直居中实现方法。下面来看看暴风彬彬曾经总结的笔记,大家有不同转载 2009-09-25 13:23:00 · 778 阅读 · 0 评论 -
IE6,7,8,FF css hack
CSS兼容性一直是大家头疼的问题,IE6、IE7和FF已经让大家够呛。今天向大家介绍IE8的CSS hack。不再讲废话,来(以下的IE8均指IE8正式版,版本号:8.0.6001.18702):w.52css.com] "/9" 例:"margin:0px auto/9;".这里的"/9"可以区别所有IE和FireFox."*" IE6、IE7可以识别.IE8、FireFox不能."_" IE6转载 2009-09-25 10:13:00 · 2383 阅读 · 3 评论 -
盒型详解及不同浏览器兼容
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offsetWidth (包括边线的宽);网页可见区域高: document.body.offsetHeight (包括边线的宽);网页正文全文宽: document.body.scrollW转载 2009-12-29 16:16:00 · 788 阅读 · 0 评论 -
Image Label Focus Bug
Image Label Focus Bug转载 2010-06-17 11:05:00 · 1017 阅读 · 0 评论 -
10个技巧帮你搞定IE 6
10个技巧帮你搞定IE 6转载 2010-06-17 10:51:00 · 723 阅读 · 0 评论 -
IE6 position:fixed bug (固定窗口方法)
IE6 position:fixed bug (固定窗口方法)转载 2010-06-17 09:40:00 · 715 阅读 · 0 评论 -
javascript css 合并压缩SquishIt – The Friendly ASP.NET JavaScript and CSS Squisher
I’ve received more feedback via e-mail on SquishIt than on pretty much any other post or project I’ve ever worked on in the past. I apprecia转载 2011-08-23 14:09:26 · 1232 阅读 · 0 评论 -
IE7、IE8、IE9、IE10后各版本的更新及差别
在程序员的眼里,万恶的IE6的结束对他们而言是一种解脱,IE7首次开始完整支持W3C标准,从此之后IE的标准化之路就开始越走越顺,以下总结了IE7以后各版本的更新内容,和各版本的差别,作为Web开发人员解决浏览器兼容性问题的参考。IE7更新解决了IE6的一个float bug,见 http://www.positioniseverything.net/explorer/peekaboo转载 2011-11-24 15:39:39 · 1942 阅读 · 0 评论 -
纯CSS在线气泡提示生成工具 - CSS ARROW PLEASE!
互联网拥有很多免费的工具和应用,几乎可以帮助你实现任何你需要的UI组件和设计,大家还记得上周我们介绍的纯CSS实现的气泡式提示文章吗?今天我们将介绍一个在线的生成气泡式提示的web工具 -CSS ARROW PLEASE,希望大家喜欢!主要特性设置气泡提示位置(上下左右)提示尺寸大小文字颜色边框大小和尺寸边框颜色自动生成css代码生成代码.arrow_box {转载 2012-06-08 09:18:17 · 2806 阅读 · 0 评论 -
IE7的CSS兼容性
IE7的CSS兼容性:毫无疑问的是微软发布IE7不仅仅是出了安全方面的考量, IE6错综复杂的BUG是各位网站主的梦魇, 也是微软的心头之痛, IE7在css的支持方面绝对是比IE6有了长足的进步, 但和Firefox相比, 还是有一段距离. 微软到底是向W3C屈服了.所以, 如果你的网站CSS满足以下条件, 可以说IE7会把你的网站渲染得很好:1. 你的网站在IE6下表现正常;2转载 2008-05-11 15:26:00 · 5186 阅读 · 0 评论 -
属性篇(4)—If you love css …
本文作为属性篇的最后一篇文章, 将讲述HTML和CSS的关键—盒子模型(Box model). 理解Box model的关键便是margin和padding属性, 而正确理解这两个属性也是学习用css布局的关键.注: 为什么不翻译margin和padding? 原因一, 在汉语中并没有与之相对应的词语; 原因二: 即使有这样的词语, 由于在编写css代码时, 必须使用margin和paddin转载 2008-05-09 15:21:00 · 1020 阅读 · 4 评论 -
属性篇(2)—If you love css …
上次主要说明了css对于颜色和文本属性的控制, 这次介绍css对于字体, 背景等属性的控制.字体(Font):css控制的字体属性包括font-family, font-style, font-variant, font-weight, font-size.1.font-family: 由字体名(family-names)和字组名(generic families)两个部分组成.首先来看个转载 2008-05-09 11:57:00 · 755 阅读 · 0 评论 -
CSS 属性
有时我们还希望能够在特定的范围内使样式单生效: p em {color:red} 元素标记间又空格隔开,表示在和间的、用红色表示。 另外还可以利用“~”表示一个选择器后面紧跟另一个选择器,并且两边以“/”围住: / Selector1 ~ Selec原创 2007-08-30 17:38:00 · 940 阅读 · 0 评论 -
CSS中的滑动门技术
原文作者:Douglas Bowman 原文出自:A List Apart 中文翻译:54player.com nobita 版权说明:本文中文翻译版权归译者54player.com nobita所有。需要转载发表的,请先与作者联系 在CSS中,一个经常被人们讨论的先进之处即背景图像的可层叠性,并允许他们在彼此之上进行滑动,以创造一些特殊的效果。根据CSS2.0当前的规定,每一个背景图像都需要转载 2007-06-01 11:53:00 · 916 阅读 · 0 评论 -
Css的filter常用滤波器属性及语句大全
现在非常多的朋友搞个人网页,而且做的五彩缤纷,各有特色,但是比较多的朋友把大大的一幅图象放在页面上,致使页面下载很慢,加上用GIF格式做动画,尽管用GIF格式搞的动画比较苗条,但是也不大合算。能否不用特别做的图象,不用GIF格式做动画,可以把页面搞的生气活现呢?可以,但JAVASCRIPT比较对一般初学转载 2007-09-04 14:56:00 · 1073 阅读 · 0 评论 -
CSS总结
1、使内容居中的方法:(1) html,body { margin:0px; padding:0px; text-align:center; } 然后,让内容: #header{ width:800px; height:73px; margin:0 auto; /*这句是关键点*/ padding:0px; text-align:cente原创 2007-09-05 15:31:00 · 886 阅读 · 0 评论 -
XHTML 和 DOCTYPE 切换(MSDN)
使用 Web 标准生成 ASP.NET 2.0 Web 站点XHTML 和 DOCTYPE 切换为 Web页指定 DOCTYPE 会影响浏览器呈现页的方式。Internet Explorer、Mozilla Firefox 和 Opera 全都支持一种名为“DOCTYPE 切换”(也叫“DOCTYPE 嗅探”)的功能。引入 DOCTYPE 切换的目的是使浏览器能够正确地呈现符合标准转载 2007-06-20 09:21:00 · 1918 阅读 · 0 评论 -
新的文档类型定义模型带来的问题--javascirpt/CSS
1、document.body.scrollTop一直为0 IE6 and DTD 4.01 requires you to use document.documentElement in stead of document.body, so u will need somthing like the below:if (document.documentElement && !docu转载 2007-06-19 17:46:00 · 1075 阅读 · 0 评论 -
Modified SBMH (Simplified Box Model Hack)
Modified SBMH (Simplified Box Model Hack)The technique discussed here is a modification of the Simplified Box Model Hack. As with the SBMH this variant is intended to provide IE5.x/Win and it alone转载 2007-06-16 12:30:00 · 4993 阅读 · 0 评论 -
ul列表中包含input时line-height属性失效的解决办法
为什么列表含控件时,行高属性在IE6.0下失效?FF2.0下正常。这是一个不常见的问题,我们不提倡这样的布局方式,input元素尽可能的使用lable标签而不是包含于ul的li标签中。但在实际操作中,也可能存在这样的情况,我们就ul列表中包含input时line-height属性失效的问题作一些探讨。 我们知道input标签是一个block元素,也就是一个块元素,而line-height只可以应转载 2008-02-24 21:12:00 · 2939 阅读 · 0 评论 -
CSS兼容IE6,IE7和FF的总结
CSS hack:针对IE6,IE7,firefox显示不同效果做网站时经常会用到,衡量一个DIV+CSS架构师的水平时,这个也很重要。区别不同浏览器的CSS hack写法: 区别IE6与FF: background:orange;*background:blue; 区别IE6与IE7: background:green !important;bac转载 2008-04-13 17:55:00 · 1091 阅读 · 4 评论 -
管理好自己的样式
学习WEB标准的朋友一般都是从学习CSS开始,为什么呢?因为CSS是一种很有意思的语言,它能让我们的网页千变万化。也许我们一开始的接触只是因为链接的样式修改,然后慢慢发现CSS的强大而又简单,于是我们用它来控制整个网页的布局、排版、色彩、图片等等工作。学习了CSS之后我们又会发现XHTML的结构更为重要,一个好的XHTML结构可以让CSS少费很多事。同时也会避免网页在不同浏览器之间的差异。于是又开转载 2008-04-13 21:37:00 · 798 阅读 · 0 评论 -
理解position:relative 与 position:absolute
position 有三个值,static(静态)、relative(相对)、absolute(绝对);由于static是所有页面元素的默认值,因此设置元素的定位类型时几乎不用这个值,除非用于覆盖之前的定义。对于后两者,一般应用:在一个相对定位的元素里面放置一个绝对定位的元素,如图: 子元素B可以通过top、right、bottom、left来精确定位,定位的参考目标就是其具有相对定位属性的父级元转载 2008-07-07 16:01:00 · 3544 阅读 · 0 评论 -
position:relative/absolute无法冲破的等级
前段时间记得好像是谁在群里提出了一个实在是让大家都觉得很不理解的一个问题: 第一块 第二块 第三块 第四块 第五块 如果我我们设定LI为position:relative;设置span为position:absolute;那么我们会发现无论SPAN的z-index值设置得再高都将永远在后面父级的下面。转载 2008-07-07 13:02:00 · 1360 阅读 · 0 评论 -
布局篇(1)—If you love css …
从本篇开始讲述如何用css实现网页的布局,即如何用css控制网页内各个元素的显示位置。如果你是一个初学者,很可能觉得做一个网页的第一步就是布局。其实不然,css网页的设计过程可以参考分为以下几步:平面设计—>页面切割—>布局—>细节控制1. 平面设计是一个网页的精髓所在,读者直接面对的界面,在本站以后的文章中会涉及此方面内容。也许你会认为在脑子里形成一个网站的大概印象就可以了,那么这种想法转载 2008-05-07 16:25:00 · 928 阅读 · 2 评论 -
布局篇(2)—If you love css …
上篇讲的布局(切割)方法相信大家己经掌握,其特点是用固定宽度(fixed-width)来实现页面内各个元素的显示效果,简单实用,易于掌握。本篇将讲述其他相对高级的布局方法。布局的分类,根据对元素宽度的定义不同,布局可分为以下几种:1. 固定宽度(fixed-width)布局:即上一篇所用到的布局方法,其特点是主要DIV的宽度都是用固定大小的px值定义的,其宽度不随浏览器及字体大小的影响。多转载 2008-05-07 16:53:00 · 839 阅读 · 1 评论 -
em和px
在这系列视觉设计的文章间隙插一篇字体单位的文章。前文说了,字体单位应该用em而不用px,原因简单来说就是支持IE6下的字体缩放,在页面中按ctrl+滚轮,字体以px为单位的网站没有反应。px是绝对单位,不支持IE的缩放,em是相对单位。我在调整本blog的时候,发现不仅仅是字体,将行距(line-height),和纵向高度的单位都用em。保证缩放时候的整体性。怎么将px换成em呢?特地转jo转载 2008-05-07 12:57:00 · 714 阅读 · 0 评论 -
属性篇(3)—If you love css …
本篇主要介绍css对边框(border)的属性控制和链接(link)的伪类选择器.边框(border): css控制的边框属性包括border-width, border-color, border-style. Border之所以让人很困惑主要源于IE5错综复杂的BUG, 由于IE5是一个”will soon be dead“ 的浏览器, 这里只例举一个最为知名的关于border-wid转载 2008-05-09 12:55:00 · 667 阅读 · 1 评论 -
Button的UseSubmitBehavior屬性
前章 前段时间碰到button控件的一个属性问题UseSubmitBehavior。在MSDN上查看,UseSubmitBehavior 属性时,有这样一句话“获取或设置一个布尔值,该值指示 Button 控件使用客户端浏览器的提交机制还是 ASP.NET 回发机制。 ”" 默认情况下,此属性的值为 true ,从而导致 Button 控件使用浏览器的提交机制。如果指定为转载 2012-10-08 16:27:13 · 4297 阅读 · 1 评论