仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 1484|回复: 9
打印 上一主题 下一主题

[DIV+CSS] 来讲讲:CSS Hack汇总快查

[复制链接]
跳转到指定楼层
楼主
发表于 2015-1-16 00:14:09 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
Table中布局中,垃圾代码会很多,一些修饰的样式及布局的代码混合一起,很不利于直观。而Div更能体现样式和结构相分离,结构的重构性强。
*:lang(zh)select{font:12px!important;}/*FF,OP可见*/
select:empty{font:12px!important;}/*safari可见*/
这里select是选择符,依据情形改换。第二句是MAC上safari扫瞄器独占的。
仅IE7辨认
*+html{…}
劈面临必要只针对IE7做款式的时分就能够接纳这个HACK。
IE6及IE6以下辨认
*html{…}
这个中央要出格注重良多田主都写了是IE6的HACK实在IE5.x一样能够辨认这个HACK。别的扫瞄器不辨认。
html/**/>bodyselect{……}
这句与上一句的感化不异。
仅IE6不辨认
select{display/*IE6不辨认*/:none;}
这里次要是经由过程CSS正文分隔一个属性与值,流释在冒号前。
仅IE6与IE5不辨认
select/**/{display/*IE6,IE5不辨认*/:none;}
这里与下面一句分歧的是在选择符与花括号之间多了一个CSS正文。
仅IE5不辨认
select/*IE5不辨认*/{display:none;}
这一句是在上一句中往失落了属性区的正文。只要IE5不辨认
盒模子办理办法
selct{width:IE5.x宽度;voice-family:""}"";voice-family:inherit;width:准确宽度;}
盒模子的扫除办法不是经由过程!important来处置的。这点要明白。
扫除浮动
select:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
在Firefox中,当子级都为浮动时,那末父级的高度就没法完整的包住全部子级,那末这时候用这个扫除浮动的HACK来对父级做一次界说,那末就能够办理这个成绩
截字省略号
select{-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
这个是在越出长度后会自行的截失落多出部分的笔墨,并以省略号开头,很好的一个手艺。只是今朝Firefox其实不撑持。
只要Opera辨认
@mediaalland(min-width:0px){select{……}}
针对Opera扫瞄器做独自的设定。
以上都是写CSS中的一些HACK,这些都是用来办理部分的兼容性成绩,假如但愿把兼容性的内容也分别出来,无妨试一下上面的几种过滤器。这些过滤器有的是写在CSS中经由过程过滤器导进出格的款式,也有的是写在HTML中的经由过程前提来链接或是导进必要的补钉款式。
IE5.x的过滤器,只要IE5.x可见

@mediatty{
i{content:"";/*""*/}}@importie5win.css;/*";}
}/**/
IE5/MAC的过滤器,一样平常用不着
[Copytoclipboard][-]CODE:
/**//*/
@import"ie5mac.css";
/**/
IE的if前提Hack
<!--[ifIE]>OnlyIE<![endif]-->
一切的IE可辨认
<!--[ifIE5.0]>OnlyIE5.0<![endif]-->
只要IE5.0能够辨认
<!--[ifgtIE5.0]>OnlyIE5.0+<![endif]-->
IE5.0包换IE5.5都能够辨认
<!--[ifltIE6]>OnlyIE6-<![endif]-->
仅IE6可辨认
<!--[ifgteIE6]>OnlyIE6/+<![endif]-->
IE6和IE6以下的IE5.x都可辨认
<!--[iflteIE7]>OnlyIE7/-<![endif]-->
仅IE7可辨认
以上内容大概其实不周全,接待人人能和我一同把这些技能都汇总起来,为今后事情的查询供应一个便利,同时在这里感激那些研讨出这些HACK的作者们

</p>
提高易用性。使用CSS可以结构化HTML,例如:标签只用来控制段落,heading标签只用来控制标题,table标签只用来表现格式化的数据等等。
金色的骷髅 该用户已被删除
沙发
发表于 2015-1-16 19:39:41 | 只看该作者

来讲讲:CSS Hack汇总快查

只要我们努力,无论是怎样的艰难险阻,成功依然会迎面直击。在刚开始时我觉得dreamweavermxXX很难理解。
冷月葬花魂 该用户已被删除
板凳
发表于 2015-1-18 22:31:50 | 只看该作者
您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别,但它同时也存在着致命的弱点。
爱飞 该用户已被删除
地板
发表于 2015-1-27 21:54:22 | 只看该作者
学Dreamweaver技术的过程其实是一个增加信心的过程。
老尸 该用户已被删除
5#
发表于 2015-2-5 15:39:10 | 只看该作者
您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别,但它同时也存在着致命的弱点。
深爱那片海 该用户已被删除
6#
发表于 2015-2-12 20:15:25 | 只看该作者
Dreamweaver由MX版本开始使用Opera软件公司的排版引擎“Presto”作为网页预览。
飘飘悠悠 该用户已被删除
7#
发表于 2015-3-3 10:08:51 | 只看该作者
每天上网看着那样多的网页,于是我才下定决心选择了网页制作这一门课程,目的就是希望以后能够做出一个完美的网页来。
8#
 楼主| 发表于 2015-3-11 10:33:00 | 只看该作者
这个过程其实就是交流的过程。所有的这些都需要花时间。在面对完全陌生的软件时,就要多花时间对其产生初步的印象。此外,多操作也是非常重要的。
飘灵儿 该用户已被删除
9#
发表于 2015-3-18 12:40:38 | 只看该作者
由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。
admin 该用户已被删除
10#
发表于 2015-3-26 02:56:58 | 只看该作者
不管老师做怎样的解释,而我却对它感到很是吃力,诸如里面有许多不知道的功能。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-11-15 00:22

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表