วันอาทิตย์ที่ 7 มิถุนายน พ.ศ. 2552

ขีดเส้นใต้บทความ

สวัดดีค๊าป
วันนี้มาบอกเล่าเก้าสิบกัน ถึงเรื่องการขีดเส้นใต้บทความ
เพื่อเป็นการแบ่งบทความแต่ละอันให้เป็นสัดส่วน (เป็นท่อนๆ)
วิธีการนั้นก็แสนจะง๊ายย ง่าย
เพียงแค่เพิ่ม

<HR>

ไว้ตรงตำแหน่งที่เราจะขีดเส้นใต้ เพียงแค่นี้เอง

ลองเอาไปใช้กันดูนะเค๊อะ
เขียนโดย ที่ ไม่มีความคิดเห็น:
ป้ายกำกับ:

วันพฤหัสบดีที่ 4 มิถุนายน พ.ศ. 2552

การกำหนดขนาดตัวอักษร

หวัดดีค๊าปเพ่น้อง ช่วงนี้อากาศเริ่มมีฝนฟ้า ตกเกือบทุกวันเลย ยังไงก็ระวังเป็นหวัดกันเน้อ รักษาสุขภาพกันด้วย เด๋วจะหาว่าไม่เตือนนะ อิอิ
เอาละ คราวที่แล้วเราได้ทำการใส่สีให้ตัวอักษรกันไปแล้ว คราวนี้ เราจะมาปรับขนาดกัน โดยยังคงใช้ TAG อันเดิมคือเจ้า ....

<FONT> ...... </FONT>

นั่นเอง แอบทริบิวท์ตอนใส่สีคราวที่แล้วคือ color ลองเดาดูว่า ถ้าเป็นปรับขนาดจะใช้คำว่าอ่ะไร ติ๊กต๊อกๆๆ
..................... ปิ๊งป่อง
ถูกต้องนะค๊าป!! SIZE นั่นเอง
คราวก่อนโน่น เราได้ทำการเพิ่มขนาดตัวอักษร กับ ลดขนาดตัวอักษร ได้แค่ 1 ระดับ โดยใช้คำสั่งว่า

<BIG>......</BIG>
<SMALL>......</SMALL>

แต่เจ้า <FONT Size="......">......</FONT>
เราสามารถกำหนดขนาดของมันเองได้ถึง 7 ระดับ โดยกำหนดได้ด้วยตัวเลขเลย
หรือแบบที่2 กำหนดโดยใส่ค่า +/- แล้วกำหนดระดับอีกที อาจจะงง ลองมาดูตัวอย่างเช่น

<FONT Size="1">......</FONT>
<FONT Size="2">......</FONT>
<FONT Size="3">......</FONT>
<FONT Size="+1">......</FONT>
<FONT Size="+2">......</FONT>
<FONT Size="-2">......</FONT>
<FONT Size="-1">......</FONT> เป็นต้น

ถ้าอยากรู้ว่าระดับที่ 1-7 มีขนาดเท่าไรบ้าง ลองมาเทียบกันเลย

ปรับแต่งตัวอักษรระดับ 7 <--ลองทำดู Blogger มันกำหนดสูงสุดได้แค่ 5ง่ะ ปรับแต่งตัวอักษรระดับ 6 <--ลองทำดู Blogger มันกำหนดสูงสุดได้แค่ 5ง่ะ
ปรับแต่งตัวอักษรระดับ 5
ปรับแต่งตัวอักษรระดับ 4
ปรับแต่งตัวอักษรระดับ 3
ปรับแต่งตัวอักษรระดับ 2
ปรับแต่งตัวอักษรระดับ 1

***หมายเหตุ***
ระดับ 7 , 6 ลองทำดูเองนะใน Blogger มันกำหนดสูงสุดได้แค่ 5ง่ะเพราะอาจจะเป็นที่เขียน CSS ไว้หรือเปล่าผมก็ไม่ทราบแต่อย่างใด -*- ไว้ถึงตอนนี้ (เรียนรู้ไปถึง) ก็ค่อยมาแก้เน๊าะ

เพื่อนๆ สามารถใส่ แอบทริบิวท์ ซ้อนกันได้ถ้าสมมุติว่า เราจะทำอักษรระดับ5 สีแดง ตัวหนา โดยหลักการเป็นดังนี้

<B><FONT Size="5" color="red">ตัวอักษรระดับ 5 <FONT> </B>

ตัวอักษรระดับ 5

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

วันพุธที่ 3 มิถุนายน พ.ศ. 2552

มาใส่สีตัวอักษรกันดีฝ่า

หายไป 3 วันไม่ได้หลบไปเที่ยวไหนนะครับ พอดีที่บ้านกำลังรื้อระบบไฟใหม่ เลยถูกตัดการเชื่อมต่อจากโลกไซเบอร์ *-* ตอนนี้ก็กลับเข้าสู่ภาวะปกติแล้ว (ประมาณ 80%) เอาละครับ ตามที่ตกลงกันไว้ว่า คราวนี้เราจะมาเรียนรู้การใส่สีตัวอักษร พร้อมๆกันเล๊ยยย

การใส่สีตัวอักษรมีหลายวิธีการ แต่ที่จะนำเอามาบอก เล่าสู่กันฟังมีอยู่ 2 วิธีการคือ

  • ใส่สีทั้งหน้าเพจ
  • ใส่สีให้ตัวอักษรบางกลุ่ม
เรามาลองดูวิธีการที่
1.ใส่สีตัวอักษรทั้งหน้าเพจกันก่อน สิ่งที่จำเป็นต้องรู้ในวรยุทธ์นี้คือ <BODY> ที่เคยเจอกันในบทแรกๆนั่นแหละครับ ยังจำได้ไหมว่ามันเอาไว้ทำอะไร ถ้าลืมก็กลับไปอ่านก่อน คลิกที่นี่

ขั้นตอนต่อมาคือการเพิ่ม แอทริบิว(attribute) TEXT="#ค่าสี" เข้าไปใน TAG BODY ลองมาดูวิธีการเขียนจริงๆกัน

<BODY Text="#ค่าสี">
......
<BODY>

แล้วค่าสีนั้นเอามาจากที่ไหน
  • ตารางค่าสี (ซื้อมาก็ได้)
  • โปรแกรมแต่งภาพต่างๆ Photoshop, Illustrator (เข้าที่โหมดเลือกสี)
  • Add-on ของ FireFox ColorZilla
  • เขียนชื่อแทนโค้ทสี เช่น สีแดงก็ red, darkred, maroon, crimson etc.
  • และอีกหลายวิธีการ ฯลฯ
อ่ะลืมถาม ยังจำเรื่องค่าสี RGB กันได้ไหมเนี๊ยะถ้าลืมก็กลับไปอ่านก่อน เด๋วจะไม่เข้าใจนะจ๊ะ

ค่าสี RGB

*** หมายเหตุ ***
ค่าสีปกติคือสีดำ ถ้าจะใช้สีดำเป็นตัวอักษรหลักก็ไม่จำเป็นต้องใส่โค้ทตัวนี้แต่อย่างใด
งงกันไหมอ่ะ ค่อยๆทำความเข้าใจกันไปนะไม่ยากหรอก ต่อไป มาดูการใส่สีแบบที่2กัน

การใส่สีให้ตัวอักษรบางกลุ่มด้วย <FONT> + Attribute Color

เช่นการที่เราจะเน้นข้อความให้มีสีสันที่ หัวข้อ/บทความ/ชื่อผู้แต่ง ฯลฯ
สมมุติผมเขียนบทความมาอันนุง และจะให้เน้นสีเฉพาะคำว่า โค้งอันตราย

รูปแบบจะออกมาเป็นแบบนี้

<Font color="red"> โค้งอันตราย </Font>
หรือ
<Font color="#FF0000"> โค้งอันตราย </Font>

ก็ได้ อันนี้ไม่ยากเลยเหมือนกับการใส่ Link ใส่ ภาพนั่นเอง
ทีนี้ลองไปทำให้ตัวอักษรคำว่า โค้งอันตราย เป็นสีแดง + กระพริบ + ตัวหนา กันดูนะทำได้ป่าว

โค้งอันตราย

วันนี้แค่นี้ก่อนนะครับ ถ้ายังงงๆ สงสัยก็ถามเอาไว้ได้นะใน คอมเมนท์ แล้วจะมาตอบให้
เขียนโดย ที่ ไม่มีความคิดเห็น:
ป้ายกำกับ:

วันอาทิตย์ที่ 31 พฤษภาคม พ.ศ. 2552

Blogger กับ iPhone

เขียนโดย ที่ ไม่มีความคิดเห็น:

วันศุกร์ที่ 29 พฤษภาคม พ.ศ. 2552

สนุกกับการปรับแต่งตัวอักษร HTML เบื้องต้น

สวัสดีเพื่อนๆ เบื่อกันอ่ะยาง วันนี้เรามาสนุกกับการปรับแต่งตัวอักษรกันดีกว่า
เนื้อหาเหมือนจะเยอะนิดนุงนะวันนี้ แต่ไม่ยากเลยเพราะหลักการเหมือนกัน (มั่ง) อิอิ

แฮ่มๆ เอาละมาเข้าเรื่องกันเลยดีกว่ามาลองดูเนื้อหาที่จะมาร่ำมาเรียนพร้อมๆกันก่อนดีกว่า

ตัวอักษรปกติ
ตัวหนา
ตัวเอียง
ตัวขีดเส้นใต้
ตัวอักษรใหญ่ขึ้น 1 ระดับ
ตัวอักษรเล็กลง 1 ระดับ
ตัวอักษรขีดฆ่า
ตัวอักษรยกกำลัง
ตัวอักษรห้อย (มันเรียกแบบนี้ป่าวอ่ะ -*-)

โห้วววว แล้วจะจำกันหมดไหมเนี๊ยะ !! ทำใจไว้ก่อนเลย ก่อนอื่นมาลองดูหลักการอันเยอะแยะมากมายกันก่อน
  • ใส่โค้ทคร่อมช่วงที่ต้องการปรับแต่งตัวอักษร
ครับ แค่นั้นจริงๆ ใส่โค้ทคร่อมช่วงที่ต้องการปรับแต่งตัวอักษร แล้วโค้ทคืออะไรบ้างมาลองดูกัน (ทำไมตารางมันร่วงไปอยู่นั่นได้อ่ะ)











แบบตัวอักษรโค้ท
ตัวอักษรปกติไม่ต้องใส่โค้ท
ตัวหนา<B>.....</B>
ตัวเอียง<i>.....</i>
ตัวขีดเส้นใต้<U>.....</U>
ตัวอักษรใหญ่ขึ้น 1 ระดับ<BIG>.....</BIG>
ตัวอักษรเล็กลง 1 ระดับ<SMALL>.....</SMALL>
ตัวอักษรขีดฆ่า<STRIKE>.....</STRIKE>
ตัวอักษรยกกำลัง<SUP>.....</SUP>
ตัวอักษรห้อย<SUB>.....</SUB>



ง่ายมากเลยใช่ไหมครับ แค่จำโค้ทได้ก็สามารถปรับแต่งตัวอักษรกันได้อย่างสนุกสนานเลยทีเดียว
ขอแถมโค้ทอีก 2 TAG ที่สามารถใช้ได้เฉพาะเมื่อเปิดดูด้วย IE (Internet Explorer Browser) เท่านั้น
FireFox และ Safari เปิดดูจะไม่เห็นผลนะจ๊ะ
แก้ไขจ้า ตะกี้เปิดกับ FireFox 3.0.10 แล้วมันใช้ได้อ่ะ แหะๆ

<BLINK>ตัวอักษรกระพริบ</BLINK>
<MARQUEE>ตัวอักษรข้อความเลื่อน </MARQUEE>

ลองเอาไปเล่นกันดูนะ คราวหน้าเราจะมาลงสีให้ตัวอักษรกัน โอ้วว มีสีสันสวยงามมั๊กๆ อ่ะแจ๋วใจร้ายจบพอดีเลย ขอตัวไปอาบน้ำก่อนนะคร๊าบ แล้วเจอกัน
เขียนโดย ที่ ไม่มีความคิดเห็น:
ป้ายกำกับ:

วันพฤหัสบดีที่ 28 พฤษภาคม พ.ศ. 2552

Enter เว้นบรรทัดด้วย TAG BR

แต๊น แตนน!!
สวัสดีจ้า คราวที่แล้ว ได้รู้จักกับ <CENTER> ไปแล้ว คราวนี้ผมจะพาเพื่อนๆไปรู้จักกับ TAG ง่ายๆ สักอันนุง เพื่อเป็นการเรียกน้ำลาย เอ้ย น้ำย่อยก่อนที่จะไปเรื่องตัวอักษรในคราวหน้า

นั่นคือ <BR>

โดยปกติแล้วเพื่อนๆ พิมพ์ข้อความแล้วเซฟเป็นไฟล์ HTML เลย เวลาเปิดผ่าน บราวเซอร์ขึ้นมาก็จะปรากฎข้อความนั้นๆ ยาวเป็นพรืดดดดติดกัน ถึงแม้ว่าเวลาพิมพ์ข้อความย๊าววว ยาวว เพื่อนๆจะกด ENTER เว้นบรรทัดแล้วก็ตาม ชิมิ O_o

แต่ แต่ แต่ ปัญหานั้นจะหมดไป โอ้ววว ซาร่ามันยอดมาก *-*
เพียงแค่คุณพิมพ์ <BR> ต่อท้ายแทนการกด ENTER
สมมุติ นะค่ะ สมมุติ สมมุติว่า ผมจะพิมพ์ ว่า
"ชื่อ นามสกุล บ้านเลขที่ ตำบล/แขวง อำเภอ/เขต จังหวัด"
ให้แยกอยู่คนละบรรทัด จะต้องพิมพ์อย่างไร มาดูกัน

ชื่อ <BR> นามสกุล <BR> บ้านเลขที่ <BR> ตำบล/แขวง <BR> อำเภอ/เขต <BR> จังหวัด


เมื่อลองเซฟแล้วเปิดดูจะพบว่า ผลที่ได้จะเป็นแบบนี้

ชื่อ
นามสกุล
บ้านเลขที่
ตำบล/แขวง
อำเภอ/เขต
จังหวัด

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

ชื่อ <BR>
นามสกุล <BR>
บ้านเลขที่ <BR>
ตำบล/แขวง <BR>
อำเภอ/เขต <BR>
จังหวัด

อันนี้แล้วแต่ความถนัดส่วนตัวนะครับ อิอิ

คราวหน้าผมจะเอาเรื่องการ ปรับแต่งตัวอักษรมาเรียนรู้กับเพื่อนๆพร้อมกัน รับรองสนุกแน่นอนครับ
วันนี้ขอตัวไปดู "เป็นต่อ" ก่อนนะคร๊าบบบบบ *-*
เขียนโดย ที่ ไม่มีความคิดเห็น:
ป้ายกำกับ:

วันพุธที่ 27 พฤษภาคม พ.ศ. 2552

การจัดข้อมูลให้อยู่กึ่งกลาง



สวัสดีครับ วันนี้ขอแนะนำ TAG สุดฮิตสำหรับมือใหม่อย่างผม นั่นคือ แต๊น แต๊นๆ
แท็ก <CENTER> </CENTER>นั่นเอง
ลองมาดูกันว่าเจ้า TAG ตัวนี้มันใช้ยังไง แล้วมันจะสำคัญและใช้เยอะจริงๆสำหรับมือใหม่อย่างที่ผมว่าหรือเปล่า อุอุ

เริ่มด้วย เห็นเจ้ากระต่าย (น่าจะใช่นะ) ที่อยู่ด้านบนของบทความวันนี้ไหมครับ วันนี้เราจะย้ายมันให้มาอยู่กึ่งกลางของบทความกัน เริ่มด้วย การใส่รูปภาพปกติด้วย แท็ก <IMG> </IMG> ถ้าลืมเรื่องใส่ภาพกันไปแล้วกลับไปทบทวนซะดีๆ
>> คลิกที่นี่ <<
ปกติแล้วเมื่ออ้างอิงจากรูปน้องกระต่าย จะเป็น
<IMG> https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh49wAZxJf26_TNPq1vMKm5UpbPwkqI3d-2pjH9-32m50JE-nugxX5mWPyXQGbVaS_qRoGAvxc41pLjXKSO9T0NvAJArAGSl73wYy9eY1bpWgULts9KS0djyNl9uexUlrxriZAcmFnzLg0/s220/0015543.gif </IMG>

แต่คราวนี้เราลองเพิ่ม TAG <CENTER> </CENTER> ไปคร่อม TAG รูปภาพจะเป็น
<CENTER><IMG> https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh49wAZxJf26_TNPq1vMKm5UpbPwkqI3d-2pjH9-32m50JE-nugxX5mWPyXQGbVaS_qRoGAvxc41pLjXKSO9T0NvAJArAGSl73wYy9eY1bpWgULts9KS0djyNl9uexUlrxriZAcmFnzLg0/s220/0015543.gif </IMG></CENTER>

ผลลัพธ์ที่ได้จะออกมาเป็น



แอ๊น แอน แอ๊นนน น้องกระต่ายไปโดดเล่นอยู่ตรงกลางแล้ว
ง่ายใช่ไหมครับ ซึ่งเจ้า <CENTER> </CENTER> นี้สามารถใช้ได้ครอบจักรวาล ทั้งข้อความ รูปภาพ ตาราง ลิงค์ ฯลฯ โดยหลักการก็เหมือนเดิมคือ เอา <CENTER> </CENTER> ไปคร่อมช่วงที่เราจะจัดให้อยู่กึ่งกลาง เท่านั้นเองครับ

ลองไปทำให้น้องกระต่ายกระโดดอยู่ กึ่งกลางหน้ากันดูนะครับ
วันนี้แค่นี้ก่อน พบกันพรุ่งนี้ จ้า
เขียนโดย ที่ 1 ความคิดเห็น:
ป้ายกำกับ:

HTML Language Blogspot Return

สวัสดีครับ ต้องขอโทษเพื่อนๆด้วย เพราะผมหายไปนานมากกกกกกกๆๆ เป็นปีเลยไม่ได้มาอัพต่อ (บอกแล้วเป็นพวกเครื่องร้อนไว แต่ใจมอดเร็ว) -*-
หลังจากนี้ (จะ) พยายามอัพอย่างต่อเนื่อง และ หาเครื่องไม้เครื่องมือในการเรียนรู้ภาษาคอม HTML ในนี้ไปพร้อมกับเพื่อนๆทุกคนเลยนะครับ เอาละมาเริ่มกันเลยยยย ~~~
เขียนโดย ที่ ไม่มีความคิดเห็น:
สมัครสมาชิก: บทความ (Atom)