【CSS计数器(序列数字字符自动递增)详解———张鑫旭】的更多相关文章

CSS计数器(序列数字字符自动递增)详解———张鑫旭

by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=4303 一.挖坟不可耻 CSS计数器不是什么新鲜玩意了,早在10年春暖花开的时候,我写的“CSS content内容生成技术以及应用”一文就要提到(见下图),不过当时是作为其中一员介绍.就像例行的溜新同事一样,虽然黑如焦炭的我在自我介绍的时候给新同事留下了深刻印象,但由于介绍的同事茫茫多,我只是其中一员.很自然,个把月之…

CSS流体(自适应)布局下宽度分离原则——张鑫旭

by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1463 一.简短的前言 之前曾作有“页面重构鑫三无准则之无宽度准则”一文,属于流体布局系列中的偏理论性的文章,本文也是这种性质的,可谓是“无宽度准则”一文的延续. “无宽度准则”是说内部元素不要定宽,但是,除非你的页面是像google的产品页面一样都是100%自适应的,那么页面的终归会有一个固定的宽度值,一般出现在页面的…

[转] 小tip: 使用CSS将图片转换成模糊(毛玻璃)效果 ---张鑫旭

by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=3804 去年盛夏之时,曾写过“小tip: 使用CSS将图片转换成黑白”一文,本文的模式以及内容其实走得是类似路线.CSS3 → SVG → IE filter → canvas. 前段时间,iOS7不是瓜未熟就落地了嘛,然后捡瓜的人很多,然后国内外开始了各种探讨,从界面到动画,从兼容到实现等.其中,“毛玻璃”一次梆梆出世…

您可能不知道的CSS元素隐藏“失效”以其妙用——张鑫旭

一.CSS元素隐藏 在CSS中,让元素隐藏(指屏幕范围内肉眼不可见)的方法很多,有的占据空间,有的不占据空间:有的可以响应点击,有的不能响应点击.后宫选秀——一个一个看. { display: none; /* 不占据空间,无法点击 */ } { visibility: hidden; /* 占据空间,无法点击 */ } { position: absolute; clip:rect(1px 1px 1px 1px); /* 不占据空间,无法点击 */ } { position: absolut…

CSS counter计数器(content目录序号自动递增)详解

一.CSS计数器三角关系 CSS计数器只能跟content属性在一起的时候才有作用,而content属性貌似专门用在before/after伪元素上的.于是,就有了,“计数器↔伪元素↔content属性”的铁三角关系. 二.CSS计数器成员 举例班级中成员依次报名 其中有这么几个关键点:1. 班级命名.总不能六脉神剑一指,你,侬,汝来称呼吧~有个称呼,如生信4班,就知道谁的是谁了.2. 报数规则.1,2,3,4递增报数,还是1,2,1,2报数,让班级的人知道.3. 开始报数.不发口令,大眼瞪小眼…

Oracle数据库中序列(SEQUENCE)的用法详解

Oracle数据库中序列(SEQUENCE)的用法详解   在Oracle数据库中,序列的用途是生成表的主键值,可以在插入语句中引用,也可以通过查询检查当前值,或使序列增至下一个值.本文我们主要介绍了序列的用法,希望能够对您有所帮助. 在Oracle数据库中,什么是序列呢?它的用途是什么?序列(SEQUENCE)其实是序列号生成器,可以为表中的行自动生成序列号,产生一组等间隔的数值(类型为数字).其主要的用途是生成表的主键值,可以在插入语句中引用,也可以通过查询检查当前值,或使序列增至下一个值.…

CSS进阶内容—浮动和定位详解

CSS进阶内容-浮动和定位详解 我们在学习了CSS的基本知识和盒子之后,就该了解一下网页的整体构成了 当然如果没有学习之前的知识,可以到我的主页中查看之前的文章:秋落雨微凉 - 博客园 CSS的三种布局流派 网页布局的本质就是用CSS控制盒子的摆放来形成页面 CSS提供了三种流派来控制盒子: 普通流 浮动 定位 所谓普通流就是我们前面所学习的内容: 标签按照规定好的默认方式排序 块级元素独占一行 行级元素顺序排列,遇到父元素边缘换行 接下来让我们走进浮动和定位的世界 浮动 首先我们为什么需要浮动…

《网页设计基础——CSS的四种引入方式详解》

网页设计基础--CSS的四种引入方式详解     一.行内式:   规则: 1. 行内式是所有样式方法中最为直接的一种,它直接对HTML的标记使用style属性,然后将CSS代码直接写在其中.   格式: <html> <head> <title>页面标题</title> </head> <body> <p style="color:#FF0000; font-size:66px">使用行内样式引入CS…

可缺省的CSS布局——张鑫旭

一.技术不难.意识很难 有些东西的东西的实现,难的不是原料.技术:而是想不到,或者说意识不到. 例如下面这个简单而又神奇的魔术: 是吧.搞通了,才发现,哦~原来这么回事,很简单的嘛,我也可以实现的!其实,简单吗?不简单,很难,难在你想不到这个魔术idea, 虽然看上去实现很简单. 同样的,在CSS布局的世界里,也有类似的情况.有些东西并不是实现有多难,而是想不到.意识不到. 记住,重要的是意识. 二.简单的开胃菜-装饰元素可缺省 花里胡哨的东西在靠谱的网站已不常见,因此,要找个很纯粹的装饰性元素…

[css]【转载张鑫旭】我是如何对网站CSS进行架构的

一.写在前面的 都是自己积累形成的一些东西,可能带有明显的个人印记.不是专业内容,不是权威指南,只是展示一点自己的观点,借此希望能与各位优秀的同行交流看法,见解.以得到进步与提高. 二.我所知的一些过往的做法 关于如何处理网站的CSS,各个网站做法都不一样,这随着网站的性质及大小不同,公司前人留下的规范不同,以及CSS工程师的眼界不同而有所不同.由于我从业经历有限,所知甚浅,只能说些肤浅业余的内容,不准确之处欢迎指出. 就CSS文件而言,有的网站分为header.css, body.css, f…