float居中,具有Float属性的元素依然居中
点评：在为li设置了float:left的属性后，li的内容会向左对齐，但是我们仍然需要包含着该li的div能够居中对齐（比如说常见的页面导航条）。第一种方法，需要对包含li的ul增加一些样式（需要一些Hack），并且同时对外层的div设置text-align:center属性。 以上两项必须同时设置，否则不起作用，此时就可以达到我们的目的了。 第二种方法，对ul和li均设置position: r... [阅读全文]
div上下居中,div完美自适应动态上下左右居中
点评：div完美自适应动态上下左右居中，多用于信息提示框效果。复制代码代码如下:... [阅读全文]
display:inline的用法
点评：和 display:inline 对应的是 display:block，block 会让应用了该 CSS 属性的 HTML 标记变成块级别元素，例如 SPAN 是行内显示的，但是你加了 display:block 属性就不一样了 div DIV1 /div div DIV2 /div 这里DIV1和DIV2分别占一行，但是你给他们加上属性后变了 div style= "display:inl... [阅读全文]
css样式,css样式实现整个页面背景使用一张图片
点评：最近一直被css背景困扰，因为是仿站，别人网站背景图片无论怎样另存，都是相同文件名，打开一看，整个网站的各个角落背景图片都在一个文件中分布，于是上网搜集资料，发现使用这种方法的网站很多，源自于雅虎最早。这样实现的好处很多，网页加载一个背景图片大大加快了网站浏览速度，也非常便于网站整体风格修改。难度在于制作的背景图片如何截取指定的位置作为某个地方的背景，仔细研究发现还是不难的，首先window... [阅读全文]
css样式表,关于CSS样式表文件组织形式的整理
点评：以下引用网络上的一篇文章,不知道作者是谁了,总体上概括的不错,但是在实际应用当中还是要根据项目情况来具体实施比较好。现在的开发环境CSS越来越成为主流，各企业与IT公司对CSS也越来越重视，大家的学习也热情高涨，CSS被我们赋予了前所未有的使命。然而依赖css越多，样式表文件就会变得越大越复杂。与此同时，文件维护和组织的考验也随之而来。曾几何时只要一个CSS文件就够了—&mdas... [阅读全文]
css样式学习,CSS学习之一 CSS样式引入方法
点评：CSS样式引入方法，一般情况下最好使用link加入远程样式，但不好的地方就是当网速慢的情况下，这种方法容易使页面因为样式没有加载而变形，很多大网站首页都是直接写到页面里。HTML中，我们通常使用link元素引入外部样式表，link有以下几个属性： 1、rel，代表“关系”（relation），在这里，关系（即rel值）为“stylesheet”... [阅读全文]
css选择器,CSS学习之二 选择器
点评：CSS学习之二 选择器 1、元素选择器：往往是HTML元素，也可能是XML定义的元素，举例： 复制代码代码如下:... [阅读全文]
css字体,CSS学习之三 字体使用说明
点评：当你选择某种字体时，必须保证选定的字体不但要在选定的平台上看起来不错，还要保证在其他平台上也能正常显示。没有人强迫你按照某种方式设计。Web是一个开放式的环境，采用自己喜欢的字体，不要被一些考虑不充分的意见动摇，只要保证你的网站访问者能够阅读它就行。
字体使用基本原则：清晰+易读！当你选择某种字体时，必须保证选定的字体不但要在选定的平台上看起来不错，还要保证在其他平台上也能正常显示。没有人强... [阅读全文]
css浮动,CSS学习之四 浮动
点评：浮动和定位是CSS布局当中很重要的两种方法，这一篇先讲浮动布局，定位留在下一篇。一、先说说浮动的性质吧，请看HTML代码： 复制代码代码如下:... [阅读全文]
css定位与布局,CSS学习之五 定位布局
点评：定位的原理很简单，利用定位，可以准确的定义元素框对于其正常位置应该出现在哪里，或者相对于父元素、另一个元素甚至浏览器窗口本身的位置。一、定位属性的基本情况使用position属性对元素进行定位：position属性值：static | absolute | fixed | relative 初始值：static运用范围：所有元素继承值：无计算值：根据指定确定static：元素框正常生成。块级... [阅读全文]
css3圆角,CSS3实战第一波 让我们尽情的圆角吧
点评：在没有css3 以前，或者说，在webkit没有占绝对的优势以前，圆角对于制作经理来说，都是一个纠结的死角。如果说，WAP2.0网页的机型、浏览器适配给我们无线制作经理造成了巨大的心理阴影，那么从iPhone、Android这些高端手机应用 起，我们终于可以庆幸比其他同行提前迎来了一个新时代，这两种高端手机上的Safari Mobile和Google Android浏览器近乎完美的渲染效果，... [阅读全文]
vertical,line-height 和 vertical-align 行高与行对齐精解 (图文)
点评：行高指的是文本行的基线间的距离，但是文本之间的空白距离不仅仅是行高决定的， 同时也受字号的影响。7.3 line-height行高指的是文本行的基线间的距离，但是文本之间的空白距离不仅仅是行高决定的， 同时也受字号的影响。7.3.1 语 法line-height属性的具体定义列表如下：语法： line-height : normal | 实数 | 长度 | 百分比 | inherit说明： ... [阅读全文]
li垂直居中,Li list-style-image 图片垂直居中
点评：如果使用list-style-image设置了一个列表项的前面的小图标，在FF下是正常显示的，list-style-image 图片垂直居中 如果使用list-style-image设置了一个列表项的前面的小图标，在FF下是正常显示的， 但是在IE下想让他也居中正常的显示，死活不听话。 退而求其次，找了一个折中的解决办法， 就是使用ul li的backgrou-image（背景图片）来解决。... [阅读全文]
csshack,说说CSS Hack 和向后兼容（推荐）
点评：人一旦习惯了某些东西就很难去改，以及各种各样的原因，新的浏览器越来越多，而老的总淘汰不了。增长总是快于消亡导致了浏览器兼容是成了谈不完的话题。说到浏览器兼容，CSS HACK自然而然地被我们想起。今天，我们通常都有一个团队或者将有一个团队的人在一个公司里面做相同的事，需要我们有统一的规范来进行Coding，以方便维护。而解决兼容的方法就是（必须是，因为这才最容易有问题的）其中一个最重要的、要... [阅读全文]
老调重弹,老调重弹的CSS优先级
点评：在讲CSS优先级之前，我们得要了解什么是CSS，CSS是用来做什么的。首先，我们对CSS作一个简单的说明：CSS是层叠样式表（Cascading Style Sheets）的简称。它的规范代表了互联网历史上一个独特的发展阶段。现在对于从事网页制作的朋友来说，应该很少没有听说过CSS了，因为在制作网页过程中我们经常需要用到。 其次：我们能通过CSS为文档设置丰富且易于修改的外观，以减轻网页制... [阅读全文]
window7,基于css3仿造window7的开始菜单
点评：相当逼真，css3果然强悍。要留意的点依旧是哪几项，难点在于细节的微调，尤其是渐变背景的制作，css3中非常灵活，下次有机会，发篇css3渐变背景的详细教程。 相当逼真，css3果然强悍。友情提示：请勿在IE下浏览。来看下原作者的设计草图： 简明创建过程 第一步 ：创建如下菜单结构 复制代码代码如下:... [阅读全文]
HTML+CSS3 模仿Windows7 桌面效果
点评：心血来潮也尝试着做了一个Windows 7 桌面效果，喜欢的朋友可以测试下。前一阵在园子里看到一篇文章《基于css3仿造window7的开始菜单》，文中仅使用CSS3 实现了Windows 7 开始菜单的动态效果，很久以来一直被WPF/Silverlight 山上的风景所吸引，未成想其他的山也同样引人入胜。于是心血来潮也尝试着做了一个Windows 7 桌面效果，先来看几张截图吧。 桌面程序... [阅读全文]
ie6崩溃解决,z-index ie6下的解决方案
点评：非同辈元素，任意一者或其祖元素拥有动态定位时，同时各自向上寻找动态定位的祖元素至共有的祖元素的下一级为止，并分别从中拿出具备最高级别的祖元素（或其本身）进行比较。... [阅读全文]
div不换行,css自动换行 防止撑破div影响排版
点评：自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法 对于div,p等块级元素正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行html id="wrap"正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义 ... [阅读全文]
css长度单位,CSS长度单位 px和pt的区别
点评：先搞清基本概念：px就是表示pixel，像素，是屏幕上显示数据的最基本的点；而pt就是point，是印刷行业常用单位，等于1/72英寸。 这样很明白，px是一个点，它不是自然界的长度单位，谁能说出一个“点”有多长多大么？可以画的很小，也可以很大。如果点很小，那画面就清晰，我们称它为“分辨率高”，反之，就是“分辨率低”。所... [阅读全文]
css屏幕居中,css屏幕居中的方法（推荐）
点评：css实现的页面元素屏幕垂直居中的方法，需要的朋友可以参考下。复制代码代码如下:... [阅读全文]
ie6css,IE6对多个CSS样式的解析
点评：如果样式写成这样，那么在IE6和FF(IE6+同FF)下会显示为不同的效果。测试代码 复制代码代码如下:... [阅读全文]
css中的伪类,CSS伪类
点评：浏览器支持：IE Internet Explorer, F: Firefox, N: Netscape。伪类浏览器支持：IE Internet Explorer, F: Firefox, N: Netscape。W3C：“W3C” 列的数字显示出伪类属性由哪个 CSS 标准定义（CSS1 还是 CSS2）。 伪类 ... [阅读全文]
浮动层,浮动层自动适应高度的解决方法
点评：在网页制作中经常会用到浮动。用了浮动就会涉及到一个清除浮动的问题，因为包含浮动的元素是不会自动适应高度的，也就是不会被浮动元素撑开。先看一个例子： HTML: 复制代码代码如下:... [阅读全文]
css图片缩小,CSS强制按比例缩小图片
点评：CSS强制按比例缩小图片,很多情况下，不用这种方法，会增加ie负荷。titleCSS强制按比例缩小图片/title style img,a img{ border:0; margin:0; padding:0; max-width:200px; width:expression(this.width200?"200px":this.width); max-height:200px; heig... [阅读全文]
css优先级,同级情况下CSS的优先级探讨
点评：CSS的调用方式一共有4种，分别是：行内样式，内嵌式，link链接式，@import导入式，在同级的前提下，我们可以按样就近原则来理解他们的优先级，则越前定义的样式，会被后面的样式覆盖。假如两个或更多的规定在应用了前三个规定具有相同优先级，则后给出的规则优先于早先给出的规则。如果在网页的HEAD标记中同时使用了STYLE标记符（指定嵌入式样式）和LINK标记符（指定链接式样式），并且这两个样... [阅读全文]
css浏览器,区别各种IE浏览器的css写法
点评：因为IE版本的的太多有些时间不得不对某些浏览器进行单独的实现，大家就可以参考下面的文章了。1.区别IE和非IE浏览器 复制代码代码如下:... [阅读全文]
让Firefox未载入图片显示边框
点评：在IE中,未载入的图片显示一个红叉,而在Firefox里面,未载入的图片不仅什么提示都没有,甚至连图片所占用的宽和高都去掉了!这对用户比较友好,但是对于网页开发者来说有点不爽...下面就是解决Firefox未载入图片不显示的解决办法:1.下载Stylish插件 http://addons.mozilla.org/zh-CN/firefox/addon/2108/2.安装并重启Firefox... [阅读全文]
css三角形,纯CSS实现的小三角
点评：纯CSS实现的小三角，喜欢的朋友可以参考下。先看图1效果：代码如下：div style=”border-top:10px solid #FFFFCC;border-left:10px solid #FF3300;border-bottom:10px solid #FFFFCC;”/div关键是要知道边框的上下左右四条边框之间的连接处是呈斜线状的，如图2：然后上面的图1... [阅读全文]
div遮挡,IE6 select z-index无效,遮挡div bug的解决方法
点评：在最近的一个项目中，遇到了IE6 select遮挡div的bug，为了解决这个bug我查了很多资料，试图找到一个最最有效的方法，很多人是通过iframe的方法来解决，其实我查了国外的很多资料也是通过iframe的方法来解决的。今天我说说iframe解决的一般方法，已经使用jQuery插件bgiframe解决IE6 select z-index无效，遮挡div的bug。 解决方法之一：Ifra... [阅读全文]
