牧羊岛

懒是不会有好果子吃滴//

导航

随笔分类 -  web前端CSS

1 2 下一页

使用css自动编号before和content

摘要：需要支持:before选择器、支持content属性和counter方法的浏览器。<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title> New Document </title></head><style>body{counter-reset: section 0;}h1:before{content: &q 阅读全文

posted @ 2012-09-07 10:17 牧羊岛 阅读(2689) 评论(0) 推荐(0)

网页快讯？

摘要：稍微记一下吧，3个class是必须的，命名固定1个id也是必须的，命名随意<div class="hslice" id="webslices"><!--一个webslices,id号是必需的,命名可随意--> <div class="entry-title">我是标题</div><!--当前webslices标题--> <div class="entry-content">我是内容<!--当前webslices内容--> </ 阅读全文

posted @ 2011-04-28 10:56 牧羊岛 阅读(123) 评论(0) 推荐(0)

愚人节的页面反转

摘要：19楼是图片做的，js、flash都有方法实现剩下的看看css和滤镜吧：IE：html{filter:fliph;}GG：body{-webkit-transform: rotateY(180deg);}MOZ：body{-moz-transform: skew(0deg, 180deg) scale(-1, 1);} 阅读全文

posted @ 2011-04-01 09:59 牧羊岛 阅读(222) 评论(0) 推荐(0)

正在使用的浏览器插件

摘要：IEDebugBar开发人员工具FirefoxFireBugFiddlerWebDeveloperySlowPage SpeedPearl Crescent Page Saver 保存网页为图片HTMLValidatorFirefox Accessibility Extension Mozilla/Firefox无障碍扩展让残疾人士方便地浏览网页内容。开发人员可以用这个扩展检查他们的结构和样式的网页易读性。CSS UsageFlashFireBug 3.3.2FlashInspector 0.2.5JSONViewChromeMonstr开发人员工具12306.cnEdit This Coo. 阅读全文

posted @ 2010-09-10 09:39 牧羊岛 阅读(404) 评论(0) 推荐(0)

IE默认按钮黑线框

摘要：目前只测试了IE6，得出规律如下（给所有的按钮都加了style="border:#F00 solid 1px;属性）：1、在一个表单中，以下元素获取焦点后，form中的第一个input[submit]（重置了border属性，切前面没有input[image]）在IE6下会自动添加一个黑色的边框：【input[text]、input[password]、textarea、input[file]、s... 阅读全文

posted @ 2010-09-06 13:40 牧羊岛 阅读(1622) 评论(0) 推荐(0)

CSS 悬挂缩进

摘要：每个段落首行不缩进，其余各行都缩进一定距离的技术[代码] 阅读全文

posted @ 2010-08-30 12:10 牧羊岛 阅读(3192) 评论(0) 推荐(0)

IE Haslayout 拥有布局

摘要：IE的haslayout让人很蛋疼，所以这里具体不说了，这里[拥有布局 IE haslayout]有的是介绍！我就记录一下默认拥有layout的元素吧：<html>, <body><table>, <tr>, <th>, <td><img><hr><input>, <button>... 阅读全文

posted @ 2010-06-29 15:53 牧羊岛 阅读(849) 评论(0) 推荐(0)

APNG

摘要：APNG？是png？哦，是gif和png的杂交后代！！以上属于胡言乱语！何为APNG，WJ百科这样解释：APNGAPNG（Animated Portable Network Graphics）是一个基于PNG（Portable Network Graphics）的位图动画格式，扩展方法类似主要用于网页的GIF 89a，仍对传统 PNG保留向下兼容。第1帧是标准的单幅PNG图像，因此只支持原版PNG... 阅读全文

posted @ 2010-06-24 13:17 牧羊岛 阅读(8737) 评论(0) 推荐(0)

层定位方式让div在页面居中

摘要：昨天的一道面试题，还是试卷上的，把我搞郁闷了，以前看过，但是没有实践，看来要多实践啊。效果：代码：[代码]去掉d2的注释就知道居中的原理了，肯定还有其他方法，再议。。 阅读全文

posted @ 2010-06-23 12:34 牧羊岛 阅读(703) 评论(0) 推荐(0)

解读淘宝的面试题-使用纯CSS实现垂直居中

摘要：原题CSS：使用纯CSS实现未知尺寸的图片(但高宽都小于200px)在200px的正方形容器中水平和垂直居中。想起了vertical-align:middle;但是不行，后来才知道还要display:table-cell;才可以，但是display:table-cell;这个在IE是没有用的，于是就想用line-height来解决，无果。看答案：[代码]淘宝招聘官评语：很遗憾，这个解法用到了css... 阅读全文

posted @ 2010-06-04 17:07 牧羊岛 阅读(1087) 评论(0) 推荐(0)

使用margin:0 auto页面居中在IE中的问题

摘要：首先说说页面居中的实现方式，排除IE5.5，可以使用下面的方法[代码]或者这样：[代码]两种方法在效果上是一样的，但是今天遇到了这样一个问题：我使用第一种方法让页面居中；调试环境为Internet Explorer 6.0 (6.00.2900.5512) (32-bit);在新闻列表页单击某一条新闻，在新窗口打开，显示正常；但IE6默认的打开方式不是窗口最大化，然后再去单击“最大化&... 阅读全文

posted @ 2010-06-02 10:46 牧羊岛 阅读(4722) 评论(0) 推荐(2)

Js和Css的压缩

摘要：有需求就去Google，于是总结如下YUI Compressor 貌似基于Java的，还没来得及用，但据说很有名，好像是个Js库吧；TBCompressor 淘宝使用的，基于YUI Compressor也需要Java环境支持；三角猫's Blog中的web20_tool 起码是软件方式的，比较容易接受； 阅读全文

posted @ 2010-05-10 09:44 牧羊岛 阅读(195) 评论(0) 推荐(0)

这个叫双飞翼布局？

摘要：关于双飞翼布局几个补充布局防止链接失效：文件代码 阅读全文

posted @ 2010-05-06 15:30 牧羊岛 阅读(444) 评论(0) 推荐(0)

ie6不支持label

摘要：Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--><label><input type="checkbox" value="时装模特" name="ModelType[]">时装模特</label>如此这般，点击文字不会勾选复选框，只有IE6不支持，哎！待研究~原来ie中是这样使用的：<input id="ck_0" typ 阅读全文

posted @ 2010-04-23 12:54 牧羊岛 阅读(1822) 评论(0) 推荐(0)

有关line-height

摘要：今天看到了这样一种说法：子元素继承在没有定义line-height 的情况下，继承父元素的 line-height，但是继承来的 line-height 如果是以百分比来表示的，那么这个百分比是基于父元素的字体大小，如果父元素中没有定义字体大小，那么 line-height 的基准会一直上溯，直到默认字体大小。但我感觉：如果子元素没有定义line-height ，他将继承父元素的 line-hei... 阅读全文

posted @ 2010-04-08 11:23 牧羊岛 阅读(185) 评论(0) 推荐(0)

使用Float布局容器高度出错的决办法

摘要：这个问题应该是使用标准布局发生兼容性问题的“典范”了，做网页的人几乎都遇见过，我在做页面的时候也遇见过。因为父元素内所有的子元素都浮动了，所以父元素计算不到子元素的高度;导致父元素没有获得高度，没有高度就局限了background与border的显示区域，同时也有可能出现其他莫名其妙的问题。产生条件：父元素内所有的子元素全部浮动（其他的就不多说了）解决办法一：给父元素设高度... 阅读全文

posted @ 2010-04-08 10:28 牧羊岛 阅读(483) 评论(0) 推荐(0)

IE6下li会继承ul属性的bug、产生条件、解决办法

摘要：代码：[代码]产生条件：在IE下 li 激活了haslayout但是 ul 没有激活haslayout 所以出现了问题..效果：（左边IE6右边火狐）解决方法：【把ul也haslayout】代码：[代码]我用的是[代码]问题解决！！2010-04-08 阅读全文

posted @ 2010-04-08 09:49 牧羊岛 阅读(1712) 评论(0) 推荐(0)

淘宝的一句CSS可以精简到如此，要学习啊

摘要：[代码] 阅读全文

posted @ 2010-03-30 13:20 牧羊岛 阅读(234) 评论(0) 推荐(0)

CSS冒泡窗口，有机会改成js的

摘要：http://files.cnblogs.com/ShepherdIsland/pop-tip-log.7thpark.com.zip代码 阅读全文

posted @ 2010-03-30 10:58 牧羊岛 阅读(274) 评论(1) 推荐(0)

IE6给png图片添加透明级别

摘要：方法1：代码方法2：http://labs.unitinteractive.com/unitpngfix.php（原来这个方法更完美，可以同时包含背景图片）但是，作为代价，背景图片的background-position属性等将失去作用。哎！貌似也不是很完美！用法：[代码]还要注意js文件里面的图片路径[代码]下载地址：http://labs.unitinteractive.com/downloa... 阅读全文

posted @ 2010-03-30 10:49 牧羊岛 阅读(275) 评论(0) 推荐(0)

1 2 下一页