mysql查詢字符串調換語句小結(數據庫字符串調換)。本站提示廣大學習愛好者:(mysql查詢字符串調換語句小結(數據庫字符串調換))文章只能為提供參考,不一定能成為您想要的結果。以下是mysql查詢字符串調換語句小結(數據庫字符串調換)正文
關於web2.0的過度,請盡可能用xhtml格局寫代碼,並且DOCTYPE 影響 CSS 處置,作為W3C的尺度,必定要加DOCTYPE申明.
CSS技能
1.div的垂直居中成績
vertical-align:middle; 將行距增長到和全部DIV一樣高 line-height:200px; 然後拔出文字,就垂直居中了。缺陷是要掌握內容不要換行
2. margin加倍的成績
設置為float的div在ie下設置的margin會加倍。這是一個ie6都存在的bug。處理計劃是在這個div外面加上display:inline;
例如:
<#div id=”imfloat”>
響應的css為
#IamFloat{
float:left;
margin:5px;/*IE下懂得為10px*/
display:inline;/*IE下再懂得為5px*/}
3.浮動ie發生的雙倍間隔
#box{ float:left; width:100px; margin:0 0 0 100px; //這類情形之下IE會發生200px的間隔 display:inline; //使浮動疏忽}
這裡細說一下block與inline兩個元素:block元素的特色是,老是在新行上開端,高度,寬度,行高,邊距都可以掌握(塊元素);Inline元素的特色是,和其他元素在統一行上,弗成掌握(內嵌元素);
#box{ display:block; //可認為內嵌元素模仿為塊元素 display:inline; //完成統一行分列的後果 diplay:table;
4 IE與寬度和高度的成績
IE 不認得min-這個界說,但現實上它把正常的width和height看成有min的情形來使。如許成績就年夜了,假如只用寬度和高度,正常的閱讀器裡這兩 個值就不會變,假如只用min-width和min-height的話,IE上面基本等於沒有設置寬度和高度。
好比要設置配景圖片,這個寬度是比擬主要的。要處理這個成績,可以如許:
#box{ width: 80px; height: 35px;}html>body #box{ width: auto; height: auto; min-width: 80px; min-height: 35px;}
5.頁面的最小寬度
min -width是個異常便利的CSS敕令,它可以指定元素最小也不克不及小於某個寬度,如許就可以包管排版一向准確。但IE不認得這個,而它現實上把width當 做最小寬度來使。為了讓這一敕令在IE上也能用,可以把一個<div> 放到 <body> 標簽下,然後為div指定一個類, 然後CSS如許設計:
#container{ min-width: 600px; width:expression(document.body.clientWidth < 600? "600px": "auto" );}
第一個min-width是正常的;但第2行的width應用了Javascript,這只要IE才認得,這也會讓你的HTML文檔不太正軌。它現實上經由過程Javascript的斷定來完成最小寬度。
6.DIV浮動IE文本發生3象素的bug
右邊對象浮動,左邊采取外補釘的右邊距來定位,左邊對象內的文本會離右邊有3px的間距.
#box{ float:left; width:800px;}
#left{ float:left; width:50%;}
#right{ width:50%;}
*html #left{ margin-right:-3px; //這句是症結}
<div id="box">
<div id="left"></div>
<div id="right"></div>
</div>
7.IE捉迷藏的成績
當div運用龐雜的時刻每一個欄中又有一些鏈接,DIV等這個時刻輕易產生捉迷藏的成績。
有些內容顯示不出來,當鼠標選擇這個區域是發明內容確切在頁面。 處理方法:對#layout應用line-height屬性 或許給#layout應用固定高和寬。頁面構造盡可能簡略。
8.float的div閉合;消除浮動;自順應高度;
① 例如:<#div id=”floatA” ><#div id=”floatB” ><#div id=” NOTfloatC” >這裡的NOTfloatC其實不願望持續平移,而是願望往下排。(個中floatA、floatB的屬性曾經設置為 float:left;)
這段代碼在IE中毫無成績,成績出在FF。緣由是NOTfloatC並不是float標簽,必需將float標簽 閉合。在 <#div class=”floatB”> <#div class=”NOTfloatC”>之間加上 < #div class=”clear”>這個div必定要留意地位,並且必需與兩個具有float屬性的div同級,之間不克不及存在嵌套關系,不然會 發生異常。 而且將clear這類款式界說為為以下便可: .clear{ clear:both;}
②作為內部 wrapper 的 div 不要定逝世高度,為了讓高度能主動順應,要在wrapper外面加上overflow:hidden; 當包括float的 box的時刻,高度主動順應在IE下有效,這時候候應當觸發IE的layout公有屬性(萬惡的IE啊!)用zoom:1;可以做到,如許就到達了兼容。
例如某一個wrapper以下界說:
.colwrapper{ overflow:hidden; zoom:1; margin:5px auto;}
③關於排版,我們用得最多的css描寫能夠就是float:left.有的時刻我們須要在n欄的float div前面做一個同一的配景,比方:
<div id=”page”>
<div id=”left”></div>
<div id=”center”></div>
<div id=”right”></div>
</div>
比 如我們要將page的配景設置成藍色,以到達一切三欄的配景色彩是藍色的目標,然則我們會發明跟著left center right的向下拉長,而 page竟然保留高度不變,成績來了,緣由在於page不是float屬性,而我們的page因為要居中,不克不及設置成float,所以我們應當如許處理
<div id=”page”>
<div id=”bg” style=”float:left;width:100%”>
<div id=”left”></div>
<div id=”center”></div>
<div id=”right”></div>
</div>
</div>
再嵌入一個float left而寬度是100%的DIV處理之
④全能float 閉合(異常主要!)
關 於 clear float 的道理可拜見 [How To Clear Floats Without Structural Markup],將以下 代碼參加Global CSS 中,給須要閉合的div加上 class="clearfix" 便可,屢試不爽.
/* Clear Fix */
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix { display:inline-block; }
/* Hide from IE Mac */
.clearfix {display:block;}
/* End hide from IE Mac */
/* end of clearfix */
或許如許設置:.hackbox{ display:table; //將對象作為塊元素級的表格顯示}
11.高度不順應
高度不順應是當內層對象的高度產生變更時外層高度不克不及主動停止調理,特殊是當內層對象應用margin 或paddign 時。
例:
#box {background-color:#eee; }
#box p {margin-top: 20px;margin-bottom: 20px; text-align:center; }
<div id="box">
<p>p對象中的內容</p>
</div>
處理辦法:在P對象高低各加2個空的div對象CSS代碼:.1{height:0px;overflow:hidden;}或許為DIV加上border屬性。
12 .IE6下為何圖片下有閒暇發生
解 決這個BUG的辦法也有許多,可所以轉變html的排版,或許設置img 為display:block 或許設置vertical-align 屬性為 vertical-align:top | bottom |middle |text-bottom 都可以處理.
13.若何對齊文本與文本輸出框
加上 vertical-align:middle;
<style type="text/css">
<!--
input {
width:200px;
height:30px;
border:1px solid red;
vertical-align:middle;
}
-->
</style>
14.web尺度中界說id與class有甚麼差別嗎
一.web尺度中是不允許反復ID的,好比 div id="aa" 不允許反復2次,而class 界說的是類,實際上可以無窮反復, 如許須要屢次援用的界說即可以應用他.
二.屬性的優先級成績
ID 的優先級要高於class,看下面的例子
三.便利JS等客戶端劇本,假如在頁面中要對某個對象停止劇本操作,那末可以給他界說一個ID,不然只能應用遍歷頁面元素加上指定特定屬性來找到它,這是絕對糟蹋時光資本,遠遠不如一個ID來得簡略.
15. LI中內容跨越長度後以省略號顯示的辦法
此辦法實用與IE與OP閱讀器
<style type="text/css">
<!--
li {
width:200px;
white-space:nowrap;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
overflow: hidden;
}
-->
</style>
16.為何web尺度中IE沒法設置轉動條色彩了
處理方法是將body換成html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
<!--
html {
scrollbar-face-color:#f6f6f6;
scrollbar-highlight-color:#fff;
scrollbar-shadow-color:#eeeeee;
scrollbar-3dlight-color:#eeeeee;
scrollbar-arrow-color:#000;
scrollbar-track-color:#fff;
scrollbar-darkshadow-color:#fff;
}
-->
</style>
17.為何沒法界說1px閣下高度的容器
IE6下這個成績是由於默許的行高形成的,處理的辦法也有許多,例如:overflow:hidden | zoom:0.08 | line-height:1px
18.怎樣樣能力讓層顯示在FLASH之上呢
處理的方法是給FLASH設置通明
<param name="wmode" value="transparent" />
19.如何使一個層垂直居中於閱讀器中
這裡我們應用百分比相對定位,與外補釘負值的辦法,負值的年夜小為其本身寬度高度除以二
<style type="text/css">
<!--
div {
position:absolute;
top:50%;
lef:50%;
margin:-100px 0 0 -100px;
width:200px;
height:200px;
border:1px solid red;
}
-->
</style>
FF與IE
1. Div居中成績
div設置 margin-left, margin-right 為 auto 時曾經居中,IE 不可,IE須要設定body居中,起首在父級元素界說text-algin: center;這個的意思就是在父級元素內的內容居中。
2.鏈接(a標簽)的邊框與配景
a 鏈接加邊框和配景色,需設置 display: block, 同時設置 float: left 包管不換行。參照 menubar, 給 a 和 menubar 設置高度是為了不底邊顯示錯位, 若不設 height, 可以在 menubar 中拔出一個空格。
3.超鏈接拜訪事後hover款式就不湧現的成績
被點擊拜訪過的超鏈接款式不在具有hover和active了,許多人應當都碰到過這個成績,處理辦法是轉變CSS屬性的分列次序: L-V-H-A
Code:
<style type="text/css">
<!--
a:link {}
a:visited {}
a:hover {}
a:active {}
-->
</style>
4. 游標手指cursor
cursor: pointer 可以同時在 IE FF 中顯示游標手指狀, hand 僅 IE 可以
5.UL的padding與margin
ul標簽在FF中默許是有padding值的,而在IE中只要margin默許有值,所以先界說 ul{margin:0;padding:0;}就可以處理年夜部門成績
6. FORM標簽
這 個標簽在IE中,將會主動margin一些邊距,而在FF中margin則是0,是以,假如想顯示分歧,所以最好在css中指定margin和 padding,針對下面兩個成績,我的css中普通起首都應用如許的款式ul,form{margin:0;padding:0;}給界說逝世了,所今後 面就不會為這個頭疼了.
7. BOX模子說明紛歧致成績
在FF和IE 中的BOX模子說明紛歧致招致相差2px處理辦法:div{margin:30px!important;margin:28px;} 留意這兩個 margin的次序必定不克不及寫反, important這個屬性IE不克不及辨認,但其余閱讀器可以辨認。所以在IE下其實說明成如許: div {maring:30px;margin:28px}反復界說的話依照最初一個來履行,所以弗成以只寫margin:xx px!important;
#box{ width:600px; //for ie6.0- w\idth:500px; //for ff+ie6.0}
#box{ width:600px!important //for ff width:600px; //for ff+ie6.0 width /**/:500px; //for ie6.0-}
8.屬性選擇器(這個不克不及算是兼容,是隱蔽css的一個bug)
p[id]{}div[id]{}
這個關於IE6.0和IE6.0以下的版本都隱蔽,FF和OPera感化.屬性選擇器和子選擇器照樣有差別的,子選擇器的規模從情勢來講減少了,屬性選擇器的規模比擬年夜,如p[id]中,一切p標簽中有id的都是異樣式的.
9.最狠的手腕 - !important;
假如其實沒有方法處理一些細節成績,可以用這個辦法.FF關於”!important”會主動優先解析,但是IE則會疏忽.以下
.tabd1{
background:url(/res/images/up/tab1.gif) no-repeat 0px 0px !important; /*Style for FF*/
background:url(/res/images/up/tab1.gif) no-repeat 1px 0px; /* Style for IE */}
值得留意的是,必定要將xxxx !important 這句放置在另外一句之上,下面曾經提過
10.IE,FF的默許值成績
或 許你一向在埋怨為何要專門為IE和FF寫分歧的CSS,為何IE如許讓人頭疼,然後一邊寫css,一邊詛咒誰人可愛的M$ IE.其實關於css的標 准支撐方面,IE並沒有我們想象的那末可愛,症結在於IE和FF的默許值紛歧樣罷了,控制了這個技能,你會發明寫出兼容FF和IE的css其實不是那末困 難,也許關於簡略的css,你完整可以不消”!important”這個器械了。
我們都曉得,閱讀器在顯示網頁的時刻,都邑依據網頁的 css款式表來決議若何顯示,然則我們在款式表中未必會將一切的元素都停止了詳細的描寫,固然也沒有需要那末做,所以關於那些沒有描寫的屬性,閱讀器將采 用內置默許的方法來停止顯示,比方文字,假如你沒有在css中指定色彩,那末閱讀器將采取黑色或許體系色彩來顯示,div或許其他元素的配景,假如在 css中沒有被指定,閱讀器則將其設置為白色或許通明,等等其他不決義的款式均如斯。所以有許多器械湧現FF和IE顯示紛歧樣的基本緣由在於它們的默許顯 示紛歧樣,而這個默許款式該若何顯示我曉得在w3中有無對應的尺度來停止劃定,是以關於這點也就別去見怪IE了。
11.為何FF下文本沒法撐開容器的高度
尺度閱讀器中固定高度值的容器是不會象IE6裡那樣被撐開的,那我又想固定高度,又想能被撐開須要如何設置呢?方法就是去失落height設置min-height:200px; 這裡為了照料不熟悉min-height的IE6 可以如許界說:
{
height:auto!important;
height:200px;
min-height:200px;
}
12.FireFox下若何使持續長字段主動換行
盡人皆知IE中直接應用 word-wrap:break-word 便可以了, FF中我們應用JS拔出的辦法來處理
<style type="text/css">
<!--
div {
width:300px;
word-wrap:break-word;
border:1px solid red;
}
-->
</style>
<div id="ff">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
<scrīpt type="text/javascrīpt">
/* <![CDATA[ */
function toBreakWord(el, intLen){
var ōbj=document.getElementById(el);
var strContent=obj.innerHTML;
var strTemp="";
while(strContent.length>intLen){
strTemp+=strContent.substr(0,intLen)+" ";
strContent=strContent.substr(intLen,strContent.length);
}
strTemp+=" "+strContent;
obj.innerHTML=strTemp;
}
if(document.getElementById && !document.all) toBreakWord("ff", 37);
/* ]]> */
</scrīpt>
13.為何IE6下容器的寬度和FF說明分歧呢
<?xml version="1.0" encoding="gb2312"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
<!--
div {
cursor:pointer;
width:200px;
height:200px;
border:10px solid red
}
-->
</style>
<div ōnclick="alert(this.offsetWidth)">讓FireFox與IE兼容</div>
問 題的差異在於容器的全體寬度有無將邊框(border)的寬度算在其內,這裡IE6說明為200PX ,而FF則說明為220PX,那畢竟是怎樣招致的 成績呢?年夜家把容器頂部的xml去失落就會發明本來成績出在這,頂部的聲名觸發了IE的qurks mode,關於qurks mode、 standards mode的相干常識,請參考:http: //www.microsoft.com/china/msdn/library/webservices/asp.net/
ASPNETusStan.mspx?mfr=true
IE6,IE7,FF
IE7.0 出來了,對CSS的支撐又有新成績。閱讀器多了,網頁兼容性更差了,疲於奔命的照樣我們 ,為處理IE7.0的兼容成績,找來了上面這篇文章: 如今我年夜 部門都是用!important來hack,關於ie6和firefox測試可以正常顯示,然則ie7對!important可以准確說明,會招致頁面沒 按請求顯示!上面是三個閱讀器的兼容性搜集.
第一種,是CSS HACK的辦法
height:20px; /*For Firefox*/
*height:25px; /*For IE7 & IE6*/
_height:20px; /*For IE6*/
留意次序。
如許也屬於CSS HACK,不外沒有下面如許簡練。
#example { color: #333; } /* Moz */
* html #example { color: #666; } /* IE6 */
*+html #example { color: #999; } /* IE7 */
第二種,是應用IE公用的前提正文
<!--其他閱讀器 -->
<link rel="stylesheet" type="text/css" href="css.css" />
<!--[if IE 7]>
<!-- 合適於IE7 -->
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]-->
<!--[if lte IE 6]>
<!-- 合適於IE6及一下 -->
<link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]-->
第三種,css filter的方法,以下為經典從國外網站翻譯過去的。.
新建一個css款式以下:
#item {
width: 200px;
height: 200px;
background: red;
}
新建一個div,並應用後面界說的css的款式:
<div id="item">some text here</div>
在body表示這裡參加lang屬性,中文為zh:
<body lang="en">
如今對div元素再界說一個款式:
*:lang(en) #item{
background:green !important;
}
如許做是為了用!important籠罩本來的css款式,因為:lang選擇器ie7.0其實不支撐,所以對這句話不會有任何感化,因而也到達了ie6.0下異樣的後果,然則很不幸地的是,safari異樣不支撐此屬性,所以須要參加以下css款式:
#item:empty {
background: green !important
}
:empty選擇器為css3的標准,雖然safari其實不支撐此標准,然則照樣會選擇此元素,不論能否此元素存在,如今綠色會如今在除ie各版本之外的閱讀器上。
對IE6和FF的兼容可以斟酌之前的!important 小我比擬愛好用第一種,簡練,兼容性比擬好