=> CSS
-
สร้างกราฟแท่งแนวนอนด้วย XHTML CSS
ผู้แต่ง gOragod
เมื่อ 23 มิย. 2553
ดู 538
- เรื่องของเรื่องคือผมต้องการแสดงกราฟแท่งที่รองรับภาษาไทย แต่หลังจากที่ทดสอบการวาด กราฟด้วย GD แล้ว พบว่าบาง Server มีปัญหากับภาษาไทยอยู่เล็กน้อย ก็เลยเปลี่ยนใจหันกลับมาวาดกราฟด้วย XHTML+CSS แทน ซึ่งจ..
-
ตารางด้วย div (tableless ตอนที่ 3)
ผู้แต่ง gOragod
เมื่อ 29 พค. 2553
ดู 530
- เป็นอีกตัวอย่างหนึ่งของการแสดงตารางด้วย div (tableless) ซึ่งในตัวอย่างนี้ แต่ละคอลัมน์มีความกว้างไม่เท่ากัน และสามารถมีข้อมูลได้หลายบรรทัดต่อ 1 เซล
-
ตารางด้วย div (tableless ตอนที่ 2)
ผู้แต่ง gOragod
เมื่อ 29 พค. 2553
ดู 444
- ในตอนนี้ เราจะมาสร้างตารางจาก div แบบ tableless ในแบบที่แต่ละคอลัมน์อาจมีได้มากกว่า 1 บรรทัดกัน (โค้ดตารางในตอนก่อนๆ จะไม่สามารถแสดงผลในลักษณะนี้ได้ถูกต้อง) เคล็ดลับในการแสดงผลแบบนี้ อยู่ที่การใช้รู..
-
ตารางด้วย div (tableless ตอนที่ 1)
ผู้แต่ง gOragod
เมื่อ 29 พค. 2553
ดู 676
- การแสดงผลแบบตาราง ด้วย DIV และ CSS อาจเป็นเรื่องยุ่งยากสำหรับมือใหม่ที่ต้องการออกแบบ แบบ tableless (ไม่ใช้ตาราง) และอาจมีข้อจำกัดมากพอสมควรนะครับ เนื่องจาก table นั้นจะแสดงผลได้ยืดหยุ่นกว่า โดยเฉพาะ..
-
CSS กลางจอ ตอนที่ 2
ผู้แต่ง gOragod
เมื่อ 18 มีค. 2553
ดู 1164
- ตอนที่แล้ว เราใช้ text-align ในการจัดให้ ข้อความอยู่ตรงกลางมาแล้ว ต่อไปเราจะมาดูวิธีการจัดด้วย margin กัน เราเรียนรู้มาจากตอนที่แล้วว่า ถ้าเราต้องการให้มันอยู่ตรงกลาง กรอบนอก ต้องใหญ่กว่าสิ่งที่อยู่..
-
CSS กลางจอ
ผู้แต่ง gOragod
เมื่อ 18 มีค. 2553
ดู 1113
- เรื่องของกลางจอ เนี่ย จะดูว่าง่ายก็ง่าย จะยากก็ยากนะครับ เนื่องจากในบางครั้งเราอาจพบว่าบราวเซอร์แต่ละยี่ห้อแสดงผลไม่เหมือนกัน ซึ่งในความเป็นจริงแล้ว การวางอะไรไว้ตตรงกลางนั้น มีเคล็ดลับอยู่เล็กน้อยเ..
-
การจัดตำแหน่งโดย CSS ด้วย float และ clear
ผู้แต่ง gOragod
เมื่อ 5 ธค. 2552
ดู 2419
- float และ clear เป็น property ที่สำคัญอันหนี่ง ที่มีไว้เพื่อการจัดตำแหน่งของ layout ในแบบ tableless property ทั้งสองตัวมีความหมายดังนี้ครับ float: left มีความหมายเหมือนกับ align=left แหละครับ คือจัด..
-
Cascading style sheets (CSS) properties
ผู้แต่ง gOragod
เมื่อ 17 สค. 2552
ดู 1599
- ตารางค่าและคุณสมบัติของ CSS Attribute Property Possible Values background-attachment value fixed, default background-color: color a color value background-image: location none, url(location) backgro..
-
ว่าด้วยเรื่อง ขนาด ของ CSS
ผู้แต่ง gOragod
เมื่อ 17 สค. 2552
ดู 1450
- การกำหนดขนาด ไม่ว่าจะเป็นขนาดของตัวอักษร ความกว้าง ความสูง หรือระยะห่าง ของ element ต่างๆ เป็นสิ่งสำคัญสิ่งหนึ่งที่เราจะออกแบบเว็บไซต์ด้วย CSS เป็นผลสำเร็จ ผลที่ว่า จะทำให้เราได้หน้าเว็บที่เหมือนกัน..
-
เมื่อ Rollover Menu คลิกแล้วไม่เปลี่ยน
ผู้แต่ง gOragod
เมื่อ 22 มิย. 2552
ดู 1297
- มีคำถามมาจากกบอร์ดเกี่ยวกับ Rollover Menu ผมเลยเอาโค้ดมาลงให้ดู เผื่อมีใครสนใจเหมือนกัน และเพื่อเป็นกรณีศึกษา คำถามมีอยู่ว่า ได้ออกแบบ Rollover Menu แล้ว แต่เมื่อเอาเมาส์คลิกที่เมนู จะทำให้ไม่มีการแ..
-
ปุ่มแบบมีรูปภาพ
ผู้แต่ง gOragod
เมื่อ 24 พค. 2552
ดู 2270
- การทำปุ่มที่เป็นรูปภาพที่สามารถเปลี่ยนรูปภาพที่แสดงบนปุ่มได้เมื่อเอาเมาส์ไปวางไว้บนปุ่ม เราอาจใช้รูปภาพต้นฉบับที่เป็นรูปภาพใหญ่เพียงรูปเดียว และมีรูปภาพเล็กๆอยู่ภายในหลายๆรูปสำหรับปุ่มแต่ละปุ่มเหมือ..
-
การแสดงรูปภาพตามตำแหน่งที่ต้องการจากภาพใหญ่ด้วย CSS
ผู้แต่ง gOragod
เมื่อ 23 พค. 2552
ดู 1470
- บางครั้งเราอาจไม่ต้องการเก็บรูปภาพหลายๆรูปเพื่อนำมาใช้ในเว็บแต่เราอาจใช้การเก็บรูปภาพใหญ่ๆเพียงภาพเดียวซึ่งมีภาพเล็กๆหลายภาพไว้ภายใน เวลาเราจะแสดงผลรูปภาพนั้นๆ เราก็ใช้ CSS เพื่อคัดเลือกเฉพาะรูปภาพใ..
-
Universal Selector
ผู้แต่ง gOragod
เมื่อ 13 มค. 2552
ดู 1242
- หลายๆคนคงสงสัยว่า Universal Selector คืออะไร มันคือเครื่องหมายดอกจันทน์ ที่เราใช้กันใน CSS ครับ (*) ดูตัวอย่างการใช้ * ใน CSS นะครับ ซึ่งจะมีผลทำให้ Element span ทุกอันแสดงตัวอักษรเป็นสีแดง
-
CSS Hack
ผู้แต่ง gOragod
เมื่อ 13 มค. 2552
ดู 2222
- ปัญหาการแสดงผลที่ไม่เหมือนกันในแต่ละ Browse เนี่ย เป็นเรื่องปวดหัวทีเดียว วันนี้ผมนั่งออกแบบฟอร์ม Login แบบที่อยู่บนแถวเดียวกัน โดยทดสอบบน Firefox ก็ถูกต้องดี Google Chrome ก็ถูกต้องดี Opera ก็ถูกต้..
-
CSS Cursors properties
ผู้แต่ง gOragod
เมื่อ 10 พย. 2551
ดู 1645
- ตารางแสดง ค่า property ต่างๆของ Cursors ที่สามารถกำหนดได้บน Browser ด้วย CSS ชื่อ ตัวอย่าง (เลื่อนเมาส์ไปบนชื่อเพื่อดูตัวอย่าง) default cursor:default crosshair cursor:crosshair hand cursor:hand poi..
-
รูปภาพ กับ SEO
ผู้แต่ง gOragod
เมื่อ 3 พย. 2551
ดู 2126
- รูปภาพเช่น tag img ปกติแล้วจะไม่สามารถใช้ในการทำ SEO ได้ เนื่องจาก SE ไม่สามารถเข้าใจความหมายของรูปภาพได้ นอกจากการอ่านจาก tag alt ซึ่งสามารถบอกความหมายของรูปภาพได้ รวมถึงสามารถใส่คีย์เวิร์ดลงใน alt..
-
CSS rollover button เพื่อ SEO (2)
ผู้แต่ง gOragod
เมื่อ 24 พค. 2552
ดู 2521
- ปุ่ม rollover อีกแบบ ที่ใช้รูปภาพเป็นพื้นหลังแล้วใช้ข้อความแสดงบนปุ่มแทนการใช้รูปภาพล้วนๆ ทำให้ไม่ต้องสร้างรูปภาพหลายๆรูป เพียงแค่ทำพื้นหลังของปุ่มเพียง 2 รูปเท่านั้น
-
CSS rollover button เพื่อ SEO
ผู้แต่ง gOragod
เมื่อ 6 พย. 2551
ดู 2358
- ปกติแล้วการทำปุ่มเมนูด้วยรูปภาพ มักไม่มีผลกับการทำ SEO เนื่องจาก SE ไม่สามารถเข้าใจได้ว่ารูปภาพที่เป็นปุ่มนั้นจะสื่อความหมายถึงอะไร ทำให้เสียโอกาศในการทำ SEO ยกตัวอย่างเช่นการสร้างปุ่ม rollover ด้วย..
-
เมื่อ IE คืนค่า offsetWidth ของ table เป็น 0
ผู้แต่ง gOragod
เมื่อ 2 สค. 2551
ดู 1499
- ปัญหานี้ไม่เกิดขึ้นบน Browser อื่นเช่น FireFox หรือ Opera ครับ มันเกิดขึ้นกับ IE อย่างเดียว ลองดูตัวอย่างโค้ดเจ้าปัญหา
-
การใช้งาน Template กับเว็บไซต์ (ตอนที่ 4)
ผู้แต่ง gOragod
เมื่อ 30 มิย. 2551
ดู 2941
- แบบที่ 3 แบบสุดท้ายที่มักพบเห็นกันในระบบ Blog หรือ ไดอารี่ ที่เป็นแบบ HTML ล้วน
