Group Blog
 
<<
กรกฏาคม 2548
 
 12
3456789
10111213141516
17181920212223
24252627282930
31 
 
10 กรกฏาคม 2548
 
All Blogs
 
หรือ Table row มากกว่าใช้กับขนาดความสูงของตารางหรือใน tag
ด้วยครับ

หรือ Table Row ก็คือแถวใหม่ครับ เมื่อใส่ tag ปิด เข้าไปก็เป็นอันจบข้อความในแถวนั้น ๆ

อีกทีครับ สำหรับการใส่ tag ปิด ก็จะแสดงว่า เราปิดรับข้อความใหม่ในช่องตาราง (เค้าเรียก cell) นั้น ๆ ไปแระ

ดังนั้นคำสั่งสำหรับตารางข้างบนก็จะมีลักษณะดังนี้ครับ

Blog tips เก็บ ๆ เค้ามา #13 ติดตารางครั้งแรก!!!





ติดตารางครั้งที่ 1!!!









ตารางไว้ขังใคร?

ก่อนจะเริ่มเรื่อง ขอบ่นก่อนครับ

อันเนื่องมาจากว่าต้องตัดสินใจอยู่นานพอควรว่า จะเขียนต่อดีไหม เพราะว่าเรื่องมันยาก แถมด้วยจุกจิก แถมด้วยยาว และแถมด้วยไม่รู้จะใช้อะไร และ...(ไม่แถม แล้วซื้อเองมั่งสิครับคุณ ป๊าดโธ่...) อีกอย่าง สำหรับ blog แล้วก็ไม่ค่อยจำเป็นต้องใช้ตารางเท่าไหร่นัก ถ้าทำเวปโป๊ประเภทรวมภาพน้องแน๊ก หรือภาพหลุดน้องตุ๊กก็ว่าไปอย่าง (← ใครล่ะนั่นที่ยกตัวอย่าง...) น่าจะไปปรับใช้ได้แบบที่เคยเปรย ๆ ไปใน blog ก่อนหน้านี้น่ะครับ แถม (เหอ เหอ ใจดี) ผมยังใช้คำสั่งกำจัดตารางและสีพื้นหลังของตารางไปอีก ทำให้ไม่แสดงผลเอาได้ง่าย ๆ เมื่อลงบทความนี้ไปแล้ว ก็เป็นอันว่าต่อไปก็จะใช้คำสั่งกำจัดตารางไม่ได้อีกแล้ว...น่ะครับ

สุดท้ายก็ตัดสินว่าจะเขียน เปล่าครับ ไม่ได้เพราะขยันหรืออะไรเลยครับ เพราะว่า ลอกเค้ามาน่ะคร๊าบบ 5 5 5 5 5 ลอกแล้วก็เอาให้ครบมันทุกเรื่องไปเลย


มามะ จิ้มมาแล้วก็มาอ่านกันซะดี ๆ



ตาราง



ตารางหรือว่า Table นั้นใช้เพื่อแสดงข้อมูลของเรา สำหรับการสร้างหน้า web page หรือ blog ต่างก็นิยมแอบใช้ตารางมาวางไว้ เพื่อแบ่งส่วนของข้อมูลออกเป็นส่วน ๆ น่ะครับ เช่น หน้า blog ของเราก็ประกอบไปด้วยตารางที่แสดงข้อมูลใน blog ปฏิทิน ข้อความหรือภาพที่เราแต่ง และใส่เข้าไป ด้านขวาสุดก็เป็นช่อง personal profile และ freind links ครับ จะเห็นว่ามีการประยุกต์นำตารางมาใช้อย่างมาก การแบ่งเป็นตาราง ช่อง ๆ แบบนี้ทำให้เราสามารถจำกัดข้อมูลในตารางได้ดีขึ้น

บางคนก็เริ่มคิดว่า โหย ยากโคตะระ ขนาดนี้ ใครจะไปนั่งเขียน (นึกรึว่าคิดเบา ๆ แล้วจะไม่ได้ยิน 5 5 5) จริง ๆ แล้ว เราสามารถใช้โปรแกรมที่เค้าสร้าง ๆ กันมาแล้วเพื่อทำตารางที่ว่าได้อย่างง่ายดายครับ เช่น Dreamweaver เป็นต้น และทำได้ง่ายกว่ามากครับ บางคนก็อาจจะไปสร้างตารางใน MS Word หรือ MS Excel แล้ว capture หน้าจอ ตัดภาพมาปะ นั่นก็ง่ายเหมือนกันครับ หรืออย่างในคำสั่งที่ทำให้พื้นหลังของช่องความเห็น (text area) มีสี หรือรูปที่แตกต่างไป เราก็ใช้การสร้างตารางหลอก ๆ ขึ้นมาแล้วแอบใส่พื้นหลังหรือสีลงไปในตารางนั่นแหละครับ สังเกตคำสั่งได้เลยครับ ... ตอนนี้รู้สึกว่า ตารางเป็นสิ่งที่สำคัญมากขึ้น (นิดหน่อย) หรือยังครับ

เห็นไหมครับ (เห็นด้วยได้แล้วคร๊าบบ แอบพยักหน้าเร็ว ๆ เลย) จริง ๆ ตารางเป็นเรื่องพื้นฐานมาก ๆ แต่ว่าเราคงวาดภาพในใจว่ามันเป็นแบบนี้


คำศัพท์วันนี้ช่อง 3ช่อง 7
อั้มพระเอกหน้าเด้งกว่านางเอก เจ๋งมาก ๆนางเอกอึ้มมาก โป๊เกือบทุก scene เชียวล่ะ เอิ๊กส์
ที่มาเรื่องอะไรล่ะเนี่ย จำไม่ได้แค่โดนบังคับดูเป็นครั้งคราวเพลิงพายุ ดูเฉพาะ...ตอนนางเอกมาเท่านั้นครับ





มาดูคำสั่งที่ใช้นะครับ

ก็คือตาราง ที่เราจะใส่ทุก ๆ อย่างไว้ข้างในนะครับ ทุกอย่างที่ว่านี่ ก็หมายถึง ข้อความ (text) ภาพ (image) ภาพเคลื่อนไหว (flash หรือ movie file) เพลง (flash หรือ audio file อื่น ๆ) link ไปยังหน้าอื่น หรือแม้แต่จะใส่ตารางเข้าไปอีกอันในช่อง cell เดิม (nested table) ก็ยังได้เลยครับ สำหรับ tag คำสั่งนี้ก็ยังมีคำสั่งขยาย ประเภทต่าง ๆ อีกหลายอัน เดี๋ยวค่อยมาว่ากันครับ เมื่อสิ้นสุดการสร้างตารางก็ต้องใส่ tag ปิด
เข้าไปด้วยครับ

หรือ Table Header ก็คือคำสั่งที่กำหนดหัวเรื่องนั่นเองครับ ผลที่เกิดเมื่อใช้ทำสั่งนี้ก็คือ มันจะทำให้ตัว text ในช่องนั้น ๆ กลายเป็นตัวหนา (bold) และจัดให้ข้อความนั้น ๆ อยู่กลางหน้า (center) และกลางช่องแนวตั้ง (middle) โดยอัตโนมัติ... และเช่นเคยครับ อย่าลืม tag ปิด
หรือ Table Data คือ เนื้อหาข้อความที่เราใส่เข้าในแต่ละช่องตาราง คำสั่งนี้จะแทรกในคำสั่ง table row หรือ
← ก็เป็นคำสั่งเริ่มให้ browser รู้ว่าจะมีตารางแล้วนะ
← เริ่มบอกว่าตรงนี้คือจะเริ่มตารางในแถวแรกแล้ว
     
←ใส่เนื้อความเข้าไปในช่องแล้วปิดล่ะครับด้วย ยุงเข้า... หึ หึ
     

← เปิดแล้วก็ต้องปิดแถวตารางด้วยครับ เดี๋ยวนักโทษหนีหมด

     

     

     



     

     

     


คำศัพท์วันนี้ ช่อง 3ช่อง 7
อั้มพระเอกหน้าขาวเด้งกว่านางเอกนางเอกอึ้มมาก โป๊เกือบทุก scene เชียวล่ะ
ที่มาเรื่องอะไรล่ะเนี่ย จำไม่ได้ไม่รู้ ไม่ได้ดูช่องนี้นี่



พอได้ไหมครับ



ตกแต่งตาราง



การตกแต่งตาราง ไม่ต้องขออนุญาติผู้คุม ไม่ต้องขอแม่ยกขันหมากมาแต่ง (ฮา... ไม่ก็แป๊กสิครับ แหง่ก ...T___T ) ขอมีคำสั่ง ซ้ำ ๆ เดิม ๆ ไม่กี่คำสั่งก็ใช้การได้แล้ว มาดูกันครับ

height และ width สำหรับ width คือการกำหนดค่าความกว้างของตารางครับ โดยจะกำหนดได้เป็นทั้งแบบใส่ตัวเลขเฉย ๆ ก็จะหมายถึงจำนวน pixel ที่ต้องการ ส่วนถ้าจะใส่เป็นเปอร์เซ็นต์ ก็ได้ครับ ค่าจะไปเทียบกับความกว้างของจอ เช่น หน้าจอขนาด 1024 pixel และคิด 50% ก็ได้ขนาดตารางกว้างเท่ากับ 612 pixel เป็นต้น ส่วน height เป็นการกำหนดให้ตารางมีความสูงขนาดไหน มันจะไปใช้ตอนสั่งคำสั่งที่กำหนดลักษณะของ cell ในส่วนของ tag
สำหรับค่าที่ใช้ ก็เหมือน ๆ กันครับ ไม่แตกต่างกับ width คือ กำหนดเป็นตัวเลข pixel หรือกำหนดเป็นเปอร์เซ็นต์ รูปแบบคำสั่งที่ออกมาก็จะเป็น
width="ตัวเลขระบุ pixel ที่ต้องการหรือเปอร์เซ็นต์ที่จะใช้ อย่าลืมใส่ "%" ไปด้วยนะครับ"> หรือ
height="ความสูงที่เราต้องการ"> ประมาณนี้ล่ะครับ

background ก็คือ พื้นหล้งของตารางครับ เราสามารถกำหนดให้เป็นสีหรือกำหนดให้เป็นภาพก็ได้ โดยใช้คำสั่งเดิม ๆ เข้าไปน่ะครับ คำสั่งที่ใช้ก็คือ bgcolor="..." สำหรับการใส่สีที่ต้องการ และคำสั่ง background="url ของภาพที่เราจะมาทำเป็น background" เราสามารถจะนำคำสั่งเหล่านี้ไปใส่ได้ในทั้งหลัง tag , และ
ก็ได้ครับ คำสั่งที่ได้จะเป็นแบบนี้ครับ bgcolor="code สีที่ต้องการ หรือชื่อสีก็ได้ครับ"> หรือ
background="url ของภาพที่จะใส่เป็นพื้นหลัง"> เป็นต้น

border ก็คือค่าความหนาของขอบตาราง มีหน่วยเป็น pixel ละไว้ไม่ต้องใส่ คำสั่งจะเป็นลักษณะเดิม ๆ คือ 0"> blar blar blar
โดยถ้ากำหนดเป็น 0 ก็คือไม่มีขอบนั่นเองครับ

align อันนี้ก็ตัวเดิม เป็นการบอกว่าจะจัดหน้าตารางอย่างไรเมื่อเทียบกับหน้าจอ หรือทั้ง web ครับ ตัวเลือกก็มี center,left และ right แค่นี้ล่ะครับ สำหรับ tag คำสั่งนี้ก็วางไว้ได้ทั้งหลัง tag และ
เลยครับ


ข้อควรระวัง
  1. อย่าลืมจัดให้มีการเปิดและปิด tag คำสั่งอย่างสม่ำเสมอครับ ถ้าไม่ปิด ผลที่ได้จะแสดงไม่ได้ดี หรือไม่แสดงผลเลยก็ได้
  2. ใน bloggang ของพันทิปนั้นจำเป็นต้องระวังเรื่องการเว้นบรรทัดมากครับ เพราะว่าเมื่อเราเว้นบรรทัดในการพิมพ์ปุ๊บ ทางระบบก็จะทำการเว้นวรรคให้ปั๋บ ทำให้การแสดงผลออกมาแปลก ๆ เราจะต้องทำข้อความให้อยู่ในบรรทัดเดียวกันเสมอครับ สำหรับกรณีที่เราต้องการเว้นวรรคก็ใส่คำสั่ง
    หรือ
    เข้าไปท้ายข้อความที่เราต้องการแล้วก็สามารถขึ้นบรรทัดใหม่ได้อย่างถูกต้องตามกฎหมายครับ
  3. ใครที่เริ่มไม่เข้าใจ ขอให้ใช้เวลาทำความเข้าใจเพิ่มอีกนิดครับ เวลาพิมพ์ code ต่อไปในอนาคตจะได้พอเข้าใจคำสั่ง แต่บางอย่างก็ไม่ต้องจำหรอกครับ
  4. ใช้ program ช่วยง่ายกว่าแยะครับ Dreamweaver ทำได้ทุกอย่าง ง่ายกว่าด้วยล่ะครับ 5 5 5
  5. เวลาสร้างตารางต้องอาศัยจินตนการไปด้วยนิดหน่อยครับ เพราะว่าต้องกะว่า ในแนวนอนจะมีกี่ cell แนวตั้งจะมีกี่ cell โดยเราก็ยังไม่เห็นผลจนกว่าจะเขียน code เสร็จ เพราะฉะนั้น ถ้าหากทำตารางตกไปแถวแนวตั้งนึงนี่ก็แก้กันหน้ามืดตึดตื๋อละครับ
  6. ควรทำใน note pad ก่อนนะครับ มันมาพร้อมเครื่องนั่นล่ะ ลองดูใน Start>All program>Accessary>notepad ดู


ไงครับ งงได้ที่ตาม concept หรือยัง เรื่องคุกเรื่องตารางนี่ยังมีต่อนะครับ... โปรดติดตามตอนต่อไป


[สมุดเยี่ยม]









Create Date : 10 กรกฎาคม 2548
Last Update : 2 ธันวาคม 2549 23:54:54 น. 19 comments
Counter : 665 Pageviews.

 



ขอบคุณค่ะ ..
หนี่ฯจะนำเก็บไว้ใช้ ในคราวที่หนี่ฯต้องการค่ะ

วันนี้ ไปพักผ่อน นอกบ้านรึปาววค่ะ
หนี่ฯอยากรู้ค่ะ อิ .. อิ ..


โดย: หนี่หนีหนี้ วันที่: 10 กรกฎาคม 2548 เวลา:7:24:07 น.  

 
สวัสดีค่ะ ป้ามดต้องมานั่งเรียนที่นี่ทุกวันเลย


โดย: ป้ามด วันที่: 10 กรกฎาคม 2548 เวลา:8:32:31 น.  

 
ฮาโหล มาอ่านหาความรู้จ๊า...


โดย: Angel Tanya วันที่: 10 กรกฎาคม 2548 เวลา:8:49:17 น.  

 
มาแอบเก็บความรู้ค๊า คุนคู..

ซำบายดีนะก๊ะ


โดย: ธูปหอมเทียนสว่าง วันที่: 10 กรกฎาคม 2548 เวลา:9:30:45 น.  

 
มานั่งเรียนด้วยค่ะ
ขอบคุณสำหรับความรู้นะคะ


โดย: grappa วันที่: 10 กรกฎาคม 2548 เวลา:10:11:29 น.  

 
หวัดดีค่ะ...รอติดตามตอนต่อไปนะคะ


โดย: นุทศรี!! วันที่: 10 กรกฎาคม 2548 เวลา:10:39:46 น.  

 
ชอบอ่านค่ะ จะได้ทำให้ตัวเองฉลาดขึ้นมาอีกหน่อย


โดย: Xenosaga วันที่: 10 กรกฎาคม 2548 เวลา:11:10:52 น.  

 
เก่งมากฮะ

แค่ธรรมดาก็ยากสำหรับผมแล้วง่ะ...


โดย: รู้สึกแปลก วันที่: 10 กรกฎาคม 2548 เวลา:12:11:24 น.  

 
55555คิดว่าเรื่องตะรางจริงๆนะคะ
คิดว่างั้นจริงๆ โหยๆๆ

ดีค่าได้ความรู้มากๆๆ


โดย: prncess วันที่: 10 กรกฎาคม 2548 เวลา:12:27:46 น.  

 
เข้ามารับความรู้ด้วย โอ้ว.. มึนเลยเรา


โดย: Mint@da{-"-} วันที่: 10 กรกฎาคม 2548 เวลา:12:59:58 น.  

 
แวะมาค่ะ
อืม รู้อะไรมากขึ้น
แต่ ไม่ทำ

อิๆ เป็นพวกlow tech น่ะ


โดย: quin toki วันที่: 10 กรกฎาคม 2548 เวลา:13:13:22 น.  

 
เคยจะใส่ทีปวดหัวมึนตึ้บ เลยเล่นปล่อยนักโทษหนีหมดครับ

อ่านเข้าใจง่ายดีครับ ขอบคุณมาก ครับ


โดย: noom_no1 วันที่: 10 กรกฎาคม 2548 เวลา:13:31:26 น.  

 
ได้ความรู้มาอีกแล้วค่ะ แต่ก็ยากที่จะลองสำหรับตัวเองเหมือนกันนะค่ะ


โดย: JewNid วันที่: 10 กรกฎาคม 2548 เวลา:13:34:22 น.  

 
มาแจก จำนรรจาภาษาเห็ด อีกแล้วนะครับ....
ศึกษาด้วยคนคับ...


โดย: namit วันที่: 10 กรกฎาคม 2548 เวลา:15:00:50 น.  

 
เห็นชื่อหัวข้อแล้วตกใจค่ะ อิอิ



โดย: Tai-Sarunya IP: 203.107.197.109 วันที่: 10 กรกฎาคม 2548 เวลา:15:18:57 น.  

 
ขอบคุณมากค่า ความรู้ใหม่ๆ ^^




...


โดย: ขอบคุณที่รักกัน (blueberry_cpie ) วันที่: 10 กรกฎาคม 2548 เวลา:17:24:12 น.  

 
วันนี้มาดูเรื่องตารางค่ะ


โดย: ป้ามด วันที่: 18 กรกฎาคม 2548 เวลา:17:25:59 น.  

 


งง เจงๆ ก๊า


โดย: ช้อนชาสีน้ำเงิน วันที่: 26 กรกฎาคม 2548 เวลา:13:27:29 น.  

 
ถามหน่อยค่ะ ใส่กรอบให้บลอกส่วนที่เป็นเนื้อหาทำยังงัยหรอคะ


โดย: irean วันที่: 11 มีนาคม 2551 เวลา:2:18:03 น.  

ชื่อ : * blog นี้ comment ได้เฉพาะสมาชิก
Comment :
  *ส่วน comment ไม่สามารถใช้ javascript และ style sheet
 

dont wanna no
Location :


[ดู Profile ทั้งหมด]

ให้ทิปเจ้าของ Blog [?]
ฝากข้อความหลังไมค์
Rss Feed

ผู้ติดตามบล็อก : 2 คน [?]








Google all webbloggang



คำเตือน

ขอสงวนสิทธิ์ข้อความและภาพ ตลอดจนชื่อคำขวัญ (slogan) และข้อความ "เที่ยวไปงงไป" ที่ปรากฏทั้งหมดในสื่อคอมพิวเตอร์แห่งนี้ ตามพระราชบัญญัติลิขสิทธิ์ปี พ.ศ. ๒๕๓๙ ห้ามมิให้นำไปดัดแปลง ต่อเติม ทำซ้ำ หรือเผยแพร่และอ้างอิงส่วนหนึ่งส่วนใด หรือทั้งหมดเพื่อการค้าโดยไม่ได้รับอนุญาตเป็นลายลักษณ์อักษร ผู้ละเมิดจะถูกดำเนินคดีตามที่กฏหมายบัญญัติไว้สูงสุด



สิทธิพิเศษสำหรับสมาชิกพันทิป ท่านสามารถนำข้อมูลไปใช้ในการตกแต่ง blog ของท่านได้ด้วยความยินดีมากครับ ตกแต่งเสร็จแล้วมาตามไปดูบ้าง จะยินดีมากขึ้นไปอีก

Friends' blogs
[Add dont wanna no's blog to your web]
Links
 

 Pantip.com | PantipMarket.com | Pantown.com | © 2004 BlogGang.com allrights reserved.