Wulin.com (www.vevb.com) บทความบทนำ: ทักษะการผลิตหน้าเว็บ: XHTML, CSS และ JS
รายละเอียด 1 ……………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………… - - -1. เมื่อข้อความและรูปภาพอยู่ในบรรทัดเดียวกันข้อความจะต้องจัดแนวกับด้านล่างของภาพและจำเป็นต้องเขียนเช่นนี้:
<li> จดจำรหัสผ่าน <img src = Align = bottom style = margin-bottom: -4px/> </li>
2. เมื่อข้อความและรูปภาพอยู่ในบรรทัดเดียวกันข้อความและรูปภาพจะต้องอยู่กึ่งกลางและเขียนเช่นนี้:
<li> จดจำรหัสผ่าน <img src = static/img/xyx.jpg allign = middle/> </li>
3. เปลี่ยนตัวแก้ไขที่เปิดโดยเมนูซอร์สโค้ด IE View
เปิดตัวแก้ไขรีจิสทรีและป้อน Regedit ในการเริ่มต้น
ค้นหาตำแหน่งต่อไปนี้: hkey_local_machinesoftwaremicrosof
สลับไปที่ IE เพื่อดูซอร์สโค้ดและคุณสามารถดูเอฟเฟกต์ได้
หากรายการชื่อ EditorEditor View Source ไม่มีคุณสามารถสร้างได้ด้วยตัวเอง
4. เพิ่มหน้าต่างให้สูงสุดโดยอัตโนมัติและเพิ่มระหว่าง <body> และ </body>::
<ภาษาสคริปต์ = JavaScript>
settimeout ('top.moveto (0,0)', 5000);
settimeout ('top.resizeto (screen.availwidth, screen.availheight)', 5000);
</script>
5. Window.opener เป็นรูปแบบหลักของแบบฟอร์มที่เปิดด้วย window.open
ตัวอย่างเช่นในรูปแบบ parentform parentform, pass window.open (subform.html) จากนั้นใน subform.html window.opener
มันหมายถึง parentform คุณสามารถตั้งค่าของแบบฟอร์มหลักหรือเรียกใช้วิธี JS ด้วยวิธีนี้
1, window.opener.test (); --- เรียกวิธีการทดสอบ () ในรูปแบบหลัก;
2. ถ้า Window.opener มีอยู่ให้ตั้งค่าของกล่องสต็อคใน ParentForm
if (window.opener &&! window.opener.closed)
-
window.opener.document.parentform.stockbox.value = สัญลักษณ์;
-
6. วิธีรีเฟรชหน้า
วิธีรีเฟรชหน้าใน JavaScript:
1 history.go (0)
2 location.reload ()
3 ตำแหน่ง = ตำแหน่ง
4 location.assign (ตำแหน่ง)
5 document.execcommand ('Refresh')
6 window.navigate (ตำแหน่ง)
7 สถานที่ตั้งอยู่ (สถานที่)
8 document.url = location.href
วิธีรีเฟรชหน้าโดยอัตโนมัติ:
1. การรีเฟรชหน้าอัตโนมัติ: เพิ่ม <meta http-equiv = refresh content = 20> ไปยังพื้นที่ <head>
2. การกระโดดหน้าอัตโนมัติ: เพิ่ม <meta http-equiv = refresh content = 20; url = http: //www.webjx.com> ไปยังพื้นที่ <head>
3.JS รีเฟรชหน้าโดยอัตโนมัติ
<ภาษาสคริปต์ = JavaScript>
ฟังก์ชั่น myrefresh ()
-
window.location.reload ();
-
settimeout ('myrefresh ()', 1,000); // ระบุรีเฟรชหนึ่งครั้งใน 1 วินาที
</script>
4.JS เฟรมเวิร์กรีเฟรช
a) รีเฟรชหน้าที่มีเฟรมสำหรับ
<ภาษาสคริปต์ = JavaScript>
parent.location.reload ();
</script>
b) หน้าต่างเด็กรีเฟรชหน้าต่างหลัก
<ภาษาสคริปต์ = JavaScript>
self.opener.location.reload ();
</script>
(หรือ <a href = javascript: opener.location.reload ()> รีเฟรช </a>)
c) รีเฟรชหน้าของเฟรมอื่น
<ภาษาสคริปต์ = JavaScript>
parent.Anher.location.location.reload ();
</script>
7. หากคุณใช้แฮ็ก CSS คุณควรรู้ว่าการตั้งชื่อด้วยขีดล่างเป็นการแฮ็ก หากคุณใช้ _style มันสามารถทำให้เบราว์เซอร์ส่วนใหญ่อยู่นอก IE ไม่สนใจคำจำกัดความของสไตล์นี้ดังนั้นการใช้ _ เป็นตัวคั่นเมื่อการตั้งชื่อไม่ได้มาตรฐาน ข้อความแสดงข้อผิดพลาดจะปรากฏขึ้นเมื่อทำการตรวจสอบ CSS
8. วิธีการเขียนคำอธิบายประกอบแบบมีเงื่อนไข
<!-[ถ้า! เช่น]> สามารถจดจำได้ยกเว้นเช่น <! [endif]->
<!-[ถ้าเช่น]> IEs ทั้งหมดสามารถระบุได้ <! [endif]->
<!-[ถ้าเช่น 5.0]> มีเพียง 5.0 เท่านั้นที่สามารถรับรู้ได้ <! [endif]->
9. วิธีการเขียนแฮ็ค CSS
ประเภทแรก:
.div {
ความเป็นมา: สีส้ม;
*พื้นหลัง: สีเขียว! สำคัญ;
*พื้นหลัง: สีน้ำเงิน;
-
ประเภทที่สอง:
.div {
มาร์จิ้น: 10px;
*มาร์จิ้น: 15px;
_margin: 15px;
-
ประเภทที่สาม:
#div {color: #333; -
*+html #div {color: #999; -
* html #div {color: #666; -
รายละเอียด 2 ………………………………………………………………………………………………………………………………………………………………………… - - -
1. IE6 และสิ่งต่อไปนี้ไม่รู้จัก: Hover Pseudo-Class นอกแท็ก ใน Firefox, IE7 สามารถทำได้อย่างถูกต้อง สารละลาย:
#SHOW LI.S1 {ชายแดน: 1PX SOLID #FF9900; พื้นหลัง:#454242;}
#SHOW LI.S2 {ชายแดน: 1PX SOLID #D9D8D8; พื้นหลัง:#312E2E;}
<li> </li>
2. set haslayout สำหรับองค์ประกอบ
ปัญหา IE6 (หรือ IE7) สามารถแก้ไขได้โดยการตั้งค่า Haslayout วิธีที่ง่ายที่สุดในการกำหนดค่า Haslayout สำหรับองค์ประกอบคือการเพิ่มความสูงหรือความกว้างของ CSS (แน่นอนว่าการซูมสามารถใช้งานได้ แต่นี่ไม่ใช่ส่วนหนึ่งของ CSS) ตัวอย่างเช่นตั้งค่าเป็นความสูง: 1% หากองค์ประกอบหลักไม่ได้ตั้งค่าความสูงความสูงทางกายภาพขององค์ประกอบจะไม่เปลี่ยนแปลง แต่มีคุณสมบัติ Haslayout อยู่แล้ว
3. ตัวละครปรากฏซ้ำ ๆ ใน IE6
ตรวจสอบให้แน่ใจว่าการแสดงผล: อินไลน์ถูกตั้งค่าเป็นองค์ประกอบลอยตัว
ใช้มาร์จิ้น-ขวา: -3px ในองค์ประกอบลอยตัว;
4. ลำดับความสำคัญของสไตล์
1. สไตล์อินไลน์ [1.0.0.0]
2. ตัวเลือก ID [0.1.0.0]
3. คลาส, แอตทริบิวต์, ตัวเลือกคลาสเทียม [0.0.1.0]
4. แท็กองค์ประกอบตัวเลือกองค์ประกอบหลอก [0.0.0.1]
5. วิธีการเขียน CSS ขององค์ประกอบหนึ่งในแนวตั้งหนึ่งองค์ประกอบ
#EXM {
ตำแหน่ง: สัมบูรณ์;
ซ้าย: 50%;
ด้านบน: 50%;
z-index: 1;
ความกว้าง: 200px;
ความสูง: 100px;
ขอบซ้าย: -100px;
ระยะขอบด้านบน: -52px;
-
6. ซูม: ปกติ | ตัวเลข
ตั้งค่าหรือดึงอัตราส่วนการปรับขนาดของวัตถุ การตั้งค่าหรือเปลี่ยนค่าคุณสมบัตินี้สำหรับวัตถุที่ได้รับการแสดงผลจะทำให้เนื้อหารอบวัตถุไหลอีกครั้ง แม้ว่าทรัพย์สินนี้จะไม่ได้รับการสืบทอด แต่ก็ส่งผลกระทบต่อวัตถุเด็กทั้งหมดของวัตถุ (เด็ก)
7. เมื่อรูปภาพและข้อความถูกจัดเรียงเคียงข้างกันข้อความรูปภาพควรอยู่กึ่งกลางในแนวตั้ง:
1> ตั้งค่าความสูงบรรทัด: ถึงความสูงของภาพหรือความสูงขององค์ประกอบหลักของภาพ
2> จากนั้นตั้งแนวตั้งแนวตั้ง: ตรงกลางใน CSS ของภาพ;
8. เมื่อองค์ประกอบ LI มีองค์ประกอบ IMG ช่องว่างจะปรากฏขึ้นภายใต้ IE6
วิธีแก้ปัญหา 1
ทำให้ LI ลอยและตั้งค่า IMG เป็นองค์ประกอบระดับบล็อก
วิธีแก้ปัญหา 2
ตั้งค่าขนาดตัวอักษรของ UL: 0;
วิธีแก้ปัญหา 3
ตั้งแนวตั้งแนวตั้งของ IMG: ด้านล่าง;
วิธีแก้ปัญหา 4
ตั้งค่าส่วนล่างของ IMG: -5px;
รายละเอียด 3 …………………………………………………………………………………………………………………………………………………………………………………………………………………………………………………… - - -
1. รูปแบบการเชื่อมโยงหลายมิติที่เข้าเยี่ยมชมโดยการคลิกไม่มีโฮเวอร์และใช้งานอยู่
วิธีแก้ปัญหา: เปลี่ยนลำดับของแอตทริบิวต์ CSS: LVHA
2. เขตข้อมูลยาวอย่างต่อเนื่องภายใต้ FF ไม่สามารถห่อได้โดยอัตโนมัติ
วิธีแก้ปัญหา: Word-wrap: break-word; overflow: ซ่อน;
3. ความสูงของภาชนะแม่ไม่สามารถปรับได้ภายใต้ FF
วิธีแก้ปัญหา: ล้างองค์ประกอบของเด็กที่ลอยอยู่
4. ช่องว่างถูกสร้างขึ้นด้านล่างรูปภาพภายใต้ IE
วิธีแก้ปัญหา: กำหนด IMG เป็นจอแสดงผล: บล็อกหรือแนวตั้ง-แนวตั้งเป็นด้านบน/ล่าง/กลาง/ข้อความด้านล่าง
กำหนดขนาดตัวอักษรของคอนเทนเนอร์ของผู้ปกครองเป็นศูนย์ขนาดตัวอักษร: 0
5. มีช่องว่าง 3px ระหว่างองค์ประกอบลอยตัวภายใต้ IE6 และองค์ประกอบที่ไม่ลอยอยู่ติดกัน
วิธีแก้ปัญหา: องค์ประกอบที่ไม่ลอยอยู่ติดกันถูกตั้งค่าให้ลอย;
องค์ประกอบลอยตัวถูกกำหนดเมื่อเทียบกับ IE6_MARGIN-Right: -3px;
6. เนื้อหา LI จะแสดงในจุดไข่ปลาหลังจากนั้นยาวเกินไป
วิธีแก้ปัญหา: พื้นที่สีขาว: NowRap; (ข้อความไม่ได้ห่อ) ข้อความที่ไหลผ่าน: Ellipsis; -o-text-overflow: Ellipsis; ล้น: ซ่อน;
7. ข้อความไม่สามารถอยู่กึ่งกลางในแนวตั้ง
การแก้ไข: ความสูงของเส้นและความสูงของภาชนะคือความสูงของเส้นเท่ากัน = ความสูง;
8. กล่องป้อนข้อความไม่สามารถจัดตำแหน่งกับข้อความที่อยู่ติดกันได้
วิธีแก้ปัญหา: ตั้งค่ากล่องอินพุตข้อความแนวตั้ง-แนวตั้ง: กลาง;
9. เช่นตั้งค่าสไตล์แถบเลื่อน
สารละลาย:
ร่างกาย{
Scrollbar-face-color:#F6F6F6;
Scrollbar-highlight-color: #FFF;
Scrollbar-shadow-color: #eeeeee;
Scrollbar-3dlight-color: #eeeeee;
แถบม้วนลูกศรสี:#000;
Scrollbar-Track-Color: #FFFF;
Scrollbar-Darkshadow-Color: #FFF;
-
10. IE6 ไม่สามารถกำหนดภาชนะที่มีความสูง 1px
วิธีแก้ปัญหา: ล้น: ซ่อน
ซูม: 0.8
ความสูงของสาย: 1px
รายละเอียด 4 ………………………………………………………………………………………………………………………………………………………………………… - - -
1. ให้เลเยอร์แสดงบนแฟลช
วิธีแก้ปัญหา: ตั้งค่าโปร่งใส <param name = wmode value = transparent /> หรือ <param name = wmode value = opaque /> สำหรับ Flash
2. ทำเลเยอร์กึ่งกลางในแนวตั้งในเบราว์เซอร์
วิธีแก้ปัญหา: ใช้การวางตำแหน่งเปอร์เซ็นต์สัมบูรณ์โดยมีค่าลบของแพตช์ภายนอก
ตำแหน่ง: สัมบูรณ์;
ด้านบน: 50%;
ซ้าย: 50%;
มาร์จิ้น: -100px auto auto -100px;
ความกว้าง: 200px;
ความสูง: 200px;
3. เพิ่มในรายการโปรด
วิธีแก้ปัญหา: <script type = text/javascript>
// <! [cdata [
ฟังก์ชั่นบุ๊คมาร์ค () {
var title = document.title
var url = document.location.href
if (window.sidebar) window.sidebar.addpanel (ชื่อ, url,);
อื่นถ้า (window.opera && window.print) {
var mbm = document.create_r_relement_x ('a');
mbm.setAttribute ('rel', 'แถบด้านข้าง');
mbm.setAttribute ('href', url);
MBM.SetAttribute ('ชื่อ' ชื่อ);
mbm.click ();}
อื่นถ้า (document.all) window.external.addfavorite (url, ชื่อเรื่อง);
-
-
</script>
<a href = JavaScript: bookmark ()> เพิ่มในรายการโปรด </a>
รายละเอียด 5 ………………………………………………………………………………………………………………………………………………………………………… - - -
1. วิธีการเขียนรายการข่าวทั่วไป:
<ul class = list>
<li> <span> 6 มิถุนายน 2549 </span> <a href =#> ชื่อข่าว 01 </a> </li>
<li> <span> 6 มิถุนายน 2549 </span> <a href =#> ชื่อข่าว 02 </a> </li>
<li> <pan> 6 มิถุนายน 2549 </span> <a href =#> ชื่อข่าว 03 </a> </li>
<li> <span> 6 มิถุนายน 2549 </span> <a href =#> ชื่อข่าว 04 </a> </li>
</ul>
2.IE ใช้การไล่ระดับสีพื้นหลังหน้า (FF และ Chrome ไม่รองรับ)
จากบนลงล่าง:
Body {Filter: Progid: dximagetransform.microsoft.gradient (gradientType = 0, startColorstr =#ffffff, endColorstr =#000000);}
จากบนซ้ายไปล่างขวา:
ตัวกรอง: alpha (style = 1, opacity = 25, finishOpacity = 100, startx = 50, finisonx = 100, starty = 50, finishy = 100); พื้นหลังสี: SkyBlue;}
จากซ้ายไปขวา
Body {Filter: Progid: Dximagetransform.microsoft.gradient (gradientType = 1, startColorstr =#ffffff, endColorstr =#000000);}
จากบนลงล่าง
style = ตัวกรอง: progid: dximagetransform.microsoft.gradient (gradientType = 0, startColorstr = สีน้ำเงิน, endColorstr = สีขาว);
3. รูปแบบของโฮเวอร์บรรลุเอฟเฟกต์ที่หลากหลายและสามารถใช้ได้อย่างยืดหยุ่น
#OUTER A {Border: 1px Solid #069;}
#outer A: Hover {Border: 1px Dashed #C00;}
4. Border: ไม่มี; ความแตกต่างจากชายแดน: 0
ความแตกต่างของประสิทธิภาพทางทฤษฎี:
ชายแดน: 0; ตั้งค่าเส้นขอบเป็น 0 พิกเซลแม้ว่าจะมองไม่เห็นบนหน้าเว็บตามค่าเริ่มต้นของเส้นขอบเบราว์เซอร์ยังคงแสดงความกว้างของชายแดน/สีชายแดนนั่นคือค่าหน่วยความจำได้ถูกครอบครอง ชายแดน: ไม่มี; ตั้งค่าชายแดนเป็นไม่มีนั่นคือไม่มีการกระทำการเรนเดอร์เมื่อเบราว์เซอร์แยกวิเคราะห์ไม่มีนั่นคือค่าหน่วยความจำจะไม่ถูกใช้
ความแตกต่างของความเข้ากันได้:
ความแตกต่างของความเข้ากันได้มีเฉพาะสำหรับเบราว์เซอร์ IE6, IE7, ปุ่มแท็ก, อินพุตและสิ่งนี้จะเกิดขึ้นภายใต้ธีม XP ของ Win, Win7 และ Vista เมื่อชายแดนไม่มีดูเหมือนว่าชายแดนที่ไม่ถูกต้องสำหรับ IE6/7 ยังคงมีอยู่ เมื่อชายแดนเป็น 0 มันจะรู้สึกมีประสิทธิภาพมากกว่าไม่มี เบราว์เซอร์ทั้งหมดซ่อนชายแดนอย่างสม่ำเสมอ
วิธีการทำชายแดน: ไม่มี; เข้ากันได้อย่างเต็มที่? เพียงเพิ่มแอตทริบิวต์พื้นหลังในตัวเลือกเดียวกัน
5.CSS ใช้เลย์เอาต์รูปร่างหลายคอลัมน์ระยะขอบด้านในบวกและระยะขอบด้านนอกเชิงลบ
ใช้สไตล์กับแต่ละคอลัมน์ที่ต้องบรรลุเส้นชั้นความสูง: .E {padding-bottom: 32767px; มาร์จิ้น-ก้น: -32767px;}
6. ตำแหน่ง: ญาติ; การใช้งานพิเศษ? - - -
* {มาร์จิ้น: 0; padding: 0; ตัวอักษร: ปกติ 12px/25px songti;}
ร่างกาย {พื้นหลัง:#f8f8f8;}
ul {list-style: none; width: 300px; ความสูง: 25px; มาร์จิ้น: 20px auto;}
Li {Float: ซ้าย; Width: 86px; ความสูง: 25px; text -allign: center; margin: 0 -5px; display: inline;}
A {color: #ffff; Float: ซ้าย; ความกว้าง: 86px; ความสูง: 25px; ด้านบน: 0; ซ้าย: 0; พื้นหลัง: url (***. gif) ศูนย์กลางที่ไม่ต้องทำซ้ำ;}
A: Hover {color:#000; พื้นหลัง: url (***. gif) 0 0 no-repeat; ความกว้าง: 86px; ตำแหน่ง: ญาติ;}
รายละเอียด 6 ………………………………………………………………………………………………………………………………………………………………………… - - -
1. InnerText: เนื้อหาจากตำแหน่งเริ่มต้นไปยังตำแหน่งสิ้นสุดไม่รวม TAG InnerHTML
OUTERHTML: มี innerHTML และแท็ก
<div id = test> <span> test1 </span> test2 </div>
test.innerText: test1 test2
test.innerhtml: <span> test1 </span> test2
test.outerhtml: <div id = test> <pan> test1 </span> test2 </div>
2. number (): เมื่อสตริงใด ๆ ที่มีอักขระที่ไม่ใช่ตัวเลขจะถูกใช้เป็นพารามิเตอร์ผลลัพธ์คือ NAN
parseint (): แปลงสตริงเป็นตัวเลขต่ำที่สุดเท่าที่จะเป็นไปได้จากซ้ายไปขวาจนกว่าจะหยุดเมื่อพบตัวเลขที่ไม่ได้เป็นตัวเลข
ISNAN (): ส่งคืนจริงเมื่อพารามิเตอร์ไม่ใช่ตัวเลข
3. a = 23.50abc
typeof (a) = สตริง
Parsefloat (a) = 23.5
Parseint (a) = 23
หมายเลข (a) = nan
4. ชื่อตัวแปร JS มีตัวเลขที่ขีดเส้นใต้ด้วยสัญญาณดอลลาร์และไม่สามารถเริ่มต้นได้ด้วยตัวเลข
5. GetElementsByTagname_r () จะต้องเรียกคืนหลังจากโหลดเอกสาร
6. NodeType: 12 ประเภท, 1 แสดงถึงโหนดองค์ประกอบและ 3 หมายถึงโหนดข้อความ
NodeName: แสดงชื่อโหนด หากเป็นโหนดข้อความก็หมายถึง #Text
NodeValue: แสดงค่าของโหนด
เช่น: รับโหนดถ้า (obj.nodename.toLowerCase () == 'li') {}
เปลี่ยนเนื้อหาข้อความของ p document.getElementsByTagname_r ('P') [0] .FirstChild.NodeValue = ''
7. โหนดแม่ไปยังโหนดเด็ก
ChildNodes: รายชื่อโหนดเด็กระดับแรกทั้งหมดในองค์ประกอบไม่รวมโหนดเด็กที่ลึกกว่า
obj.firstchild = obj.childnodes [0]
obj.lastchild = obj.childnodes [obj.childnodes.length-1]
Haschildnodes () กำหนดว่าองค์ประกอบมีลูกและส่งคืนค่าบูลีน
7. โหนดลูกไปยังโหนดพาเรนต์
var parentelm = myLinkItem.parentNode;
ในขณะที่ (Parentelm, classname! = 'syna' && parentelm! = 'document.body')
parentelm = parentelm.parentNode
8. แก้ไขคุณสมบัติองค์ประกอบ
1) รับหรือตั้งค่าในรูปแบบของคุณสมบัติวัตถุ
var mainimage = document.getElementByIdx_x ('nav'). getElementsByTagname ['img'] [0];
MainImage.src = '';
MainImage .;
2) ใช้วิธีการ getAttribute () และ setAttribute ()
รายละเอียด 7 ……………………………………………………………………………………………………………………………………………………………………… - - -
1. แปลงตัวเลขเป็นรูปแบบที่มีฟังก์ชั่น X ทศนิยม X (ฐานความแม่นยำ)
{var m = math.pow (10, ความแม่นยำ);
var a = math.round (base*m)/m;
กลับ A;
-
var n = 3.942487;
Roundto (n, 3) = 3.942
Roundto (n, 0) = 3
2. สร้างตัวเลขสุ่มแบบ จำกัด
ฟังก์ชั่น randombetween (min, max)
{return min+math.floor (math.random ()*(max-min+1))}
3. แปลงตัวเลขเป็นสตริง
var a = 10;
a = สตริง (a);/a = a.toString ();
4. การเข้ารหัส URL
var a =? p = e;
var b = หลบหนี (a);
var c = (b);
5. เปลี่ยนประเภทขององค์ประกอบในเอกสาร
p ---> div
ก่อนอื่นสร้างองค์ประกอบ div จากนั้นคัดลอกโหนดลูกของ p ลงใน div และในที่สุดก็แทนที่ p ด้วย div
6. ต้องใช้พารามิเตอร์กี่ตัวสำหรับฟังก์ชัน
ฟังก์ชั่นเพิ่ม (N1, N2) {}
return num = add.length;
7. มีพารามิเตอร์กี่พารามิเตอร์ในฟังก์ชัน
ฟังก์ชั่นเพิ่ม (n1, n2) {
return arguments.length;}
รายละเอียด 8 ……………………………………………………………………………………………………………………………………………………………………… - - -
1). แสดง: Inline-Block; ตามชื่อหมายถึงมันเป็นรูปร่างบล็อกในอินไลน์และสามารถตั้งค่าความกว้างความสูงได้
.Element-class {
แสดง: -moz-inline-stack; // Firefox เท่านั้นรหัส
แสดง: Inline-Block; // เบราว์เซอร์มาตรฐานบางตัว
ซูม: 1; // คือเท่านั้น
*แสดง: อินไลน์; // เท่านั้นคือรู้รหัสนี้ (CSS Hack)
-
2). ทำความสะอาด
.ClearFix: หลังจาก {การมองเห็น: ซ่อน; แสดง: บล็อก; ขนาดตัวอักษร: 0; เนื้อหา:; ล้าง: ทั้งสอง; ความสูง: 0;}
.ClearFix {ซูม: 1;}
3). เพิ่มไอคอนที่กำหนดเองในแถบที่อยู่
ก่อนอื่นเราต้องทำไฟล์ไอคอนล่วงหน้าด้วยขนาด 16*16 พิกเซล ส่วนขยายไฟล์คือ ICO และอัปโหลดไปยังไดเรกทอรีที่เกี่ยวข้อง เพิ่มรหัสต่อไปนี้ระหว่างไฟล์ต้นฉบับ HTML <head> </head>: <link rel = ชื่อไอคอน href = ที่อยู่ของรูปภาพ (โปรดทราบว่ามันสอดคล้องกับไดเรกทอรีตอนนี้)> แน่นอนถ้าผู้ใช้เรียกดูที่ใช้ IE5 หรือสูงกว่ามันจะง่ายยิ่งขึ้น เพียงอัปโหลดรูปภาพไปยังไดเรกทอรีรูทของเว็บไซต์และสามารถรับรู้ได้โดยอัตโนมัติ!
4). เมื่อตั้งค่าการแสดงผล: คอนเทนเนอร์ที่ว่างเปล่าของบล็อกใน IE6 ถึงความสูงที่เล็กกว่าเช่น <p style = ความสูง: 1px;> </p> คุณจะพบว่าความสูงของมันไม่สามารถน้อยกว่าค่าที่แน่นอน วิธีแก้ปัญหา: ตั้งค่าล้น: ซ่อน
5). ข้อความถูกตัดออกด้วยจุดไข่ปลา
div {width: 200px; ความสูง: 100px; overflow: hidden; text-overflow: Ellipsis; Space White-space: NowRap;}