仓酷云

标题: 来谈谈：凑合CSS兼容成绩的十个超等技能 [打印本页]

作者: 谁可相欹 时间: 2015-1-16 07:38
标题: 来谈谈：凑合CSS兼容成绩的十个超等技能
Table布局灵活性不大，你只能遵循tabletrtd的格式。而div你可以divulli也可以olli还可以ulli……但标准语法最好有序的写。
破洛洛文章简介：1、针对firefoxie6ie7的css款式：如今年夜部分都是用!important来hack，关于ie6和firefox测试能够一般显现，可是ie7对!important能够准确注释，会招致页面没按请求显现！找到一个针对IE7不错的hack体例就是利用“*+html”，如今用IE7扫瞄一下，应当没有成绩了如今写
1、针对firefoxie6ie7的css款式
　　如今年夜部分都是用!important来hack，关于ie6和firefox测试能够一般显现，可是ie7对!important能够准确注释，会招致页面没按请求显现！找到一个针对IE7不错的hack体例就是利用“*+html”，如今用IE7扫瞄一下，应当没有成绩了如今写一个CSS能够如许：

ExampleSourceCode
#abc{color:#333;}/*Moz*/
*html#abc{color:#666;}/*IE6*/
*+html#abc{color:#999;}/*IE7*/
那末在firefox下字体色彩显现为#333，IE6下字体色彩显现为#666，IE7下字体色彩显现为#999。
2、CSS结构中的居中成绩
　　次要的款式界说以下：

ExampleSourceCode
body{TEXT-ALIGN:center;}
#center{MARGIN-RIGHT:auto;MARGIN-LEFT:auto;}
　　申明：起首在父级元素界说TEXT-ALIGN:center;这个的意义就是在父级元素内的内容居中；关于IE如许设定就已能够了。
　　但在mozilla中不克不及居中。办理举措就是在子元素界说时分设准时再加上“MARGIN-RIGHT:auto;MARGIN-LEFT:auto;”
　　必要申明的是，假如你想用这个办法使全部页面要居中，倡议不要套在一个DIV里，你能够顺次拆出多个div，只需在每一个拆出的div里界说MARGIN-RIGHT:auto;MARGIN-LEFT:auto;就能够了。
3、盒模子

ExampleSourceCode
#box{
;
//forie6.0-width:500px;
//forff+ie6.0
}
#box{
>//forff
;
//forff+ie6.0
width/**/:500px;
//forie6.0-
}
4、浮动ie6发生的双倍间隔

ExampleSourceCode
#box{float:left;;margin:000100px;
//这类情形之下IE会发生200px的间隔display:inline;//使浮动疏忽}
　　这里细说一下block,inline两个元素,Block元素的特性是:老是在新行上入手下手,高度,宽度,行高,边距都能够把持(块元素);Inline元素的特性是:和其他元素在统一行上,…不成把持(内嵌元素);
　　#box{display:block;//能够为内嵌元素摹拟为块元素display:inline;//完成统一行分列的的效果diplay:table;

破洛洛文章简介：1、针对firefoxie6ie7的css款式：如今年夜部分都是用!important来hack，关于ie6和firefox测试能够一般显现，可是ie7对!important能够准确注释，会招致页面没按请求显现！找到一个针对IE7不错的hack体例就是利用“*+html”，如今用IE7扫瞄一下，应当没有成绩了如今写

5、IE与宽度和高度的成绩
　　IE不认得min-这个界说，但实践上它把一般的width和height看成有min的情形来使。如许成绩就年夜了，假如只用宽度和高度，一般的浏览器里这两个值就不会变，假如只用min-width和min-height的话，IE上面基本即是没有设置宽度和高度。好比要设置背景图片，这个宽度是对照主要的。要办理这个成绩，能够如许：

ExampleSourceCode
#box{;80px;height:35px;}
html>body#box{;auto;height:auto;min-80px;min-height:35px;}
6、页面的最小宽度
　　min-width是个十分便利的CSS命令，它能够指定元素最小也不克不及小于某个宽度，如许就可以包管排版一向准确。但IE不认得这个，而它实践上把width当作最小宽度来使。为了让这一命令在IE上也能用，能够把一个<div>放到<body>标签下，然后为div指定一个类：
　　然后CSS如许计划：

ExampleSourceCode
#container{
min-;600px;
;xpression(document.body.clientWidth<600?“600px”:“auto”);
}
　　第一个min-width是一般的；但第2行的width利用了Javascript，这只要IE才认得，这也会让你的HTML文档不太正轨。它实践上经由过程Javascript的判别来完成最小宽度。
7、扫除浮动

ExampleSourceCode
.hackbox{
display:table;
//将工具作为块元素级的表格显现
}
大概
.hackbox{
clear:both;
}
　　大概到场:after（伪工具）,设置在工具后产生的内容，一般和content共同利用，IE不撑持此伪工具，非Ie扫瞄器撑持，以是其实不影响到IE/WIN扫瞄器。这类的最贫苦的

ExampleSourceCode
……#box:after{
content:“.”;
display:block;
height:0;
clear:both;
visibility:hidden;
}

破洛洛文章简介：1、针对firefoxie6ie7的css款式：如今年夜部分都是用!important来hack，关于ie6和firefox测试能够一般显现，可是ie7对!important能够准确注释，会招致页面没按请求显现！找到一个针对IE7不错的hack体例就是利用“*+html”，如今用IE7扫瞄一下，应当没有成绩了如今写

8、DIV浮动IE文本发生3象素的bug
　　右边工具浮动，右侧接纳外补钉的右边距来定位，右侧工具内的文本会离右边有3px的间距.

ExampleSourceCode
#box{
float:left;
;}
#left{
float:left;
;}
#right{
;
}
*html#left{
margin-right:-3px;
//这句是关头
}
HTML代码
<DIVid=box>
<DIVid=left></DIV>
<DIVid=right></DIV>
</DIV>
9、属性选择器(这个不克不及算是兼容,是埋没css的一个bug)

ExampleSourceCode
p[id]{}div[id]{}
p[id]{}div[id]{}
　　这个关于IE6.0和IE6.0以下的版本都埋没,FF和OPera感化
　　属性选择器和子选择器仍是有区分的,子选择器的局限从情势来讲减少了,属性选择器的局限对照年夜,如p[id]中,一切p标签中有id的都是一样式的.
10、IE捉迷躲的成绩
　　当div使用庞大的时分每一个栏中又有一些链接，DIV等这个时分简单产生捉迷躲的成绩。
　　有些内容显现不出来，当鼠标选择这个地区是发明内容的确在页面。
　　办理举措：对#layout利用line-height属性大概给#layout利用流动高和宽。页面布局只管复杂。

CSS非常容易编写。你可以象写html代码一样轻松地编写CSS。

作者: 柔情似水 时间: 2015-1-18 06:43
还是在Dreamweaver所见即所得添加链接是，可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。

作者: admin 时间: 2015-1-25 17:36
经过两天的学习，总算对Dreamweaver有进一步的了解了，心中不免有些激动。今天和其他几位老师交流了一下，感觉受益匪浅.

作者: 兰色精灵 时间: 2015-2-3 12:36
Adobe Dreamweaver CS5 软件使设计人员和开发人员能充满自信地构建基于标准的网站。由于同新的 Adobe CS Live 在线服务 Adobe BrowserLab 集成。

作者: 小魔女 时间: 2015-2-9 02:29
直接用代码建立链接，如：可以直接输入 <a herf = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"red.html\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\">红色的网页 12、插入标签法建立链接，可以再选中文字后在代码中插入html标签，页元素<a>.也可以按ctrl+t进入html标签插入方法之后输入代码即可。

作者: 变相怪杰 时间: 2015-2-26 19:04
只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。

作者: 爱飞 时间: 2015-3-8 17:07
还是在Dreamweaver所见即所得添加链接是，可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。

作者: 若相依 时间: 2015-3-16 08:31
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，在编辑时能同时看到源码和设计界面，非常方便新手学习制作网页。

作者: 飘灵儿 时间: 2015-3-22 22:05
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器，在编辑时能同时看到源码和设计界面，非常方便新手学习制作网页。

欢迎光临仓酷云 (http://ckuyun.com/)