เทคนิคเล็กๆ น้อยของโค้ด html












โค้ดตั้งหน้านี้เป็นหน้าแรก
a href=# onClick="this.style.behavior='url(#default#homepage)'; this.setHomePage('ใส่เป็นเว็บของเรา');">กำหนดเป็นเว็บเริ่มต้น </a">
กำหนดเป็นหน้าแรก













No Underline : สร้าง link แบบไม่ขีดเส้นใต้

<style>
<! --
A:link { text-decoration: none; color: blue}
A: visited {text-decoration: none' color: blue}
A: hover {text-decoration: none; font-weight: underline; color : red}
// -- >
</style>















Multiple Colors Link: วิธีกำหนดลิงค์กรุ๊ปบล็อกให้มีหลายสี

โดยเข้าไปแก้ไขที่การจัด Group Blog/กลุ่มบล็อกทั้งหมด/เลือกแก้ไขชื่อกรุ๊ปบล็อกที่จะใส่สี

<font color = "red">ชื่อกรุ๊ปบล็อกที่ 1</font>

<font color = "green">ชื่อกรุ๊ปบล็อกที่ 2</font>

ชื่อกรุ๊ปบล็อกที่ 1

ชื่อกรุ๊ปบล็อกที่ 2













สร้างปุ่ม View Source Code ของคุณเอง

ถ้าอยากให้เพื่อนๆที่ชมเว็บเรา ได้เห็นโค้ดที่เราใช้อยู่อย่างง่ายดายก็ลองเอาโค้ดนี้ไปติดค่ะ

<FORM>
<INPUT TYPE="BUTTON" VALUE="View Source" onClick= 'window = "view-source:"
+ window.href'>
</form>









 

Create Date : 15 มิถุนายน 2552    
Last Update : 18 มิถุนายน 2552 13:16:59 น.
Counter : 3272 Pageviews.  
Share

มาทำ Icon แสดงสถานะของ MSN


เพื่อที่จะให้เพื่อนๆ ทราบว่าขณะนั้นเราออนไลน์อยู่หรือไม่


เพื่อให้เพื่อนๆ ที่อยากพูดคุย เข้ามาคุยกันได้ แม้จะไม่มี MSN ก็ตามค่ะ


วิธีทำนะค่ะ


ต้องมี E-mail address ของ Hotmail หรือ Live.com ก็ได้ค่ะ


ขั้นตอนแรก เข้าไปที่เวบนี้


1. เราต้องเป็นสมาชิก และมี MSN Account อยู่แล้วนะครับ หากยังไม่มี


** สมัครสมาชิกเปิดขอใช้บริการอีเมล์จาก //www.hotmail.com


2. เมื่อเรามี Account ของ Hotmail


2.1 ให้เข้าที่เว็บไซต์ //settings.messenger.live.com/Applications/Default.aspx


Log-in เข้าสู่ Account ของเรานะค่ะ


2.2 คลิกเมนู "การตั้งค่าเว็บ" (Web Settings)





ให้ติ๊กอนุญาตให้เว็บไซต์สามารถมองเห็นสถานะของ Messenger ของคุณ และส่งข้อความถึงคุณได้ (Allow websites to see your Messenger status and send you messages)


กดบันทึก (Save)





2.3 จากนั้นก็มาสร้างโค้ดค่ะ (HTML Create HTML)


ให้เลือกปรับขนาดและสีได้เลยค่ะ โดยจะมีให้เราเลือกสามส่วนคือ


หน้าต่าง IM (IM Window) สำหรับให้ระบบสร้าง Code หน้าต่าง MSN ไปติดเว็บค่ะ


Button ปุ่มสำหรับติดหน้าเว็บ


ไอคอนสถานะ(Status icon) สำหรับแสดง icon สถานะออนไลน์ค่ะ จะแสดงสถานะตาม msn ของเราในขณะนั้นจริง





เมื่อได้โค้ดแล้ว ให้นำ Code ที่ได้ด้านล่างมาแปะ ไว้ในส่วนของ Script Area ได้เลยค่ะแค่นี้เราก็มีสถานที่พูดคุยส่วนตัวกับเพื่อนๆ โดยที่ไม่ต้องมีอีเมล์ก็ได้ค่ะ


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





 

Create Date : 11 กรกฎาคม 2551    
Last Update : 11 กรกฎาคม 2551 19:30:00 น.
Counter : 1526 Pageviews.  
Share

โค้ดลบกรอบ+ข้อความเลื่อนขึ้น



กรอบข้อความ

<fieldset style="border:1px solid #color; padding:3; width:200; height:200"><legend align="left"><font color="TITLE">กรอบข้อความ</font></legend><font color="สีของข้อความ"><p align="CENTER">ข้อความที่นี่</p></font></fieldset>





ลบเส้นกรอบทั้งหมดในเว็บ

<style>table, tr, td{border:0px!important;}</style>




ข้อความเลื่อนขึ้น

<marquee behavior=scroll direction=up height=200 scrollamount=1 scrolldelay = 80 ="this.stop()" onMouseOut="this.start()" class="text">
ข้อความที่ให้เลื่อน
</marquee>



Direction=upส่วนอันนี้บอกให้เลื่อนขึ้น แต่ถ้าต้องการให้เลื่อนลงก็ใส่ down ไป

height : คือขนาดความกว้างของแทบเลื่อน

scrolldelay : ความเร็วในการเลื่อนว่าให้ช้าให้เร็วแค่ไหน ตัวเลขยิ่งน้อยยิ่งเร็ว

: อันนี้บอกว่าเวลา Mouse นำไปวางให้มันหยุดเลื่อน

onMouseOut : อันนี้บอกว่าเวลา Mouse ไม่ได้วางให้เลื่อนนั้นเอง




เขียนข้อความลงบนรูปภาพ

<table cellpadding=0 cellspacing=0 border=0 width=ความกว้าง>
<tr><td height=ความสูง background="url ของรูป">
ข้อความ</td></tr></table>


**ความสูง+ความกว้าง กำหนด properties ตามขนาดรูปภาพ







ทดสอบตรงนี้ค่ะ







 

Create Date : 23 มิถุนายน 2551    
Last Update : 23 มิถุนายน 2551 14:26:04 น.
Counter : 1471 Pageviews.  
Share

วิธีใส่แบล็คกราวด์สองชั้นค่ะ


พอดีมีคนหลังไมค์มาถามเรื่องการใส่ BG 2 ชั้น คือ BG ชั้นในและชั้นนอกค่ะ ไหนๆ ก็จะตอบแล้ว ก็เลยเขียนบล็อกใหม่เลยดีกว่า

เผื่อว่าจะเป็นประโยชน์บ้างสำหรับคนที่ยังไม่ทราบวิธีการทำค่ะ

วิธีการทำ BG 2 ชั้นนั้นนะค่ะ จะมีการกำหนดโค้ดอยู่ 2 ส่วนค่ะ คือ


1. โค้ดที่วางในช่อง Script Area จะเป็น BG ชั้นนอกสุด


2. โค้ดที่วางในช่อง Slogan ค่ะ ส่วนนี้จะเป็นส่วนของ BG ชั้นในและภาพหัวบล็อกค่ะ

ส่วนที่วางที่ช่อง Script Area ใช้โค้ดนี้สำหรับใส่ BG พื้นหลังค่ะ

<style>body{background-attachment: fixed;background-image:url(…..url ภาพพื้นหลังค่ะ......);} </style>

หมายเหตุ – สำหรับคนที่ได้กำหนดโค้ดให้ไดอารี่ใส ต้องลบโค้ดส่วนนี้ออกด้วยนะค่ะ เพราะเวลาที่ใส่ BG ชั้นใน จะมองไม่เห็น

ส่วนที่วางที่ช่อง Slogan ใช้โค้ดนี้สำหรับกำหนดภาพพื้นหลังชั้นในและภาพหัวบล็อกค่ะ

<table bordercolorlight="#ffffff" bordercolordark=" #e7e0c9 " align="center" background="none" border="1" cellpadding="0" cellspacing="0" width="65%"><tbody><tr><td>

<table style="border-collapse: collapse;" bordercolorlight="#ffffff" bordercolordark="#e7e0c9" align="center" background="..url ภาพพื้นหลังด้านใน..." border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td><table style="background: ;";cellpadding="0" cellspacing="0" align="center"><tr><td><table style="background: ;";cellpadding="0" cellspacing="0" align="center"><tr><td><center>

<table border="0" width="100%" cellspacing="0" cellpadding="0"
align="center">
<tr>
<td width="ความกว้าง" height="ความสูงค่ะ"
<img border="0" src="...url ภาพหัวบล็อกค่ะ.... " </tr></table>


ตัวอย่าง - ทีนี้ลองมาทำกันจริงๆ ดูคะ

จะใช้ภาพนี้เป็นภาพพื้นหลังด้านนอกนะค่ะ

จะใช้ภาพนี้เป็นภาพพื้นหลังด้านในนะค่ะ

จะใช้ภาพนี้เป็นภาพหัวบล็อกนะค่ะ

ส่วนนี้นำไปวางใน Script Area ค่ะ

<style>body{background-attachment: fixed;background-image:url(//www.eyehome.net/create/back/bg1/20050909_1128868526.jpg);} </style>


ส่วนนี้นำไปวางใน Slogan ค่ะ
<table bordercolorlight="#ffffff" bordercolordark=" #e7e0c9 " align="center" background="none" border="1" cellpadding="0" cellspacing="0" width="65%"><tbody><tr><td>

<table style="border-collapse: collapse;" bordercolorlight="#ffffff" bordercolordark="#e7e0c9" align="center" background=" //www.eyehome.net/create/back/back_new/1127317213.jpg " border="0" cellpadding="0" cellspacing="0" width="100%"><tbody><tr><td><table style="background: ;";cellpadding="0" cellspacing="0" align="center"><tr><td><table style="background: ;";cellpadding="0" cellspacing="0" align="center"><tr><td><center>

<table border="0" width="100%" cellspacing="0" cellpadding="0"
align="center">
<tr>
<td width="733" height="300"
<img border="0" src=" //i138.photobucket.com/albums/q248/poypk/blog/picH.gif " </tr></table>



ทดสอบตรงนี้ค่ะ






 

Create Date : 27 พฤษภาคม 2551    
Last Update : 27 พฤษภาคม 2551 19:13:09 น.
Counter : 2092 Pageviews.  
Share

สร้างกรอบรูปสวยๆ ด้วยตัวคุณเอง

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


<p align="right"><script type="text/javascript"><!--
google_ad_client = "pub-0880248511089906";
google_ad_width = 468;
google_ad_height = 60;
google_ad_format = "468x60_as";
google_ad_type = "text";
google_color_border = "fafafa";
google_color_bg = "fafafa";
google_color_link = "ff9b2a";
google_color_text = "000000";
google_color_url = "ff9b2a";
//--></script>
<script type="text/javascript" src="//pagead2.googlesyndication.com/pagead/show_ads.js"></script>
<br />
<iframe height="810" scrolling="no" width="460" frameBorder="0" src="//www.criticallayouts.com/Generators/photoborder-pic/loader.html"></iframe></p>





 

Create Date : 25 พฤษภาคม 2551    
Last Update : 25 พฤษภาคม 2551 22:33:13 น.
Counter : 1565 Pageviews.  
Share

1  2  

ผู้หญิงขี้รำคาญ
Location :


[Profile ทั้งหมด]

ฝากข้อความหลังไมค์
Rss Feed
Smember
ผู้ติดตามบล็อก : 2 คน [?]

Group Blog
 
All Blogs
 
Friends' blogs
[Add ผู้หญิงขี้รำคาญ's blog to your web]
Links
 

MY VIP Friend
 Pantip.com | PantipMarket.com | Pantown.com | © 2004 BlogGang.com allrights reserved.