webstalker

原创 css代码标准化规范

>>返回顶部WEB前端代码标准化规范web2.0标准“web”标准时一系列标准的总称，（误区：把web标准说成div+css）；准确的说法：采用W3C推荐的WEB标准中XHTML1.1结合CSS2.0样式制作页面。使用web2.0的好处：a.节约运营成本（宽带流量）；b.人成本工（修改方便）；c.用户友好性（包括普通用户；搜索引擎；手机、PDA、媒体机等设备）

原创 关于Firefox和IE在CSS样式表中的差异解决方案

1 、针对firefox ie6 ie7的css样式现在大部分都是用!important来hack，对于ie6和firefox测试可以正常显示，但是ie7对!important可以正确解释，会导致页面没按要求显示！找到一个针对IE7不错的hack方式就是使用“*+html”，现在用IE7浏览一下，应该没有问题了。现在写一个CSS可以这样：#1 { color: #333; } /* M

原创 实用jQuery代码段

1. 如何创建嵌套的过滤器：1.  //允许你减少集合中的匹配元素的过滤器， 2.  //只剩下那些与给定的选择器匹配的部分。在这种情况下， 3.  //查询删除了任何没（:not）有（:has） 4.  //包含class为“selected”（.selected）的子节点。 5.  .filter(":not(:has(.selected))") 2. 如何重用元素搜索

原创 文档兼容性之浏览器模式

作为web开发人员，本来已经很悲催的不断调试各种浏览器的显示效果，而MS下的各个版本的IE浏览器每一个是让人省心的...哎！可能是MS实在看不下去了，于是IE8开始微软引入文档兼容性，从此让前端开发人员稍微松了一口气。        首先先了解两个感念：浏览器模式(browsermode)和文档模式(documentmode)        浏览器模式：于切换IE针对该网页的默认文

原创 web开发性能优化

1、尽量减少HTTP请求个数——须权衡合并图片（如csssprites，内置图片使用数据）、合并CSS、JS，这一点很重要，但是要考虑合并后的文件体积。 [sprites:精灵]2、使用CDN（内容分发网络）[CDN:内容分发网络]这里可以关注CDN的三类实现：镜像、高速缓存、专线，以及智能路由器和负载均衡；3、为文件头指定Expires或Cache-Control，使内容具有

原创 前端开发

页面重构基础包含了HTML以及CSS的基本知识。知识点HTML常用元素。 HTML元素间嵌套关系。 HTML元素语义性。 CSS常用属性。 CSS选择器。 CSS选择器优先级。 两类盒模型的概念。 常见布局的实现。常见问题h1~h6的区别是什么？ul、ol的区别呢？ 有用过dl、dt、dd这三个元素吗？其表达的语义是什么？ 如何实现定宽、自适应的两列、三列布局？ flo

原创 CSS原理

从事Web前端开发的人都与CSS打交道很多，有的人也许不知道css是怎么去工作的，写出来的css浏览器是怎么样去解析的呢？当这个成为我们提高css水平的一个瓶颈时，是否应该多了解一下呢？一、浏览器的发展与CSS      网页浏览器主要通过HTTP协议连接网页服务器而取得网页，HTTP容许网页浏览器送交资料到网页服务器并且获取网页。目前最常用的 HTTP 是 HTTP/1.1，这个

原创 CSS兼容解决方法

CSS 对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了 一下.对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加DOCTYPE声明.CSS技巧1.div的垂直居中问题vertical-align:midd

原创 @import与link的具体区别

linklink就是把外部CSS与网页连接起来。@importimport文字上与link的区别就是它可以把在一个CSS文件中引入其它几个CSS文件。为什么使用@import大部分使用@import方式的人是因为旧的浏览器是不支持@import方式的,这意味着我们可以使用@import来引入只让现代浏览器解析的CSS样式.另一个主要的原因就是当你的网页需要引入几个外

原创 css去掉a标签点击后的虚线框

1：在a标签里加入js控制，当a标签被聚焦时，强制取消焦点，这时候a标签自然不会有虚线框。测试这里设置聚焦时触发blur();强制取消焦点。自然是屡试不爽。2：在a标签里嵌套其他标签，比如span 或者var等等，把内容放在被嵌套的标签里。这时候点击这个链接，聚焦的是a的子标签，自然不会聚焦在a标签上，所以也能避免这个问题。3：不适用a标签做链接，采用其他标签，使用js

原创 兼容性及经验汇总

原创 css3实现简易魔方

demo.stage{ position:relative; top:50px; }.box_before,.box_back,.box_left,.box_right,.box_top,.box_bottom { height:240px; width:240px; text-align:center; font-weight:bolder; color:yellow;