随笔分类 -  div+css

摘要：也许你遇到过这样的情况，当你看到一个好看的网站，想下载它的图片时，发现下下来的不是一个单独的图片，而是好多图片组合在一起的一张大图片。这就是典型的CSS精灵。CSS精灵，英文名称CSS Sprite，是一种将网站中的小图片组合成一张大图片在网站中使用的方式。为什么要将小图片组合成大图片呢？主要是为了减少浏览器对服务器的请求次数。因为用户在浏览网站的时候，每次请求都是需要时间的。也许你的网页代码，图片，JS等的下载并不是最占用用户浏览时间的，占用户浏览时间最多的是用户每次的请求时间。html每个请求都要经过TCP协议的三次握手，用http watch观察一下浏览网站的时间构成，就能发现，请求占用 阅读全文

摘要：我用JS生成一个弹出层<div><div>,这个弹出层下面有一个文本框，当文本框获取到焦点时，里面的光标一闪一闪的，这时，弹出层也无法遮住闪烁的光标，也就是页面上看到弹出层里有一个地方，有条竖线一闪一闪的，解决方法：$(this).focus(); $(this).blur();先这样解决吧，如果大家有啥好的见意可以说一下。 阅读全文

摘要：CSS本身对我来说从来不是问题，但是我很好奇使用变量来沿着一个调色盘为我的网站或模板创建一些东西的想法。拥有一个提供固定数量选项可选的色盘可以让我避免颜色太跳跃以至于从一个已定的风格中脱离。 阅读全文

摘要：由于不同的浏览器对CSS的支持及解析结果不一样，还由于CSS中的优先级的关系。我们就可以根据这个来针对不同的浏览器来写不同的CSS。 　　CSS Hack大致有3种表现形式，CSS类内部Hack、选择器Hack以及HTML头部引用(if IE)Hack，CSS Hack主要针对IE浏览器。 阅读全文

摘要：如今 Web Application 横行，在 Web 2.0 网站的各种设计元素中，按钮是无法或缺的。如何用最简洁的方法制作最漂亮的按钮就成为了一个问题。本文讲述的方法，代码上简洁，符合 XHTML 标准，不需要 Javascript，只需要纯 CSS 即可完成，而且通用性很好，使用起来也很方便。上图即为最终成品的例子，下面我将详述整个制作过程，相信通过这个教程您肯定可以学会。 阅读全文

摘要：用css实现网页背景渐变的代码如下：一、从上往下渐变Example Source Code:body{FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#000000);}二、从左上至右下渐变Example Source Code:body{FILTER: Alpha( style=1,opacity=25,finishOpacity=100,startX=50,finishX= 100,startY=50,finishY=100);backgr 阅读全文

摘要：_blank -- 在新窗口中打开链接 _parent -- 在父窗体中打开链接 _self -- 在当前窗体打开链接,此为默认值 _top -- 在当前窗体打开链接，并替换当前的整个窗体(框架页) 一个对应的框架页的名称 -- 在对应框架页中打开 阅读全文

摘要：正常情况下，ie6不支持png图片做背景，一是不透明，二是不能定位，三是不能循环 阅读全文

摘要： DOCTYPE是document type的简写。主要用来说明你用的XHTML或者HTML是什么版本，浏览器根据你DOCTYPE定义的DTD(文档类型定义)来解释页面代码。 阅读全文

摘要：em是什么？ em指字体高，任意浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em。为了简化font -size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。 em有如下特点： 1. em的值并不是固定的； 2. em会继承父级元素的字体大小。 阅读全文

摘要：CSS控制表格隔行变色与鼠标滑过变色 阅读全文

摘要：近期在做样式的时候发现之前自己写的样式一点也不规范，东拼西凑，名字也不统一，遂在网上搜了点资料，跟大家分享一下：　　一．文件命名规范　　全局样式：global.css；　　框架布局：layout.css；　　字体样式：font.css；　　链接样式：link.css；　　打印样式：print.css；　　二．常用类/ID命名规范　　页　眉：header　　内　容：content　　容　器：cont... 阅读全文

摘要：scrollWidth 是对象的实际内容的宽，不包边线宽度，会随对象中内容的多少改变（内容多了可能会改变对象的实际宽度）。 clientWidth 是对象可见的宽度，不包滚动条等边线，会随窗口的显示大小改变。 offsetWidth 是对象的可见宽度，包滚动条等边线，会随窗口的显示大小改变。 阅读全文

摘要： 什么是浏览器兼容：当我们使用不同的浏览器（Firefox IE7 IE6）访问同一个网站，或者页面的时候，会出现一些不兼容的问题，在这种浏览器下显示正常，在另一种下就乱了，我们在编写CSS的时候会很恼火，刚修复了这个浏览器的问题，结果另外一个浏览器却出了新问题。 阅读全文