หลังจากที่มีข่าวคราวของเจ้า Google +1 (กูเกิ้ล พลัส วัน) ซึ่งมีลักษณะเหมือน like ของ facebook นั่นเอง เราสามารถเอา code ได้จาก http://www.google.com/webmasters/+1/button/

โดยมี code ตัวอย่างดังนี้

<!– Place this tag in your head or just before your close body tag –>

<script type=”text/javascript” src=”https://apis.google.com/js/plusone.js”></script>

<!– Place this tag where you want the +1 button to render –>

<g:plusone></g:plusone>

ซึ่งจริงๆแล้ว เราไม่ต้องแยกแปะ code java กับ tag div ก็ได้ครับ สามารถใช้รวมกันได้เลย

โดยปุ่ม Google +1 นี้ เราสามารถใส่ url เพื่อแยก link ในหน้าเดียวได้ ตัวอย่าง

<script type=”text/javascript\” src=”https://apis.google.com/js/plusone.js”></script>

<g:plusone size=”medium” count=”true” href=”ลิงค์ที่ต้องการ”></g:plusone>

อีกทั้ง Google ยังช่วยแก้ปัญหาเรื่องขนาดของปุ่มที่แต่ละ social ไม่เคยทำมาให้เท่าๆกัน โดยสามารถเลือกขนาดที่ไกล้เคียงกันได้ โดยเปลี่ยนตรง size=”medium”

โดยดูตัวอย่างของปุ่มได้ที่ http://code.google.com/apis/+1button/#target-url

ในเวอร์ชั่นนี้มีการปรับปรุงหลายอย่าง ซึ่งผู้ใช้งาน WordPress และใช้ BlackBerry ไม่ควรพลาด รีบเข้าไปดาวน์โหลดได้จาก AppWorld ได้แล้ว

ในเวอร์ชั่นนี้มีการปรับปรุงหลายอย่าง ซึ่งผู้ใช้งาน WordPress และใช้ BlackBerry ไม่ควรพลาด รีบเข้าไปดาวน์โหลดได้จาก AppWorld ได้แล้ว

จากคราวที่แล้ว เราสามารถทำ ขอบให้โค้งด้วย css ได้ มาวันนี้จะมาบอกวิธีที่จะเลือกมุมให้โค้งได้ตามใจฉัน มาดูกันเลยครับ

-moz-border-radius-topleft: .625em;
-moz-border-radius-topright: .625em;
-moz-border-radius-bottomleft: 0em;
-moz-border-radius-bottomright: 0em;

-webkit-border-top-left-radius: .625em;
-webkit-border-top-right-radius: .625em;
-webkit-border-bottom-left-radius: 0em;
-webkit-border-bottom-right-radius: 0em;

ใช้ code เหล่านี้แทน code อันเดิม แล้วก็ใส่องศาให้กับมุมได้ตามต้องการครับ

border: 2px solid #0069c2;
border-radius: .625em;
-moz-border-radius: .625em; <-- แทนตรงนี้
-webkit-border-radius: .625em; <-- แทนตรงนี้

เอาไปใส่ CSS แล้วค่อยเรียกใช้ผ่าน div หรือตัวอื่นๆก็ได้ครับ

เอาเพลงเพราะๆมาให้ฟังกัน จากฝาแฝดน่ารักๆ

JS-Officially-Missing-You-Tamia-cover.mp4

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

border: 2px solid #0069c2;  กำหนดสีและความหนาของ border
border-radius: .625em; กำหนดความโค้ง จะเป็น px ก็ได้นะ
-moz-border-radius: .625em; สำหรับ firefox
-webkit-border-radius: .625em; สำหรับ browser อื่นๆ

เช่น

มีให้ใช้ตั้งนานแล้วไม่ยอมใช้ วันนี้ก็เลยลองใช้งานดู ว่ามันจะโอเครึเปล่า

HTML, XML,  XHTML, DHTML, CSS  เป็นคำศัพท์ที่ได้ยินกันบ่อยๆ ในการสร้างเว็บไซต์  แต่หลายคนอาจยังไม่แน่ใจนักว่ามันคืออะไรกันแน่ มีความแตกต่าง  และเกี่ยวข้องกันอย่างไร

Markup Language เป็นภาษาที่ใช้ในการนิยามหรืออธิบายข้อมูล

HTML (ย่อมาจาก Hyper Text Markup Language)
เป็นภาษาที่ใช้สำหรับสร้างเว็บเพจ มีโครงสร้างประกอบไปด้วย tag และ attribute ต่างๆ ที่ใช้ในการควบคุมการแสดงผลของข้อความ รูปภาพ หรือวัตถุอื่น ๆ

XML (ย่อมาจาก eXtensible Markup Language)
เป็นภาษาที่ถูกออกแบบมาเพื่อใช้เป็นภาษากลางสำหรับแลกเปลี่ยนข้อมูลระหว่างกัน
XML เหมาะกับการแลกเปลี่ยนข้อมูลผ่านเครือข่ายคอมพิวเตอร์ เนื่องจาก XML ไม่ได้ขึ้นอยู่กับโปรแกรมประยุกต์หรือระบบปฏิบัติการใด

XHTML (ย่อมาจาก Extensible HyperText Markup Language)
เป็นภาษาที่เกิดจากการนำ XML และ HTML มารวมกัน  กลายเป็นมาตรฐานใหม่ของ HTML    คำสั่งต่างๆนั้นก็ยังเหมือนกับ HTML แต่จะมีความเข้มงวดในเรื่องโครงสร้างภาษามากกว่า และมีการตัด tag และ attribute ที่ล้าสมัยออกไป

DHTML (ย่อมาจาก Dynamic HTML)
ไม่ใช่ภาษา แต่หมายถึง HTML/XHTML ที่นำ JavaScript, VBScript, CSS มาใช้  ทำให้เว็บเพจมีลูกเล่นมากขึ้น และสามารถโต้ตอบกับผู้ใช้งานได้

CSS (ย่อมาจาก Cascading Style Sheets)
เป็นภาษาที่มีรูปแบบการเขียน Syntax ที่เฉพาะ ถูกกำหนดขึ้นเพื่อใช้เสริมภาษา HTML แบบเดิม  ให้สามารถจัดรูปแบบการแสดงผลให้กับเอกสาร HTML/XHTML ได้สมบูรณ์แบบมากขึ้น

เราสามารถตรวจสอบความถูกต้องของคำสั่งในเอกสาร XHTML ว่าถูกต้องตามกฏเกณฑ์หรือไม่ ตาม DTD ที่ระบุไว้ในแถวแรกของเอกสาร ที่ http://validator.w3.org

Exampleตัวอย่างเอกสาร XHTML แบบ strict ที่ไม่ผ่านการ Validation ของ W3C XHTML 1.0

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html>
<head>
<title>XHTML type strict</title>
</head>
<body>
<p align=”CENTER”>Paragraph 1</p>
<p><font color=”red”>Paragraph 2</font></p>
</body>
</html>

Tag และ Attribute ที่ล้าสมัย ที่ไม่สามารถนำมาใช้กับเอกสาร XHTML ที่ใช้ DTD แบบ Strict ได้ ต้องเลี่ยงไปใช้ Tag อื่น หรือใช้ CSS มาช่วยแทน

รายการ Attribute ที่ล้าสมัย มีดังนี้

รายการ attribute ที่ล้าสมัย มีดังนี้