随笔分类 - css
摘要：底部固定栏目有时还是蛮需要的，有些浏览器兼容性不是很好又来整个，表示可以实现。jquery博客实现底部固定类似人人校内似的，只是个模糊状态具体还是要慢慢写的。<STYLE type=text/css>*{margin:0;padding:0}.fixed {RIGHT: 15px; BACKGROUND: #ccc; LEFT: 15px; BOTTOM: 0; LINE-HEIGHT: 30px; POSITION: fixed; HEIGHT: 30px}#iefixed { MARGIN: -1px 15px 0px; OVERFLOW: hidden; ZOOM: 1; H
阅读全文
摘要：jquery博客每天重复这一样的事情，不断的切图做页面，哪边样式出问题了，马上就去改，又有新的需求，马上去做，生成DEMO页面，好方便后端的同事们调试。商场的页面每天继续忙不停的做，前端伤不起，来面试的不是经验不足，就是吊儿郎当的，擦，纠结。后端哥们在做客户管理中心功能，需要一个相册，参考了，网易，新浪，百度的，最终定下来，整个百度空间相册的吧。大致是这样的里面的背景图片盗用的是百度空间的背景图片蛮大的，我们不需要那么多，用到个background定位后面的显隐页面那就更简单了，鼠标移到那边显示背景白色，并有个边框，里面的编辑删除文字显示，移除消失12345678910$(document).
阅读全文
摘要：最近jquery博客一直在加班，你妹的要晚上九点回去。外面黑压压的一片，网速慢的出奇百度谷歌下都不正常哎 这个事咋整哦没心情折腾了整点东西吧刚做前端的时候做的较多的是就是菜单导航其实就一个ul 给一个固定宽度li固定宽度高度浮动lefta标签中加个class链接顺序得关注下高手们请忽视吧在线效果DEMO原文地址 jquery特效 http://www.jqueryba.com/320.html
阅读全文
摘要：今天jquery博客被问到咋写a链接后的样式这个是很早很早一直沿用的方法,一般这样就能hover一般都<p><a href=”">Hello Word</a></p>.red{color:#e72159}a.red{color:#e72159;text-decoration: none}a:hover.red{color:#e72159;text-decoration: none}转自 jquery http://www.jqueryba.com/300.html
阅读全文
摘要：CSS Hack 不得不在一些项目中运用到。jquery博客也遇上了，关于二次开发的一个3D地图，其实也想好好写代码兼容，苦于上头要东西，短期不可能实现，没法子，回归css hack 吧。为了调试尼玛的3D地图，不得不安装了IE9，搭配着IEtest方便照顾IE全家。firefox chrome safari operaHack 的顺序一般使用 Firefox 作为平台, 只要代码写得够标准, 其实要 Hack 的地方不会很多的, IE 以外的浏览器几乎都不会有问题, 所以可以暂时忽略, 顺序如下:Firefox -> IE6 -> IE7 -> 其他Hack 的用法说到方法
阅读全文
摘要：jquery家孩子生日终于搞好了，忙活了一天，累的很啊。终于可以坐下来了，闲着没事，整点之前关注的CSS权重。CSS中是使用4位的数字来表示权重的具体权重说明如下：继承的样式:0000内联的样式:1000子选择符:0000通用选择符:0000属性选择符:0010伪类选择符:0010伪类元素选择符:0010类型选择符：0001类选择符:0010权重最大，就优先显示以前关注的少，最近突然发现有些新项目中，为了无缝结合，得需要用css权重大点写，不然压根显示不了。恩，以后多注意适当的时候写下吧。转自 jquery http://www.jqueryba.com/267.html
阅读全文
摘要：今天jquery博客依然加班中，苦比的主。最近在改3D地图，因为不是自己开发的，进程慢，错位多，很是纠结。遇到一个很奇怪的问题，才style中，有个注释，显示不正确了。如/*.sortShowContent .s1{position:absolute;top:27px;left:0;z-index:200;}*/.sortShowContent .s2{position:absolute;top:65px;left:0;z-index:200}.sortShowContent .s3{position:absolute;top:100px;left:0;z-index:200}.sortSho
阅读全文
摘要：规范目的为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发. 本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改.基本准则符合web标准, 语义化html, 结构表现行为分离, 兼容性优良. 页面性能方面, 代码要求简洁明了有序, 尽可能的减小服务器负载, 保证最快的解析速度.文件规范1. html, css, js, images文件均归档至<系统开发规范>约定的目录中;2. html文件命名: 英文命名, 后缀.htm. 同时将对应界面稿放于同目录中
阅读全文
摘要：今天根据需求在地图顶部增加一些帮助，返回等链接。奇怪了，把代码移植过去，IE9链接好好的，鼠标过去hover都能出现偏偏在火狐 谷歌浏览器中死活没有反应。每个月总归会遇到一些很差异的情况。地图是二次开发的，好多代码，来的时间不长，尼玛的，修改的时候，样式只能继承，不能删除，头大。无解，看了半天，实在没法子。最后弄个很暴力的写法，反正是在顶部出现。给该层定义一个绝对定位， z-index:9999擦，现在谁也影响不到他啦。firefox chrome 终于可以显示啦。OVER转自 jquery http://www.jqueryba.com/220.html
阅读全文
摘要：今天jquery博客遇上CSS文档流与块级元素(block)内联元素(inline)之间的关系，最近一直加班，睡眠不好，有点糊涂了，简单的问题复杂化了。项目多了，有些需要和同事们齐心协力，有些放进去出错，头大啊。文档流将窗体自上而下分成一行行， 并在每行中按从左至右的顺序排放元素，即为文档流。每个非浮动块级元素都独占一行， 浮动元素则按规定浮在行的一端。 若当前行容不下， 则另起新行再浮动。内联元素也不会独占一行。 几乎所有元素(包括块级，内联和列表元素）均可生成子行， 用于摆放子元素。有三种情况将使得元素脱离文档流而存在，分别是浮动，绝对定位， 固定定位。基于文档流， 我们可以很容易理解以下
阅读全文
摘要：jquery博客觉得CSS样式命名是很重要。项目中，要是团队，样式命名不同的话，会给团队其他人看的很纠结，揣测你的很费劲哦。一般常见的有驼峰，帕斯卡，符号连接1，驼峰有着悠久的历史，大家接触过其他程序语言的，很了解了，不多说不解释。用css写个信息层的话 .messageBox{…}2，帕斯卡其实和驼峰很相似，具体表现为每个单词都需要大写比如 .MessageBox{…}3，符号连接需要按个shift 开发速度不咋样 .message-box{…}个人比较喜欢用驼峰，抵制符号链接 比如-使用的不好的话，会与javascript混乱。当然萝卜白菜各有所爱，团队统一起来，大家用一个，不然有的...
阅读全文
摘要：╮(╯▽╰)╭ico网站标志显示不了，好多时候是因为缓存没有没有刷新今天也试了几个方法这个感觉还行一试就管用<link rel=”shortcut icon” href=”具体地址，必须在根目录下哦/favicon.ico” type=”image/x-icon”/>原文地址 前端开发http://www.jqueryba.com/176.html
阅读全文
摘要：作为一个CSSer，需要懂得的知识是比较多的，前面有UE设置，后面有程序，而在开发的同时，需要考虑到网站优化，包括用户体验和SEO等等。今天就SEO与DIV+CSS布局的关系，我们作一些了解，相信大家看了以后，会有收获的。首先了解一下，什么是SEO。SEO主要就是通过对网站的结构，标签，排版等各方面的优化，使Google等搜索引擎更容易搜索网站的内容，并且让网站的各个网页在GOOGLE等搜索引擎中获得较高的评分，从而获得较好的排名。一、代码精简使用DIV+CSS布局，页面代码精简，这一点相信对XHTML有所了解的都知道。代码精简所带来的直接好处有两点：一是提高蜘蛛爬行效率，能在最短的时间内爬完
阅读全文
摘要：css浏览器不兼容很折腾人。天外飞仙在其他网站上趴下来的，读了遍，还真是回事，说的蛮好的，就转来，权当给自己做笔记，俗话说的好，好记性不如烂笔头，也顺便给大家分享。一、IE边框若显若无，须注意，定是高度设置已忘记；二、浮动产生有缘故，若要父层包含住，紧跟浮动要清除，容器自然显其中；三、三像素文本慢移不必慌，高度设置帮你忙；四、兼容各个浏览须注意，默认设置行高可能是杀手；五、独立清除浮动须铭记，行高设无，高设零，设计效果兼浏览；六、学布局须思路，路随布局原理自然直，轻松驾驭html，流水布局少hack，代码清爽，兼容好，友好引擎喜欢迎。七、所有标签皆有源，只是默认各不同，span是无极，无极生两
阅读全文
摘要：CSS Sprites在国内很多人叫css精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。对于当前网络流行的速度而言，不高于200KB的单张图片的所需载入时间基本是差不多的，所以无需顾忌这个问题。加速的关键，不是降低重量，而是减少个数。传统切图讲究精细，图片规格越小越好，重量越小越好，其实规格大小无所谓，计算机统一都按byte计算。客户端每显示一张图片都会向服务器发送请求。所以，图片越多请求次数越多，造成延迟的可能性也就越大。CSS Sprites其实就是把网页中一些背景
阅读全文
摘要：最近在搞网站，自己做的话，对大小很敏感，太大了，增大服务器压力嘛，能省点就省点。下面说下，我们常用的几个图片格式jpg、gif、pngJPG格式特点透明性它并不支持透明。动画它也不支持动画。损耗性除了一些比如说旋转（仅仅是90、180、270度旋转），裁切，从标准类型到先进类型，编辑图片的原数据之外，所有其它操作对jpg图像的处理都会使得它的质量损失。所以我们在编辑过程一般用png作为过渡格式。隔行渐进显示它支持隔行渐进显示（但是ie浏览器并不支持这个属性，但是ie会在整个图像信息完全到达的时候显示）。由上可以看出Jpeg是最适web上面的摄影图片和数字照相机中。Gif格式特点透明性Gif是一
阅读全文
摘要：为了更加符合SEO的规范，下面是前端开发中比较常见的CSS+DIV的命名规则：页头:header登录条:loginBar标志:logo侧栏:sideBar广告:banner导航:nav子导航:subNav菜单:menu子菜单:subMenu搜索:search滚动:scroll页面主体:main内容:content标签页:tab文章列表:list提示信息:msg小技巧:tips栏目标题:title友情链接:friendLink页脚:footer加入:joinus指南:guild服务:service热点:hot新闻:news下载:download注册:register状态:status按钮:btn
阅读全文
摘要：底部固定栏目有时还是蛮需要的，有些浏览器兼容性不是很好又来整个，表示可以实现。jquery博客实现底部固定类似人人校内似的，只是个模糊状态具体还是要慢慢写的。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><HEAD><
阅读全文
摘要：好久没用css hack了，刚来的新环境，有些不是自己写的，上面催命似的，没办法 css hack吧平时css hack用的少为了速度点，看人家代码实在纠结拿个css hack用用吧IE6能识别下划线"_"和星号" * "，IE7能识别星号" * "，但不能识别下划线"_"，而firefox两个都不能认识。书写顺序，一般是将识别能力强的浏览器的CSS写在后面浏览器优先级别:FF < IE7 < IE6 , CSS hack书写顺序一般为FF IE7 IE6margin-top:10px;*margin-
阅读全文
摘要：本文向你推荐12个免费在线的Web网站性能测试工具。1. Web Page Test从世界各地多个地点，使用真正的浏览器（IE和Chrome），并在真正的消费者连接速度，对 你的网站进行速度测试。您可以运行简单的测试，或执行多步交易，视频采集，内容封锁和更先进的测试，包括。您的结果将提供丰富的诊断信息，包括资源加载的 瀑布图，网页速度优化检查和改进建议。2. Load ImpactLoad Impact是一个用来测试网站一次性可支持的负载数，可在同一时间从不同的地点发起50个并发请求，然后分析出你的网页加载的速度。3. FreeSpeedTestFreeSpeedTest.com 是最棒的网站
阅读全文
浙公网安备 33010602011771号