css
文章平均质量分 87
iteye_15118
这个作者很懒,什么都没留下…
展开
-
Adobe CS5全套软件官方下载地址(简体中文完整版)
CS5的简繁韩独立安装包:~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~Adobe Photoshop CS5 Extended 官方简体中文版下载http://trials2.stage.adobe.com/AdobeProducts/PHSP/12/win32/Photoshop_12_LS3.7zhttp://trials2.stage.a...原创 2010-10-22 10:34:01 · 2601 阅读 · 0 评论 -
负边距(negative margin)的相关问题整理
负边距(negative margin)在页面制作过程中,有许多妙用,用的好了能让原本复杂的问题变的简单,本文是针对负边距相关问题的整理,欢迎各位补充。负边距的使用非常简单:1234567891011121314151617<style type="text/css">/*...原创 2014-08-31 10:36:12 · 127 阅读 · 0 评论 -
最常用和实用的CSS技巧
下面是CSS最常用和实用的技巧。 1.重置浏览器的字体大小 重置浏览器的默认值 ,然后重设浏览器的字体大小你可以使用雅虎的用户界面重置的CSS方案 ,如果你不想下载9MB的文件,代码如下: Java代码 body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p, b...原创 2014-08-31 10:42:23 · 100 阅读 · 0 评论 -
DIV+CSS规范命名大全集合
头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column 页面外围控制整体布局宽度:wrapper 左右中:left right center 登录条:loginbar 标志:logo 广告:banner 页面主体:main 热点:hot 新闻:news 下载:...原创 2014-08-31 11:13:53 · 80 阅读 · 0 评论 -
CSS布局奇淫技巧之-宽度自适应
css这个东西,说难不难,说容易也不容易。我觉得最重要的还是经验的积累,正所谓的不积硅步,无以至千里。这一系列文章讲述几种css特殊布局的实现,也当作为自己做个备忘吧。首先讲的是三列布局,左右两列宽度固定,中间一列宽度自适应这个很好实现,左右两列分别左浮动和右浮动并给一个固定宽度,中间不浮动,也不设定宽度。这样基本就可以了。但为了兼容IE还必须做些工作。看下代码结构:效果为:...原创 2014-08-31 15:21:16 · 122 阅读 · 0 评论 -
Block Formatting Context
来自聚焦前端@任浩‘博客http://www.focusweb.in/ 看到Block Formatting Context这个词语时,当时也是一头雾水,搜索了大量相关的资料后,对其有了一定的了解。对css的布局有了一个新的认识。Block Formatting Context是要深入理解CSS的一个必须理解的概念。简单地说,Block Formatting Context...原创 2014-09-25 22:01:13 · 99 阅读 · 0 评论 -
前端精选文摘:BFC 神奇背后的原理
BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等)。虽然我知道如何利用 BFC 解决这些问题,但当别人问我 BFC 是什么,我还是不能很有底气地解释清楚。于是这两天仔细阅读了CSS2.1 spec 和许多文章来全面地理解BFC。一、BFC是什么? 在解释 BFC 是什么之前,需要先...原创 2014-09-25 22:01:47 · 92 阅读 · 0 评论 -
详解inline-block
转自:http://ued.taobao.com/blog/2012/08/inline-block/曾几何时,display:inline-block 已经深入「大街小巷」,随处可见 「display:inline-block; *display:inline; *zoom:1; 」这样的代码。如今现代浏览器已经全面支持这个属性值了,上面的代码只是为了兼容 IE6、7 而已。那么你真的了解...原创 2014-09-25 22:35:17 · 177 阅读 · 0 评论 -
那些年我们一起清除过的浮动
浮动(float),一个我们即爱又恨的属性。爱,因为通过浮动,我们能很方便地布局; 恨,浮动之后遗留下来太多的问题需要解决,特别是IE6-7(以下无特殊说明均指 windows 平台的 IE浏览器)。也许很多人都有这样的疑问,浮动从何而来?我们为何要清除浮动?清除浮动的原理是什么?本文将一步一步地深入剖析其中的奥秘,让浮动使用起来更加得心应手。一、清除浮动 还是 闭合浮动 (Enclosi...原创 2014-09-25 22:35:52 · 115 阅读 · 0 评论 -
人人FED CSS编码规范
浏览器特效支持规范为了页面性能考虑,如果浏览器不支持CSS3相关属性的,则该浏览器的某些特效将不再支持,属性的支持情况如下表所示: 圆角阴影动画文字阴影透明背景渐变空间变换Chrome5+YYYYYYYFirefox 4+YYYYYYYSafari 5+YYY...原创 2014-09-26 15:07:08 · 129 阅读 · 0 评论 -
CSS line-height 和 vertical-align 精解
ine-height属性的具体定义列表如下:语法: line-height : normal | <实数> | <长度> | <百分比> | inherit说明: 设置元素中行的高度。值: normal:默认行高,一般为1到1.2; 实数:实数值,缩放因子; 长度:合法的长度值,可为负数; 百分比:百分比取值基于元素的字体尺寸。初始值: normal继承性:...原创 2014-09-26 15:07:35 · 130 阅读 · 0 评论 -
javascript中的数据类型、Object与Function
1. 数据类型javascript中包含6种数据类型:undefined、null、string、number、boolean和object。其中,前5 种是原始数据类型,object是对象类型。object类型中包括Object、Function、String、Number、Boolean、Array、Regexp、Date、 Globel、Math、Error,以及宿主环境提供的...原创 2014-10-28 09:36:10 · 134 阅读 · 0 评论 -
编写可维护的CSS
http://blog.jobbole.com/76032/在参与规模庞大、历时漫长且参与人数众多的项目时,所有开发者遵守如下规则极为重要:保持 CSS 便于维护保持代码清晰易懂保持代码的可拓展性为了实现这一目标,我们要采用诸多方法。本文档第一部分将探讨语法、格式以及分析 CSS 结构;第二部分将围绕方法论、思维框架以及编写与规划 CSS 的态度。CSS 文档分析...原创 2014-11-01 14:16:39 · 92 阅读 · 0 评论 -
CSS设计模式:OOCSS 和 SMACSS
真心觉得写出 CSS 并不难,但是要写出可被维护的 CSS 比其他程式语言都还难。所幸已经有许多大师级的人物,提出许多设计模式和思维,借由站在巨人的肩膀上可以让事情事半功倍。这篇文章就来说说 OOCSS、SMACSS 和撰写 CSS 时应该注意的规范。(本文的例子用的是 SCSS 语法)OOCSSOOCSS 不是什么新技术,只是一种撰写 CSS 的设计模式,或者可以说是一种「道德规范...原创 2014-11-01 14:18:26 · 167 阅读 · 0 评论 -
使用SVG中的Symbol元素制作Icon
原文出处: 腾讯ISUX 欢迎分享原创到伯乐头条 前言随着大屏幕分辨率的普及以及各种移动设备层出不穷的移动互联网时代的到来,我们在网站设计时更应该关心内容在各种设备上的阅读性和显示效果。我们都希望能在任何时间,任何设备上都能清楚的,高效的传递信息给用户。而随着各种高清视网膜屏幕的出现,现在web设计也需要考虑各种高清屏幕的显示效果,同样前端在代码实现的时候也需要根据屏...原创 2014-11-01 15:41:37 · 299 阅读 · 0 评论 -
CSS3兼容旧版IE(6,7,8)解决方案
http://www.16code.com/css3-for-ie/http://www.16code.com/ie-bugs/原创 2014-11-29 11:23:08 · 169 阅读 · 0 评论 -
关于CSS浮动以及清除浮动的几种方法
众所周知,CSS浮动在日常页面运用中起到非常重要的作用。例如,我们可以利用浮动来实现多栏布局等。如下图,Qzone利用浮动来实现双栏布局的示例:它的页面代码是这样的(主要):HTML部分:CSS部分(主要):.col_menu { float: left; position: relative; width: 170px; }.col_main { bor...原创 2015-01-06 21:36:30 · 169 阅读 · 0 评论 -
Web页面中八种创建多列等高(等高列布局)的实现技术
高度相等列在Web页面设计中永远是一个网页设计师的需求。如果所有列都有相同的背景色,高度相等还是不相等都无关紧要,因为你只要在这些列的父元素中设置一个背景色就可以了。但是,如果一个或多个列需要单独设置自己的背景色,那么它的视觉完整性的设计就显得非常重要了。大家都知道当初Table实现等高列布局是多么的简单,但是我们使用CSS来创建等高列布局并非是那么容易的事情。如果一个设计是固定宽度(...原创 2014-08-31 10:19:54 · 200 阅读 · 0 评论 -
用好负边距,省时又省力
说到负边距,广大的前端兄弟们肯定不会陌生,外边距 margin 的作用是增加容器与容器的间距,而负值则是减少间距。在平时的工作中,用好负边距,不仅能让我们的代码更优美,还能很大的提高工作效率。以下一些例子是我平时工作上碰到的,还有些是在网上学习时见到的,一并列出来,和大家一块分享,一共6个,以后碰见了新的用法我会再更新上来。1.在滑动门导航中的应用这个例子中主要是用负边距去遮挡了 n...原创 2014-08-30 19:04:18 · 108 阅读 · 0 评论 -
IE6、IE7、IE8、Firefox、Opera CS
针对样式名 如果只让ie6看见用*html .head{color:#000;}如果只让ie7看见用*+html .head{color:#000;}如果只让ff看见用:root body .head{color:#000;}如果只让ff、IE8看见用html>/**/body .head{color:#000;}如果只是不让ie6看见用html>body...原创 2011-01-20 11:16:48 · 168 阅读 · 0 评论 -
IE6 bug总结
随着IE8的问世,微软终于开始将其浏览器向标准化靠拢,而且其市场占有率已经接近于Chrome了,但由于IE6及IE7仍然占有巨大的市场份额,在此我总结一下主要关于IE6/7的bug。1. 双倍浮向Bug这 个bug在IE6及更低版本的浏览器中存在。当IE6及更低版本的浏览器在解析浮动元素时,会错误地把浮向边边界(margin)加倍显示。修复这个 bug的方法很简单,只需要将元素的display属性...原创 2011-02-18 10:15:09 · 123 阅读 · 0 评论 -
常用长度单位PX/EM/PT/百分比转换公式与对照表
PX和PT转换的公式: pt=px乘以3/4。比如12px×3/4=9pt大小。PX和em转换的公式: em=16乘以px,也就是说1.5em=1.5×16=24px。设计中常用PX/EM/PT/百分比转换表格 Pixels EMs Percent Points 6px 0.375em 37.50%5pt7px 0.4...原创 2011-12-03 21:45:44 · 1004 阅读 · 0 评论 -
em这个单位
很头疼,经常分不清楚,方便了用户,困扰了开发者自己。其实就是一个相对的单位,不过定义初衷字体的大小。(1)我们都知道一般浏览器默认的字体大小是16px,为了计算方便,一般会做如下处理:body{font-size:62.5%} // 如果汉字的话,则改成63%这个的意思就是,html本来字体是16px,而html是body的父级,所以body的字体被统一成10px。...原创 2011-12-03 22:45:21 · 111 阅读 · 0 评论 -
css bug 收集表
问题浏览器DEMO解决方法Hacking Rules:property:all-ie\9; property:gte-ie8\0;*property:lte-ie7; +property:ie7; _property:ie6;1input[button | submit] 不能用 margin:0 auto; 居中IE8bug | fixed...原创 2011-12-04 15:48:58 · 89 阅读 · 0 评论 -
Normalize.css ——CSS Reset的友好替代品
最近才第一次接触这个Normalize.css,之前Jeff 都是采用CSS Reset的,但如今发现现在流行这个Normalize.css 了。自己也查阅了不少资料去了解,现在权当是笔记放在这里吧。Normalize.css 简介官方网站:http://necolas.github.io/normalize.css/浏览器支持情况:Chrome, Firefox, Opera,...原创 2014-08-05 23:06:26 · 179 阅读 · 0 评论 -
精通CSS-1: 常用设计元素的高级CSS技巧
提升CSS技巧往往并不需要你去创造出什么前无古人后无来者的CSS技巧,事实上,网页设计中常用的一些布局和样式技巧,每个学CSS的人都已经知道怎么实现了,但我们总是想寻找更佳的解决方案。本文收集整理了60多个高级CSS技巧,不管你是CSS新手还是高手,相信这些技巧都能助你更进一步提高自己的CSS技能。1. CSS布局和用户界面技巧当前 CSS 主要应用于创建页面布局。利用 CSS 创造...原创 2014-08-23 20:21:58 · 296 阅读 · 1 评论 -
优秀的CSS布局大全
这份列表收集一些比较优秀的CSS布局,这些布局都免费供个人和商业使用。当然,你使用之前还是得看版权说明,也许会发生许可协议变更。Layout Gala- 这个网站收集了40多个专业的CSS布局,每个布局都通过了CSS和HTML验证,且不需要Hack,兼容各大主流浏览器。CSS Layouts – 另一个专门收集CSS布局的网站。Dynamic Drive CSS Layou...原创 2014-08-23 20:22:35 · 144 阅读 · 0 评论 -
box-sizing是CSS3的box属性
box-sizing是CSS3的box属性之一。一说到CSS的盒模型(Box model)我想很多人都会比较烦,特别是对于新手,然而这个Box model又是我们CSS运用中比较重要的一个属性。那么CSS3的Box-sizing跟盒模型有什么关系呢?第一句话就说了,Box-sizing是CSS3的Box属性之一,那他当然也遵循CSS的Box model原理,为了能更好的学习和理解这个Box-si...原创 2014-08-27 20:50:40 · 100 阅读 · 0 评论 -
如何更好地控制input输入框的高度
很久以前 Roger Johansson 就在他的 blog 上做了一个 用样式控制表单元素 的测试 , 告诉我们企图用样式控制表单元素是一件不可能的事情using CSS to style form controls to look exactly the same across browsers and platforms is impossible甚至 css2.1 规范中...原创 2014-08-27 20:56:13 · 899 阅读 · 0 评论 -
Controlling width with CSS3 box-sizing
An incredibly useful CSS3 feature when you’re creating columns with floats is box-sizing. It lets you choose which box sizing model to use – whether or not an element’swidth and height include paddin...原创 2014-08-27 20:58:16 · 178 阅读 · 0 评论 -
css中的负margin技术以及运用
刚刚开始学习css的时候,我采用了float为主来实现布局的方式,但是运用浮动很长一段时间之后,我发现这是一种被人牵着鼻子走的做法。至少,页面上不应过多的运用浮动,尤其是不要拿来确定整个布局。很简单的道理,当你用了float:left,后面的div很可能需要跟着用float:left,而且当宽度不够的时候,本来该和上一个div一个水平线上的div跑到下面去了,如果某个div有margin属...原创 2014-08-27 21:10:09 · 185 阅读 · 0 评论 -
负margin用法权威指南
在1998年CSS2的建议中,table就渐渐淡出了舞台,逐渐被载入史册。也因为如此,CSS布局也变成了编码优雅的代名词。在设计者用过的所有CSS概念中,负margin应当是最少被谈及的定位方法,这就像一种禁忌,每个人都使用它,但没人去讨论它。1、为负margin“平反”我们在CSS中都会使用margin,但将margin设置成负数,那可能就不大好处理了。在网页设计中,人们对负mar...原创 2014-08-27 21:27:25 · 110 阅读 · 0 评论 -
负边距margin布局计算方法
其实用负边距布局最大的优点就是布局不受html结构的影响,可以任意调换预备放在同一行的块的位置。这对于我们想要把最重要的内容最先呈现在用户面前有着很大的作用和益处。那么如何计算负边距呢?先看下面的代码。<style type="text/css">*{margin:0;padding:0;}.wrap div{float:left;height:400px;}.wrap {over...原创 2014-08-28 10:55:37 · 172 阅读 · 0 评论 -
css样式表中margin负值的五种应用详解
在网页前端设计中经常会用到margin的负值,这里就总结一下关于margin负值的5种使用及相关bug的解决。在网页前端设计中经常会用到margin的负值,这里就总结一下关于margin负值的5种使用及相关bug的解决。1. 在流动性布局中的应用 如WordPress的两栏式不固定布局就是使用margin负值来实现的定位,属于左右margin负值在流动性布局中的应用。...原创 2014-08-28 10:56:00 · 205 阅读 · 0 评论 -
CSS实现二列等高布局及右边自适应宽度
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike...原创 2015-01-06 21:53:30 · 147 阅读 · 0 评论