F0NTCAMP02 | เบซิกเบสิก CSS

ออยอิชี่ · 17 ส.ค. 2009, 16:28 น.

อ้างคำพูดจาก: มุมมืดของสังคม เมื่อ 17 ส.ค. 2009, 16:26 น.

กวางกับอรยอดเยี่ยมมากครับ

อ้าวออย
ไหนบอกรู้ทางตัวเองแล้วไง
หนหน้าไม่ต้องมาเรียนแล้ว ชิ้วๆ

อาไร๊

ก็คนเขาออกจะขวนขวายใฝ่เรียนรู้

icez · 17 ส.ค. 2009, 16:37 น.

เสริมนิดนึง

ไอ้ position: fixed นี่...
IE6 ใช้ไม่ได้นะค้าบบบบบบบบบบบบบบบบบบ

เอาไปใช้ทำเมนูในเว็บบิต เปิดกะ IE6 แล้วเน่าอนาถ

กวางจ้ะ · 17 ส.ค. 2009, 16:38 น.

แบบว่า css นี่ถูกประดิษฐ์มาเป็นอริกับ IE รึป่าวเนี่ย

ไประบุคำเตือนก่อนว่า ใช้ได้ดีกับ "หมาย่าง" นะจ๊ะ

X11 · 17 ส.ค. 2009, 16:39 น.

อ้างคำพูดจาก: eThics เมื่อ 17 ส.ค. 2009, 15:41 น.
ชอบบรรยากาศแบบนี้จัง...ช่วยเหลือและแบ่งปันความรู้กัน

อยากรวยเว้ย จะร่วมกับพี่หน่อยเป็นผู้สนับสนุนโครงการทุกเดือน

แต่ได้ข่าวว่า...
ยังไม่ได้ถามความสมัครใจจากพี่หน่อยเลยนะคะ

eThics · 17 ส.ค. 2009, 16:41 น.

พี่หน่อยตอบว่าไม่มีปัญหา

ทุกคนขอบคุณพี่หน่อยเร้วววววววว ขอบคุณค่ะพี่หน่อย

icez · 17 ส.ค. 2009, 16:42 น.

อ้างคำพูดจาก: ดุกศรี เมื่อ 17 ส.ค. 2009, 11:26 น.
<head>
<style type="text/css"> <- บรรทัดนี้ไม่ต้องใส่ก็ได้กรณีที่ใช้แท็กการ link ไฟล์ css (บรรทัดถัดไป)
<link rel="stylesheet" type="text/css" href="anna.css" /> <- เพราะในแท็ก link เนี่ย เจ้า attribute ที่ชื่อ type มีการระบุไปแล้วว่าตูต้องการใช้รูปแบบของ text/css นะ โดยอ้างอิงจากไฟล์ css ชื่อ anna.css จึงไม่จำเป็นต้องใส่แท็ก style เพื่อระบุรูปแบบการใช้ text/css อีกครั้งจ้ะ
</head>

ขอแก้ความเข้าใจเรื่องนี้นิดนึงครับ

ไอ้ text/css ที่ว่าเนี่ย ถึงไม่ใส่ก็ไม่เป็นไรก็จริง "แต่มันเป็นมาตรฐานบังคับ" ครับ
คือถ้าไม่ใส่ จะมี browser กับ server บางตัวที่มันจะทำให้เอ๋อได้
เพราะฉะนั้น ใส่ไปเหอะครับ

X11 · 17 ส.ค. 2009, 16:42 น.

ติ๊กแปลงสาร ยังไม่ได้ตกลงซะหน่อย

กวางจ้ะ · 17 ส.ค. 2009, 16:44 น.

อ่อโอเค แท้งค์กิ้วไอซ์

** ถ้าใส่อย่าลืมปิด tag </style> ด้วยเน้อ ในนั้นมันไม่มี

// ~~ไปแก้ก่อน~~

เปลี่ยนเป็นอันนี้เน้อ

อ้างอิง<head>
<style type="text/css"> <- บรรทัดนี้ไม่ต้องใส่ก็ได้กรณีที่ใช้แท็กการ link ไฟล์ css (บรรทัดถัดไป) แต่จริง ๆ ใส่ไปดีกว่านะ อย่าเพิ่งขี้เกียจพิมพ์ เพราะเป็นมาตรฐานบังคับในการใช้งาน ถ้าไปเปิดกับ web browser อื่น หรือกับ server อื่นที่ไม่รองรับ อาจทำให้เกิดอาการติงต๊องได้ (credit : ไอซ์)
<link rel="stylesheet" type="text/css" href="anna.css" />
</style>
</head>

moophong · 17 ส.ค. 2009, 16:53 น.

เมื่อไรจะมี ครอสหน้าอีกน๋อ.....อยากกิน

เฮ้ย....อยากเรียน

eThics · 17 ส.ค. 2009, 16:54 น.

อ้างคำพูดจาก: X11 เมื่อ 17 ส.ค. 2009, 16:42 น.
ติ๊กแปลงสาร ยังไม่ได้ตกลงซะหน่อย

ฟิ้งซ์ · 17 ส.ค. 2009, 17:07 น.

เก็บดาวมาเจอความช้ำใจอีกแล้ว

iannnnn · 17 ส.ค. 2009, 17:20 น.

เรื่อง position:fixed ใน ie

นั้น
อันนี้ต้องกูเกิ้ลจริงๆ ครับ:30:
http://subtlegradient.com/articles/2009/07/29/css_position_fixed_for_ie6.html

จริงๆ มันมีอีกหลายร้อยอย่างมากที่เล่นไปเล่นมาก็เจอตอกะ IE

ซึ่งทั้งหมดนี้ต้องหาพวก CSS Hack มาแก้ปัญหาเท่านั้น นั้น นั้น

Layiji · 17 ส.ค. 2009, 17:32 น.

ท่าทางมันมี fixed ทุกอันสำหรับ IE :13:เลยใช่มั้ยเนี่ย

โบว์ · 17 ส.ค. 2009, 18:26 น.

บวกอรกับกวาง ค่าขยัน
(เรื่องเรียน ไม่รู้เรื่องอะไรกับเค้าหรอก แต่ครั้งหน้าให้ทอดไก่กับข้าวผัดโรงเจอีกได้นะ)

หนูอร · 17 ส.ค. 2009, 18:28 น.

ฟื้นแล่วววววววว มาต่อกันเลยดีกว่าาาาา \

/

การตั้งค่า background

ในส่วนของ background หรือพื้นหลัง สามารถเซทค่าที่ body / div ได้
โดยรายละเอียดของ background เรากำหนดได้หลายอย่างดังนี้

background: color, url, fixed, repeat/no-repeat, background position

color            สีของ background
url            ที่ตั้งไฟล์ที่ดึงมาใช้เป็น background
fixed         การกำหนดให้ background ไม่เคลื่อนตาม scroll
repeat/no-repeat   ต้องการซ้ำรูป background หรือไม่ (กรณีที่ทำเป็นแพทเทิร์นก็ repeat)
            ซึ่งสามารถกำหนดได้ด้วยว่าจะให้
               repeat-x (แนวนอน)
               repeat-y (แนวตั้ง)
               no-repeat (ไม่ทำซ้ำ)
background position    เป็นการกำหนดตำแหน่ง background ซึ่งกำหนดได้หลายรูปแบบ
            ว่าอยู่ top left right bottom center หรือจะจับคู่กันเป็น top left, center center ก็ได้
            นอกจากนี้ยังสามารถจะกำหนดด้วยการใช้ % หรือกำหนดเป็น px ก็ได้ค่ะ

เวลาเขียนคำสั่งก็จะออกมาเป็นแถวเดียวกันแบบนี้

โค้ด เลือกทั้งหมด

background: #fff url() no-repeat center center;

เดี๋ยวมาต่อนะจ๊ะ