Page 47 - การสร้างเว็บไซต์
P. 47

4. เเท็ก<div> และ <span>  6. กำรก�ำหนดสี





 ู
 ู
    ในกำรจัดรปแบบเอกสำรนันอำจมีกำรจัดหลำยรปแบบซึ่งแต่ละแบบต้องมีกำรก�ำหนด       ในกำรก�ำหนดสีใน CSS กจะใช้วิธีเดียวกันกับรปแบบกำรก�ำหนดสีของ HTML. เช่น
 ้
                                                              ู
                                          ็
 ุ
 ้
 ขอบเขตว่ำ จะเริ่มต้นตรงไหนและสินสดตรงไหน ซึ่งแท็ก <dง> และ <sp.> นั้นเปนแท็กที่มไว้แบ่งส่วน  1) กำรก�ำหนดสีโดยใช้ชื่อสี เช่น red, green, biae, black เปนตัน
 ี
 ็
                                                                      ็
 ี
 ้
 ื
 ็
 เนอหำของHTML ออกจำกกันเปนส่วนๆ โดยมข้อแตกต่ำงดังน ้ ี  2) กำรก�ำหนดสีด้วยตัวเลขฐำนสิบหก (Hex) เช่น #OE, #800#, #0000F เปนต้น
                                                                                       ็
 ็
     4.1 แท็ก <div> เปนแท็กแบบ Block ซึ่งเปนแท็กที่ใช้ในกำรแยกบรรทัดของข้อควำม เม่อม ี  3) กำรก�ำหนดสีด้วยฟงก์ชัน ซ60 เช่น ซูgb (100, 200, 100), ซูb (50%, 100%, 25%) เปนต้น
 ื
 ็
                                                                                                     ็
                                  ั
                                         ุ
 แท็ก<div> อยู่ระหว่ำงข้อควำม เม่อรันแล้วข้อควำมจะต้องถูกแยกไปอยู่ในบรรทัดใหม่ต่ำงหำก   ตัวอย่ำงกำรก�ำหนดด�ำสิใน CSS
 ื
 ็
 ็
       4.2 แท็ก <span> เปนแท็กแบบ Inlne คือ เปนแท็กที่ให้ข้อควำมสำมำรถอยู่ในบรรทัดเดียวกัน       6.1 กำรตั้งค�ำสีให้กับตัวอักษรและพนหลัง มดังน ้ ี
                                                   ้
                                                   ื
                                                           ี
 ได้        body (
 กำรแทรกค�ำอธิบำยกำรท�ำงำนของค�ำสั่ง     color: black;
 ื
 - กำรแทรกค�ำอธิบำย (Comment) ในเอกสำร HTMI เพ่อช่วยอธิบำย Source Code ของเอกสำร     background: white;
 ่
 5. ก�ำหนดหนวย
                       ็
                                                ็
                                                                   ็
                                                           ้
            จำกค�ำสั่งเปนกำรตั้งค�ำำสีตัวอักษรเปนสีด�ำและพนหลังเปนสีขำว
                                                           ื
                                                                                                            ็
 ี
       CSS จะต้องมกำรก�ำหนดขนำดอยู่หลำยอย่ำงเพ่อให้เหมำะสมกับกำรออกแบบเว็บเพจ เช่น       6.2 กำรก�ำหนดค�ำสีให้กับ Link ในกำรก�ำหนดค่ำสิให้กันลิงค์ใน CSS  นั้นสkมำรถก�ำหนดให้เปน
 ื
                                                                                        ็
                                      ู
                 ็
                                                                                      ็
 ี
 ่
 ขนำดตัวอักษร ควำมกว้ำง ควำมสูง ระยะห่ำง เปนต้น ซึ่งใน CSS มหนวยให้เลือกใช้หลำยแบบ  ลิงค์กใด้หลำยสถำนะตำมรปแบบของกำรลิงค์ เช่น ขณะที่ยังไม่ใด้คลิกสิงค์กเปนอีกสีหรือขณะทีคลิก
 ็
                                                         ็
                                                       ็
                                                  ื
                                                           ็
                                 ื
                   ็
                 ็
   px(Pixel)   สิงก์กเปนอีกสีหรือเม่อเอำเมำส์วำงเหนอสิ่งกกเปนอีกสี เช่น
                                                         ็
 ุ
 เปนหนวยทีใช้กันมำกที่สดทั้งกำรก�ำหนดขนำด Fom หรือขนำดของ  link  color: ซูb(0, 0. 153): ) #* ส�ำหรับสิงกที่ยังไม่ได้รับแม "
 ็
 ่
 Layat ไม่ควรก�ำหนดขนำดของ Fo๓! เปน Pize! เพรำะกำรก�ำหนดขนำดเปน Fisel  vinlted ( color. rgb(153, 0, 153): 1 / ส�ำหรับลิงค์ที่รับชมแล้ว "
 ็
 ็
                                                               ็
 ิ
 นั้นจะไม่สำมำรถปรับเพ่มหรือขยำยขนำดได้ ซึ่งโดยส่วนใหญ่แล้วผู้ใช้งำนไม่ได้ปรับ  aative f color: rgb(255, 0. 102): ) / ส�ำหรับสิงค์กที่ถูกคลิก "
                                                                             ื
                                                                  ี
 ใน Boewser แทน ดังนั้นกำร 700m จะท�ำกำรขนำดรอง Fomt แต่ใช้กำร 700m  ahover ( colar.: rgb(0, 96, 255). ) /" ส�ำหรับสิงค์ที่มมำวำงเหนอ "
                                                              ็
                                                 ี
                                                                        ี
 ้
 ึ
 ้
 ขยำยขนำดของ Pixe! ขนเลยท�ำให้ทุกอย่ำงที่แสดงผลอยู่ใหญ่ขน  ถ้ำหำกว่ำไม่ต้องกำรให้ลิงก์ที่ปรำกฏมเส้นต้ำนล่ำงกสำมำรถเขยนค�ำสั่งใน C5S ได้
 ึ
                                           ู
                     7.กำรก�ำหนดรปแบบข้อควำม
                                    ู
                                                              ู
                 เรำสำมำรถก�ำหนดรปแบบให้ข้อควำมได้หลำยรปแบบ เช่น ควำมสูงของบรรหัด,ทัดและอื่นๆ อีก
            มำกมำยโดยผ่ำน Property ต่ำงๆ
 42                                               43
   42   43   44   45   46   47   48   49   50   51   52