ขอถามเรื่อง CSS หน่อยครับ

[ooooo]

บางสิ่งที่เคยรู้ แต่เพิ่งเอามาบอก

1.ใช้

โค้ด เลือกทั้งหมด ขยายเนื้อหา

<style type="text/css" media="all">@import "xxxxx.css";</style>

ยังดีกว่า

โค้ด เลือกทั้งหมด ขยายเนื้อหา

<link rel="stylesheet" type="text/css" href="xxxxx.css" /> เสียอีก

เพราะอะไร? เพราะว่าถ้าเราใช้ อทช.ของ firefox ที่เอาไว้ดู css สดๆ มันจะไม่โชว์ภาพ background น่ะสิ
(อีกอย่างคือ code <link rel=".... /> มันยาวกว่าด้วย เกะกะ)

2. ถ้าอยากจะทำเว็บแล้วให้พื้นหลังมีเงา ลองโค้ดนี้

โค้ด เลือกทั้งหมด ขยายเนื้อหา

background-image: url(รูปภาพที่มีเงาขนาบซ้าย-ขวาตรงกลางไม่มีสี.jpg) center top  repeat-x;

แปล
center = ให้ bg อยู่ตรงกลาง
top = ให้ bg อยู่ข้างบนด้วย
repeat = ไม่ให้ background มันฉายภาพซ้ำๆ
-x; แกน x (แนวตั้งนั่นเอง)

[iannnnn]

เอ๊ะ อ่านอันที่ 2 แล้วไม่เข้าใจ
นั่นหมายถึงใช้ที่รูปหรือว่าหน้าเว็บ?
ถ้าใช้ที่รูปนี่ รูปที่เอามาสวมมันต้องพอดีกันหรือเปล่า
แล้วถ้าพอดีกัน มันจะต้อง repeat ด้วยเหรอ

[ooooo]

โอเคเอาเว็บนี้ไปดู
http://www.highfield.berks.sch.uk/events_diary.php

[Zafire06]

[iannnnn]

อ้อ ก็ wordpress ใช่มะ

[ooooo]

อะ แถมให้อีก 1 เรื่อง

การทำอักษรขึ้นต้น โดยใช้ภาพแทน

ดูตัวอย่าง http://www.stopdesign.com/articles/replace_text/ex_dropcap.html

วิธีทำ http://www.stopdesign.com/articles/replace_text/

[Zafire06]

ทำไมตูต้องกรี๊ดเรื่อยๆ วะ 

[ooooo]

เจอเว็บโคตรสุดยอดมาครับ

มันคือเว็บที่ให้บริการฟรี สำหรับตรวจ-แก้ไขโค้ดทั้ง HTML, XHTML และที่ขาดไม่ได้คือ CSS

อย่างเช่น โค้ดสีทำไมต้องใช้ #aaaaaa แทนที่จะเป็นแค่ #aaa ก็พอแล้ว
หรือไม่ทำไมต้อง padding: 5px จะเว้นวรรคทำไม ในเมื่อ padding:5px ก็ได้

ทุกอย่างจะถูกแก้ให้โดยอัตโนมัติ แล้วจะจัดเรียงโค้ดใหม่ให้เป็นระเบียบสวยงาม
เรียงตามตัวอักษร A-Z ง่ายต่อการแก้ไขในภายภาคหน้า

ที่นี่ครับ
http://codemelt.com

อนึ่ง : โค้ดที่ถูกแก้ไขแล้ว ขนาดไฟล์อาจจะลดลงอย่างไม่น่าเชื่อ
อสอง : บอร์ดนี้มีโค้ดผิดพลาดนับร้อยจุด

[iannnnn]

อ้าวเหรอ
ตูเคยเอาลิงก์มาแปะเรื่อง 10 หรือ 19 เทคนิคเขียน css ให้หล่อ
เขาบอกเวลาเขียนโค้ดสี ให้ใช้แค่ 3 ตัวก็ได้

นี่มันเรื่องของความเคร่งครัดอีกแล้วเหรอ

[X11]

อ่อ.. ศูนย์บริการลดน้ำหนักส่วนเกิน (ของโค้ด) เหรอ 

ไม่รู้สิ  ไม่เคร่งครัดกับเว้นวรรคและขึ้นบรรทัดใหม่ (บ่อยๆ)
เพราะจะเน้นวางโค้ดให้ตัวเราอ่านง่ายที่สุด และเน้นบรรทัดสำคัญๆ เอาไว้ด้วย remark
เพื่อที่เวลากลับมาไล่แก้โค้ดจะได้หาเจอง่ายๆ กวาดสายตารอบเดียวเจอ
อาจจะเป็นคนละแนวกับกลุ่มประหยัดโค้ด

แต่ถ้าใช้ Dreamweaver เขียนเว็บและสร้าง behavior ต่างๆ ในหน้าเว็บ (เพิ่มโค้ด javascript ให้อัตโนมัติ)
ก็ไม่ต้องห่วงเรื่องโค้ดส่วนเกิน  เกินเพียบเลยล่ะนั่น
หลายๆ behavior ตัวคำสั่งจริงๆ บางทีมีีแค่บรรทัดเดียวเอง

[iannnnn]

ตูก็ว่าทำให้คอมรู้เรื่องแต่คนแก้งงนี่ ไม่ไหวเหมือนกันนะ
(แต่ก็ดีแล้ว มีสถานที่ผูกไวยากรณ์ให้)

[Zafire06]

แต่ก่อนพยายามเว้นวรรคให้แก้ง่ายเข้าใจง่าย
แต่เดี๋ยวนี้ขี้เกียจ เลยเหลือแต่ Selector ละบรรทัดเดียว
ยกเว้นอะไรที่ต้องเขียนยุ่งๆ

[ooooo]

เรียน CSS ในแผ่นเดียว

http://www.ilovejackdaniels.com/css_cheat_sheet.png

[ooooo]

stylesheet hacks
http://centricle.com/ref/css/filters/

[Oily_Orange_Juice]

CSS เป็นอะไรที่เข้าใจยาก