วิธีการตกแต่ง Background ในเว็บไซต์ สามารถปรับแต่งรูปแบบด้วยการใช้สีหรือรูปภาพเป็น Background (พื้นหลัง) ของเว็บไซต์ได้ ซึ่งเจ้าของเว็บไซต์สามารถเลือกรูปแบบพื้นหลังที่ต้องการได้ มีขั้นตอนการปรับแต่งดังนี้ Show บางครั้งของการออกแบบ Web Page เราต้องการใส่รูปภาพเป็น Background หรือเป็นฉากด้านหลังของ Web Page แต่บางครั้งก็อีกที่เราต้องการ Background เพียงแค่รูปเดียวโดด ๆ ในการเป็นภาพพื้นหลัง แต่ก็จะมีปัญหาตามมา คือ เมื่อเรานำรูปที่จะนำมาเป็นพื้นหลังของเพจ รูปภาพมักจะกระทำซ้ำให้อัตโนมัติ หลายรูปจนเต็มพื้นของเว็บ เราจะมีวิธีใดในการเซ็ทให้รูปภาพแสดงแค่ภาพเดียวเป็นภาพพื้นหลังได้ อยากรู้ก็เชิญอ่านกันได้เลยครับ... แสดงเว็บเพจที่มีรูปพื้นหลังแสดงซ้ำๆ เทคนิคการทำให้ภาพพื้นหลังไม่แสดงซ้ำเปิดไฟล์เว็บเพจของเราขึ้นมา จากนั้นให้ปฏิบัติตาม ดังนี้ 1. ที่ Page Properties ให้เราเลือกที่ Appearence (CSS) 4. ทำการคลิกที่ปุ่ม OK ของหน้าต่าง Page Properties จะพบว่ารูปภาพ Background จะไม่แสดงซ้ำเป็นหลาย ๆ รูปแล้ว สาเหตที่รูปภาพพื้นหลังไม่แสดงซ้ำจากข้างต้นเมื่อเรากำหนด Option ในส่วนของ Background Image ให้เป็น no-repeat แล้ว รูปภาพจึงไม่แสดงซ้ำ นั่นเพราะว่า CSS มีความสามารถในการกำหนดการแสดงผลของพื้นหลังได้หลากหลาย และจากตรงนี้นี่เอง เราสามารถนำไปใช้ในส่วนอื่นของเว็บเพจ เช่น ที่ตาราง หากเราต้องการใช้รูปภาพนำมาเป็นพื้นหลังแล้ว ไม่ให้มีการแสดงซ้ำ ก็สามารถกระทำได้เช่นเดียวกัน โดยให้ทำการกำหนดค่า CSS ของ Background เป็น no-repeat ดังรูป *อ่านเรื่องการใช้งาน CSS เพิ่มเติมสำหรับในส่วนของการกำหนดคุณสมบัติของภาพพื้นหลังโดยใช้ CSS เรายังสามารถกำหนดการแสดงผลในรูปแบบอื่น ๆ ได้อีก เช่น ต้องการให้แสดงซ้ำตามแนวนอน (แกน x) หรือตามแนวตั้ง (แกน y) หรือต้องการกำหนดที่มีระยะแน่นอนก็สามารถกระทำได้ครับ ซึ่งฝากให้ผู้อ่านได้ทำการทดลองกำหนดค่า ศึกษากันดูด้วยตนเองต่อไป...สวัสดีครับ. บทความอื่นที่คุณอาจสนใจการจัดรูปแบบหรือหน้าตาของเว็บเพจเพื่อให้ดึงดูดความสนใจแก่ผู้เข้าชมนั้น เป็นเรื่องสำคัญในการทำโฮมเพจ นอกจากการตกแต่งตัวอักษร ข้อความและการใส่รูปภาพสิ่งที่จะบ่งบอกถึงหน้าตาของเว็บเพจเรา คือ การกำหนดพื้นหลัง (Background) ให้กับเว็บเพจ ซึ่งการกำหนดพื้นหลัง สามารถกำหนดโดยใช้สี หรือรูปภาพก็ได้ ในการกำหนดพื้นหลัง สิ่งที่ต้องคำนึงอย่างยิ่ง คือ การเลือกสีพื้นหลัง กับสีของตัวอักษรหรือข้อความ ควรเป็นคู่สีที่ตัดกัน เช่น พื้นหลังกำหนดเป็นสีเข้ม สีของข้อความควรเป็นสีอ่อน หรือสีของพื้นหลังเป็นสีอ่อน สีของข้อความควรเป็นสีเข้ม ไม่ควรกำหนดให้สีกลืนกัน เพราะจะทำให้มองข้อความไม่ชัดเจน �������Ҿ�����ѧ���Ѻ���ྨ ��ù��Ҿ�ҵ������Ҿ�����ѧ�˹�����ྨ��������������§�����˹�����ྨ ���Ҿ�����ҷ����Ҿ�����ѧ������͡�Ҿ����������������´�ҡ���Թ�����������Ѻ�����Թ� ���ͨ�����������ͤ����Ѻ�Ҿ�����ѧ���ѹ���������ö��ҹ�����Һ�˹�����ྨ�� Attribute �����ͷ��Ժ�Ƿ�background���˹�����������Դ <body>�ٻẺ�������<body background="url">...</body>valueurl ���˹觢ͧ�ٻ�Ҿ - ���˹觷��������������䫵� (background="image.gif") - ���˹��ٻ�Ҿ����������䫵���� (background="http://www.example.com/image.gif")
������ҧ�����ҹ <body background="bg.gif"> <h2><p align="center">�������Ҿ�����ѧ���Ѻ���ྨ</p></h2> ����ʴ��� �մ���
�������Ҿ�����ѧ���Ѻ���ྨ����� (Fixed) ��������١������Ѻ�Ҿ�����ѧ�¡���ʴ��Ҿ�����ѧ㹵��˹������ʹ �����Ҩ�����ᶺ���� (Scrollbar) �������ŧ�Ҿ�����ѧ�������������ʹ��������������ŧ��������Һ�˹����� Attribute �ٻẺ�������<body background="url" background="fixed">...</body>value�դ������ ��� fixed ��˹����ҡ��ѧ����Ѻ��� ������ҧ�����ҹ <body background="bg.gif" background="fixed"> <h2><p align="center">�������Ҿ�����ѧ���Ѻ���ྨ�����</p></h2> ����ʴ���
การทําพื้นหลังของ Webpage มีกี่แบบการกำหนดสีให้กับพื้นหลังและตัวอักษรนั้นสามารถกำหนดได้ 2 รูปแบบดังนี้ แบบที่ 1 แบบระบุชื่อสี เช่น red, green, blue, yellow เป็นต้น แบบที่ 2 แบบระบุด้วยเลขฐาน 16 หรือ หลักการผสมสีแบบ RGB เช่น เช่นการกำหนดสีพื้นหลังของเว็บเพจเป็นสีเขียวและกำหนดให้สีอักษรเป็นสีแดง
การกําหนดสีของตัวอักษร มีกี่แบบ อะไรบ้างการกำหนดสีของตัวอักษรหรือข้อความ นั้นจะสามารถกำหนดได้ 2 แบบ ดังนี้ 1. กำหนดโดยใช้ชื่อสี เช่น red, yellow, blue หรือ pink เป็นต้น
การใส่รูปภาพ พื้นหลังใช้คำสั่งใดสำหรับในการแทรกรูปภาพบนหน้าเว็บเพจนั้นสามารถทำได้ง่ายๆ ด้วยการระบุคำสั่ง <IMG SRC="ชื่อรูปภาพ"> ดังตัวอย่างนี้จะเป็นการแทรกรูปภาพทั้งเป้นพื้นหลังและในหน้าเว็บเพจ
HTML ที่ถูกต้องในการเพิ่มสีพื้นหลังคืออะไร?การใส่สีให้กับพื้นหลังมีคำสั่งดังต่อไปนี้ <body bgcolor ="#FFCCFF"> <-- ใส่คำว่า bgcolor="ค่าสี" ต่อจาก การเปิดแท็ก <body> ทดสอบสีของพื้นหลัง ... . ผลลัพท์ที่ได้ ทดสอบสีของพื้นหลัง ... . ผลลัพท์ที่ได้ ทดสอบค่าสีโดยใช้ชื่อสีโดยตรง ... . ตัวอย่างการกำหนดค่าสีแบบตัวเลข "#000000"= สีดำ. |