เล่นกับ พื้นหลัง

    XHTML ยกเลิก property ที่เกี่ยวกับพื้นหลังไปแล้วครับ เข่น bgcolor background แต่เราก็สามารถมากำหนดด้วย CSS แทนได้ แถมสวยงามกว่าด้วยครับ

    ไม่รู้ว่าผมคิดไปเองหรือเปล่านะ ว่าการกำหนดพื้นหลังด้วย CSS ช่วยให้เพจไม่กระพริบได้ดีในระดับหนึ่งทีเดียว ต่างจากที่ผมเคยทำภายในตาราง ซึ่งตอนโหลดครั้งแรกมักมีการกระพริบของตารางเสมอก่อนจะเป็นกรอบที่สมบูรณ์

  สำหรับ property ที่เกี่ยวกับพื้นหลังที่น่าสนใจก็มีดังนี้ครับ

         
        
            background-color:#CCFFFF;
        กำหนดค่าสีพื้นของ object
        background-color:ค่าสี;
        
        
            background-image:url(th.gif)
        กำหนดรูปภาพพื้นหลังของ object
        background-image:url(path ของรูป)
        
        
            background-color:#F0F0F0;
            background-image:url(wait.gif);
            background-position:top right;
            background-repeat:no-repeat;
        นอกจากนี้เรายังสามารถกำหนดตำแหน่งของพื้นหลังได้อีกด้วยครับ
        background-position:ตำแหน่ง ได้แก่ left top right bottom และ center; สามารถกำหนดพร้อมกันได้ 2 รายการตามตำแหน่งที่ต้องการได้เช่น
        background-position:top right; (บน ขวา)
        background-repeat:วิธีการวาดพื้นหลังซ้ำๆ ได้แก่ repeat no-repeat repeat-x และ repeat-y;
        ในตัวอย่างใช้ background-repeat:no-repeat; เพื่อให้แสดงพื้นหลังแค่ครั้งเดียวครับ
        
        
            background-image:url(wait.gif)
            background-position:center;
        ตรงกลางพื้นที่แสดงผลเลย
        background-position:center;

ผู้เขียน Goragod

โพสต์เมื่อ 01 ธ.ค. 2554 เวลา 08:23 น.

ความคิดเห็น 0

เปิดดู 11,734

ป้ายกำกับ XHTML

Related

^