มาเขียนเว็บกับภาษา html [1]
posted on 06 Apr 2006 23:31 by rije in HTMLหลังจากเมื่อวันก่อนนี้ได้เขียนถึง html กันไปบ้าง
วันนี้จึงมาสอนเพิ่มเติ่มงับ ไปอ่านกันต่อเลย~! ^^
*-*-* อ้อ ส่วนเรื่อง php ไว้เป็นหลังจากนี้นะครับ *-*-*
................................................................................
เรามาเรียนเรื่อง Table(ตาราง)กันต่อเลยนะครับ
<TABLE WIDTH=0% HEIGHT=0% CELLSPACING=0 CELLPADDING=0 BORDER=0>
<TR>
<TD></TD>
</TR>
</TABLE>
อธิบายแต่ละตัว
width - กำหนดความกว้าง จะใช้เป็น % หรือว่าตัวเลขก็ได้
% ตั้งแต่ 1- 100 ส่วนตัวเลขจะกำหนดในหน่วย pixel
height - กำหนดความสูง
CELLSPACING - ระยะของเส้นกรอบ(ขนาด) ประมาณช่องไฟ ช่องว่าง
CELLPADDING - ขนาดของระยะตัวอักษรถึงกรอบ
BORDER - ขนาดเส้นกรอบ หากใส่ 0 คือไม่มีเส้นกรอบ เลขมากกรอบก็จะหนา
<TR></TR> - หมายถึงหลัก
<TD></TD> - หมายถึงแถว ใส่อยู่ในระหว่างหลัก เช่น
<TR>
<TD>test01</TD>
<TD>test02</TD>
<TD>test03</TD>
</TR>
**** เราใส่ข้อความใส่ระหว่าง <TD> .... </TD> เหมือตัวอย่างข้างบน
ในส่วนที่กำหนดพวก border , height อะไรพวกนี้สามารถใส่โค้ด
พวกกำหนดสี bgcolor หรือใส่ภาพ background ได้
(กำหนด Table อยู่ระหว่าง <body> ... </body>
.........................................................................
ต่อไปเรื่อง Frameครับ พวกรายละเอียดส่วนย่อยก็ลง comment ถามมาได้ครับ
frame คือการแบ่งส่วนกรอบ
สมมติ คุณมีกระดาษสี่เหลี่ยม 1 แผ่น คุณลากเส้นยาวแบ่งครึ่งกระดาษ
เป็นส่วนบนและส่วนล่าง นั่นก็เหมือนคุณแบ่งส่วน frame นั่นเอง
การเขียน frame แบบธรรมดาๆ ซึ่งจะแบ่งส่วนเป็น 2 ส่วน
โดยส่วนหนึ่งมีความกว้าง (cols = คอลัมภ์) 120 pixel
และอีกส่วนคือขนาดที่เหลือ
หากเปลี่ยนจาก cols เป็น rows คือการกำหนดแถวนั่นเอง
ตัวอย่าง
<FRAMESET COLS="100%" ROWS="25%,*">
<FRAME NAME="ใส่ชื่อเฟรมส่วนที่ 1" SRC="ชื่อเพจ.html" SCROLLING="AUTO" FRAMEBORDER="YES" MARGINHEIGHT= MARGINWIDTH= FRAMESPACING=>
<FRAMESET ROWS="100%" COLS="25%,*">
<FRAME NAME="ใส่ชื่อเฟรมส่วนที่ 2" SRC="ชื่อเพจ.html" SCROLLING="AUTO" FRAMEBORDER="YES" MARGINHEIGHT= MARGINWIDTH= FRAMESPACING=>
<FRAME NAME="ใส่ชื่อเฟรมส่วนที่ 3" SRC="ชื่อเพจ.html" SCROLLING="AUTO" FRAMEBORDER="YES" MARGINHEIGHT= MARGINWIDTH= FRAMESPACING=>
</FRAMESET>
</FRAMESET>
FRAME NAME - กำหนดชื่อ frame (ตามใจคุณ) หากมีการลิงค์ไปยังเฟรมนั้นๆ
เช่น <a href="url.html" target="ชื่อเฟรม">link</a>
SCROLLING - กำหนดให้มี scrollbar หรือไม่ กำหนดโดย AUTO , YES หรือ NO
FRAMEBORDER - เส้นขอบของ frame
MARGINHEIGHT - ขอบ หรือ เนื้อที่ริมกระดาษ (ความสูง)
FRAMESPACING - ขนาดของเส้นกรอบของ frame
สีกำหนดถึงการแบ่ง frame เป็น2 ส่วน
ส่วนแรก - เรากำหนดความกว้าง 100% คือกว้างเต็ม
ส่วนแถวกำหนด 25% จากจอของคุณที่จะแสดงให้เห็น
ส่วนที่สอง - กำหนดแถวให้สูงเต็มพิกัดที่เหลือจาก frame อันแรกคือ
ถ้านับจาก frame แรก อยู่ในส่วนของหลักที่ 2 ความสูงจาก 100
เหลือ 75% ในส่วนที่สองกำหนดสูง 100% จาก 75% นั่นเอง
ส่วนหลัก 25 % และ 75% (ใส่ * แทนการกำหนดเป็นตัวเลข)
การเซฟ frame อาจนำโค้ดใส่ระหว่าง <html><head>...</head></html>
แต่ไม่ใส่ <body> กับ</body> ไม่งั้น frame จะทำการไม่ได้ครับผม
frame คือการแบ่งส่วนกรอบ หากคุณแบ่งส่วนกรอบเป็น 2 ส่วน
แล้วเซฟให้โค้ด frame เป็นชื่อ frame.html ใส่ frame ที่เขียน
ได้แบ่งเป็น 2 ส่วนนั้น จะโชว์หน้าเพจตามชื่อที่ใส่ไปในโค้ดนั่นเอง
ในส่วนของ frame หากไม่เข้าใจแล้วจะไม่รู้เรื่อง
เพราะงั้นต้องลงมือทำครับ
ตัวอย่าง
<HTML>
<HEAD>
<TITLE>ใส่ชื่อ title ตรงนี้</TITLE>
</HEAD>
<FRAMESET ROWS="100%" COLS="25%,*">
<FRAME NAME="frame01" SRC="page01.html" SCROLLING="NO" FRAMEBORDER="YES">
<FRAME NAME="frame02" SRC="page02.html" SCROLLING="AUTO" FRAMEBORDER="YES">
</FRAMESET>
</HTML>
แล้วเซฟส่วนนี้ใช้ชื่ออะไรก็ได้ เป็น .html
แล้วเขียนเพจอีก 2 ส่วนชื่อ page01.html และ page02.html
แล้วทำการเปิดเพจที่เซฟ frame ขึ้น จะเห็นภาพได้ชัดกว่านี้ครับ ^^
...................................................................
ส่วนที่จะสอนคงมีเพียงเท่านั้นครับ คราวหน้าผมจะนำโค้ดต่างๆ
ที่น่าสนใจมานำเสนอ ให้มากเท่าที่จะมากและอธิบายให้เข้าใจได้ครับ
แล้วจะนำโค้ด CSS มาลงสอนด้วย จากนั้นคงจะเป็นเรื่อง php
ไม่ก็เรื่องการทำ board จากโค้ด phpbb ครับ ^_^
