All Code+Icon รวมโค้ด+สีแต่งบล็อก


  ได้เก็บรวบรวม Code ที่ใช้ในการแต่งบล๊อกที่เราเคย 
ใช้เป็นประจำจากบล๊อกคุณป้าชมพร คุณกึ่งยิง ป้ามด บล๊อกคุณไหม และจากเพื่อนๆ 
ใน Bloggang แนะนำบ้าง แล้วเราก็เอามาปรับใช้ในบล๊อกของเรา
 ถ้าจะเป็นประโยชน์บ้างก็ยินดี ลิงค์ไปไว้ใช้ อย่าลืม!..ให้เครดิต จขบ.ดังกล่าวด้วยนะคะ 


ไอคอนน่ารัก

    

  

  

  

  

  

  

  

  







      

ไอค่อนจิ๋ว

12
     

13

       

14

    




      


         

  





โค้ดสีแต่งบล็อก
เครดิต..นำมาจาก Bloggang : zairill


ที่มาจากเว็บ https://xn--code-3jovd.plus.in.th/
Snow
#FFFAFA		GhostWhite
#F8F8FF		WhiteSmoke
#F5F5F5		Gainsboro
#DCDCDC
FloralWhite
#FFFAF0		OldLace
#FDF5E6		Linen
#FAF0E6		AntiqueWhite
#FAEBD7
PapayaWhip
#FFEFD5		BlanchedAlmond
#FFEBCD		Bisque
#FFFAF0		PeachPuff
#FFDAB9
NavajoWhite
#FFDEAD		Moccasin
#FFE4B5		Cornsilk
#FFF8DC		Ivory
#FFFFF0
LemonChiffon
#FFFACD		Seashell
#FFF5EE		Honeydew
#F0FFF0		MintCream
#F5FFFA
Azure
#F0FFFF		AliceBlue
#F0F8FF		lavender
#E6E6FA		Lavender Blush
#FFF0F5
MistyRose
#FFE4E1		White
#FFFFFF		Black
#000000		DarkSlateGray
#2F4F4F
LightSlateGray
#778899		Gray
#BEBEBE		LightGray
#D3D3D3		MidnightBlue
#191970
CornflowerBlue
#6495ED		DarkSlateBlue
#483D8B		SlateBlue
#6A5ACD		MediumSlateBlue
#7B68EE
LightSlateBlue
#8470FF		NavyBlue
#000080		DimGrey
#696969		SlateGrey
#708090
MediumBlue
#0000CD		RoyalBlue
#4169E1		Blue
#0000FF		DodgerBlue
1E90FF
DeepSkyBlue
#00BFFF		SkyBlue
#87CEEB		LightSkyBlue
#87CEFA		SteelBlue
#4682B4
LightSteelBlue
#B0C4DE		LightBlue
#ADD8E6		PowderBlue
#B0E0E6		PaleTurquoise
#AFEEEE
DarkTurquoise
#00CED1		MediumTurquoise
#48D1CC		Turquoise
#40E0D0		Cyan
#00FFFF
LightCyan
#E0FFFF		CadetBlue
#5F9EA0		MediumAquamarine
#66CDAA		Aquamarine
#7FFFD4
DarkGreen
#006400		DarkOliveGreen
#556B2F		DarkSeaGreen
#8FBC8F		SeaGreen
#2E8B57
MediumSeaGreen
#3CB371		LightSeaGreen
#20B2AA		PaleGreen
#98FB98		SpringGreen
#00FF7F
LawnGreen
#7CFC00		Green
#00FF00		Chartreuse
#7FFF00		MedSpringGreen
#00FA9A
GreenYellow
#ADFF2F		LimeGreen
#32CD32		YellowGreen
#9ACD32		ForestGreen
#228B22
OliveDrab
#6B8E23		DarkKhaki
#BDB76B		PaleGoldenrod
#EEE8AA		LtGoldenrodYello
#FAFAD2
LightYellow
#FFFFE0		Yellow
#FFFF00		Gold
#FFD700		LightGoldenrod
#EEDD82
Goldenrod
#DAA520		DarkGoldenrod
#B8860B		RosyBrown
#BC8F8F		IndianRed
#CD5C5C
SaddleBrown
#8B4513		Sienna
#A0522D		Peru
#CD853F		Burlywood
#DEB887
Beige
#F5F5DC		Wheat
#F5DEB3		SandyBrown
#F4A460		Tan
#D2B48C
Chocolate
#D2691E		Firebrick
#B22222		Brown
#A52A2A		DarkSalmon
#E9967A
Salmon
#FA8072		LightSalmon
#FFA07A		Orange
#FFA500		DarkOrange
#FF8C00
Coral
#FF7F50		LightCoral
#F08080		Tomato
#FF6347		OrangeRed
#FF4500
Red
#FF0000		HotPink
#FF69B4		DeepPink
#FF1493		Pink
#FFC0CB
MediumVioletRed
#C71585		VioletRed
#D02090		Magenta
#FF00FF		Violet
#EE82EE
Plum
#DDA0DD		LightPink
#FFB6C1		PaleVioletRed
#DB7093		Maroon
#B03060
Orchid
#DA70D6		MediumOrchid
#BA55D3		DarkOrchid
#9932CC		DarkViolet
#9400D3
BlueViolet
#8A2BE2		Purple
#A020F0		MediumPurple
#9370DB		Thistle
#D8BFD8
COLORCODES


#FFFFFF #FFCCFF #FF99FF #FF66FF #FF33FF #FF00FF

#CCFFFF #CCCCFF #CC99FF #CC66FF #CC33FF #CC00FF

#99FFFF #99CCFF #9999FF #9966FF #9933FF #9900FF

#66FFFF #66CCFF #6699FF #6666FF #6633FF #6600FF

#33FFFF #33CCFF #3399FF #3366FF #3333FF #3300FF

#00FFFF #00CCFF #0099FF #0066FF #0033FF #0000FF

#FFFFCC #FFCCCC #FF99CC #FF66CC #FF33CC #FF00CC

#CCFFCC #CCCCCC #CC99CC #CC66CC #CC33CC #CC00CC

#99FFCC #99CCCC #9999CC #9966CC #9933CC #9900CC

#66FFCC #66CCCC #6699CC #6666CC #6633CC #6600CC

#33FFCC #33CCCC #3399CC #3366CC #3333CC #3300CC

#00FFCC #00CCCC #0099CC #0066CC #0033CC #0000CC

#FFFF99 #FFCC99 #FF9999 #FF6699 #FF3399 #FF0099

#CCFF99 #CCCC99 #CC9999 #CC6699 #CC3399 #CC0099

#99FF99 #99CC99 #999999 #996699 #993399 #990099

#66FF99 #66CC99 #669999 #666699 #663399 #660099

#33FF99 #33CC99 #339999 #336699 #333399 #330099

#00FF99 #00CC99 #009999 #006699 #003399 #000099

#FFFF66 #FFCC66 #FF9966 #FF6666 #FF3366 #FF0066

#CCFF66 #CCCC66 #CC9966 #CC6666 #CC3366 #CC0066

#99FF66 #99CC66 #999966 #996666 #993366 #990066

#66FF66 #669966 #666666 #996666 #663366 #660066

#33FF66 #33CC66 #339966 #336666 #333366 #330066

#00FF66 #00CC66 #009966 #006666 #003366 #000066

#FFFF66 #FFCC66 #FF9933 #FF6633 #FF3333 #FF0033

#CCFF33 #CCCC33 #CC9933 #CC6633 #CC3333 #CC0033

#99FF33 #99CC33 #999933 #996633 #993333 #990033

#66FF33 #66CC33 #669933 #666633 #663333 #660033

#33FF33 #33CC33 #339933 #336633 #333333 #330033

#00FF33 #00CC33 #009933 #006633 #003333 #000033

#FFFF00 #FFCC00 #FF9900 #FF6600 #FF3300 #FF0000

#CCFF00 #CCCC00 #CC9900 #CC6600 #CC3300 #CC0000

#99FF00 #99CC00 #999900 #996600 #993300 #990000

#66FF00 #66CC00 #669900 #666600 #663300 #660000

#33FF00 #33CC00 #339900 #336600 #333300 #330000

#00FF00 #00CC00 #009900 #006600 #003300 #000000

COLORNAMES


AliceBlueAntiqueWhiteAqua
AquamarineAzureBeige
BisqueBlackBlanchedAlmond
BlueBlueVioletBrown
BurlyWoodCadetBlueChartreuse
ChocolateCoralCornflowerBlue
CornsilkCrimsonCyan
DarkBlueDarkCyanDarkGoldenRod
DarkGrayDarkGreenDarkKhaki
DarkMagentaDarkOliveGreenDarkorange
DarkOrchidDarkRedDarkSalmon
DarkSeaGreenDarkSlateBlueDarkSlateGray
DarkTurquoiseDarkVioletDeepPink
DeepSkyBlueDimGrayDodgerBlue
FeldsparFireBrickFloralWhite
ForestGreenFuchsiaGainsboro
GhostWhiteGoldGoldenRod
GrayGreenGreenYellow
HoneyDewHotPinkIndianRed
IndigoIvoryKhaki
LavenderLavenderBlushLawnGreen
LemonChiffonLightBlueLightCoral
LightCyanLightGoldenRodYellowLightGrey
LightGreenLightPinkLightSalmon
LightSeaGreenLightSkyBlueLightSlateBlue
LightSlateGrayLightSteelBlueLightYellow
LimeLimeGreenLinen
MagentaMaroonMediumAquaMarine
MediumBlueMediumOrchidMediumPurple
MediumSeaGreenMediumSlateBlueMediumSpringGreen
MediumTurquoiseMediumVioletRedMidnightBlue
MintCreamMistyRoseMoccasin
NavajoWhiteNavyOldLace
OliveOliveDrabOrange
OrangeRedOrchidPaleGoldenRod
PaleGreenPaleTurquoisePaleVioletRed
PapayaWhipPeachPuffPeru
PinkPlumPowderBlue
PurpleRedRosyBrown
RoyalBlueSaddleBrownSalmon
SeaGreenSeaShellSienna
SilverSkyBlueSlateBlue
SlateGraySnowSpringGreen
SteelBlueTanTeal
ThistleTomatoTurquoise
VioletVioletRedWheat
WhiteWhiteSmokeYellow

 Line น่ารักๆ

 














 

โค๊ด HTML กำหนด ขนาดของตัวอักษร


font size=6


font size=5

font size=4

font size=3

font size=2

font size=1



  เพื่อสะดวกกับการนำไปใช้จะต้องปรับปรุงแก้ไขเสมอๆ
ปล.ก่อนนำโค๊ดไปใช้ ต้องลบ จุด* ออกทุกจุดก่อนค่ะ



fieldset box 

คือกรอบที่เห็นใส่ code อยู่นี้ สามารถเปลี่ยนค่า
ได้ตามใจชอบ
เช่น-font color
- สีของกรอบ
ขนาดความ width="200"
ความสูง height="60"
หรือ - bgcolor สีของแบบกกราว
-ความหนาของกรอบ 2px
-ชนิดของกรอบ dotted, dashed, solid, groove, ridge,
inset, outset, double






fieldset box มีหลายแบบ เรียงลำดับตามความง่าย 


1 Code กล่อง

<*fieldset>ใส่รายละเอียดที่นี่<*/fieldset>




2 แบบ Title 

Title<*legend><*/legend>Title<*/fieldset>ใส่รายละเอียดที่นี่<*/fieldset>

3 ใส่กรอบสีแดง 
Codeใส่กรอบสีแดง

<*fieldset style="border:1px solid #A0522D; padding:24;">
<*legend align="left"><*font color="#A0522D">
Title Codeใส่กรอบสีแดง<*/font>
<*/legend><*font color="#0000cc">
<*p align="center"> <*font color=green>
ใส่รายละเอียดที่นี่<*/font>
<*/p><*/font><*/fieldset>




4 ขยายได้ตามข้อความ


<*center><*table style="border: 1px solid
#FF0000;"cellpadding="5" cellspacing="10"><*tr>
<*td><*center>

ใส่รายละเอียดที่
<*/center><*/td><*/tr><*/table><*/center>




ใส่รายละเอียดที่




5 กรอบเส้นคู่



.ใส่ข้อความ




.
<*TABLE width="200" bgcolor="#FFF0cc"><*tr>
<*td align="center" height="60" style="border-
color:#688E23; border-width:6px; border-style:double;">
<*FONT color="#688E23" size="3">
.ใส่ข้อความ <*/FONT><*/td><*/tr><*/TABLE>




*ถ้าเราต้องการใส่กรอบให้รูป เราลบสีข้อความออก
<*FONT color="#FFB6C1 " size="3">ใส่ข้อความ<*/FONT>
ออกไป

นอกจากกรอบเส้นคู่ border-style:double แล้ว
เราสามารถเลือกกรอบต่อไปนี้ได้อีก
-ชนิดของกรอบ dotted, dashed, solid, groove, ridge,
inset, outset, double

//////////













การใส่แบกกราวBGในบล๊อก 


การใส่ BG.มีหลายแบบมีโค๊ดเฉพาะแบบนั้นเช่น
-ใส่แบบมีรูป
แบบมีรูปอยู่กับที่หรือแบบเคลื่อนที่
-ใส่รูป อยู่มุมซ้าย หรือตรงกลาง หรือมุมขวา จะให้อยู่มุมบน
หรือมุมล่างก็ได้
-ใส่แบบสีๆ

วิธีนำไปวางได้สองวิธี
-วิธีแรกนำไปวางที่ Script area วิธีนี้มีผลทุกบล๊อก
ถ้าไม่ต้องการให้มีผลทุกบล๊อกต้องลบออก
-วธีที่สองใส่ที่ช่องรายละเอียดพร้อมกับการเขียนบล๊อกใหม่
มีผลเฉพาะบล๊อกนั้นบล๊อกเดียว
ถ้าเขียนบล๊อกใหม่ก็เปลี่ยนแบกกราวใหม่


การใส่รูปเป็น BG ในบล๊อค ตามที่เราต้องการ
เช่นใส่ตรงกลาง,ใส่บน,บนซ้าย,บนขวา,
หรือใส่มุมล่าง,ล่างซ้าย,ล่างขวาเป็นต้น

ใส่สี แบบ Code สี #FFB6C1
และแบบชื่อของสีเช่น red,green ป็นต้น

color="#FFB6C1"size="3"
color="red"size="3"

ส่วนขนาด size="3" เป็นขนาดของ font ที่เราจะให้
ตัวหนังสือเล็กหรือใหญ่


left bottom ส่วนที่กำหนดมุมในการวางรูป

top - แถวบน

left top - :ซ้ายบน

right top - ขวาบน



center bottom - กลางล่าง

right bottom - ขวาล่าง

right bottom - ซ้ายล่าง



center - แถวกลาง

bottom - แถวล่าง

right - มุมขวา

left - มุมซ้าย



1ใส่แบบธรรมดา

Codeธรรมดา

 <*style>body{background-image:url("http// XXX");}
<*/style>




2.ใส่ bg แบบ fixed 

Codeแบบ fixed

 <*style>body{background-attachment:fixed;background-image:url("http// XXX");}<*/style>




3 bg แบบเลื่อนตามสกอบาร์ 

Codeเลื่อนลงตาม scroll bar

 <*style>body{background-attachment: none;background-
image:url("http// XXX");}<*/style>




4.ใส่ bg ภาพเดียวทั้งหน้า+สี attachment



ใส่ bg ภาพเดียวทั้งหน้า+สี

 <*style>Body{background-image:url(https://i256.photobucket.com/albums/hh172/sundakib27/
105_mansank.jpg);background-position:bottom left;
background-repeat:no-repeat;background-attachment:
fixed;background-color:#CCFFFF;}<*/style>



5 ใส่บีจี แบบมุมposition ไม่เลื่อน

Code .BG มุมใดมุมหนึ่ง

 <*style>Body{background-image:url(https://i256.photobucket.com/albums/hh172/sundakib27/
105_mansank.jpg);background-position:bottom left;
background-repeat:no-repeat;background-attachment:
fixed;background-color:#CCFFFF;}<*/style>



Left bottom เราสามารถเปลี่ยนได้ จะเปลี่ยนเป็น ::
right top / left top / center / right bottom /left bottom 


6.ใส่ bg โดยใช้สีอย่างเดียว

Code bg สี

 <*style>body{background-color:#8B0000;}
<*/style>

7 code ที่ทำให้ background+สี เคลื่อนตามเม้าท์

Code bgสีเคลื่อนตามเม้า

 <*style type="text/css"><*!--body{background:url(/////) repeat fixed center top;background-color:#EFE7E5;}--><*/style>


///////


8 code ใส่ BG โดยไล่เฉดสี (gradient) 

BG ไล่เฉดสี

<*body style="filter:progid:DXImageTransform.Microsoft.Gradient
(endColorstr='#///สีที่ 1///',startColorstr='#///สีที่ 2///',
gradienttype=0);">


gradienttype 0 ไล่สีตามแนวนอน
gradienttype 1 ไล่สีตามแนวตั้ง



9 Codeลบกรอบขาว


Code ลบกรอบขาว

 <*style>table {background-color: transparent;border-style: none;border-spacing: none;}TD {border:none;border-color: none;background: none;}<*/style>




Code ที่เกี่ยวข้อง

1 Code mouse hi5,Blog,myspaces,diary

มี 2 แบบ

Code cursor
1.<*style>body{cursor:url("////////");}<*/style>

 2.
<*style type="text/css">body {cursor: url(//////////); }
<*/style>





2 Code โลโก หรือHead blog

Codeโลโก

 <*p align=center><*img src="ใส่ภาพ/"><*/p>

 ใส่โลโก วางที่ช่องสโลแกน ให้อยู่ ซ้าย ขวา ก็เปลี่ยน ที่center


เข้าไปที่ปรับแต่งบล๊อก เลือกใส่ช่อง
ตั้งชื่อ Slogan ของ Blog

โค๊ด <*p align=center><*img src="ใส่ภาพHead blog/"><*/p>

ก่อนนำไปวางลบจุด ดอกจัน * ออกก่อน




3.ใส่รูปเรียงแบบมีสกอร์

Codeใส่รูปเรียง

 <*DIV align=left style=' color: #666600; background-color: #666600; border: solid 2px black; width:300px; height:400px; overflow: scroll; '>
1-------
2-------
<*/DIV>


Code ใส่รูป หรือข้อความ เช่น Code นาฬิกา

<*DIV align=left style='color:#663300; background-color: #FFFFFF; border: solid 1px black;width:300px;height:80px;overflow:scroll;'>
///ใส่ข้อความ ///
<*/DIV>



     




4.ใส่กรอบให้รูปเล็กเรียง

Codeใส่รูปเล็กเรียง

 <*table border="0"align="center"><*tbody><*tr>
<*td align="center" valign="middle" style="border:1px solid #BC8F8F "><*img src="//////"border="0"/><*/td>
<*td align="center"valign="middle"style="border:1px solid #BC8F8F ">

 <*img src="///////"border="0"/><*/td><*td align="center"valign="middle" style="border: 1px solid#BC8F8F ">

 <*img src="////////"border="0"/><*/td><*td align="center"valign="middle" style="border: 1px solid#BC8F8F">

 <*img src="////////"border="0"/><*/td><*td align="center"valign="middle" style="border: 1px solid#BC8F8F ">

 <*img src="/////"border="0"/><*/td><*/tr><*/tbody><*/table>

 เอารูปมาใส่ในช่อง"////////" และเอาจุด*ออกก่อน
เลื่อนทุก<*img src="////////".....ให้ติดกันก่อนให้เรียงเป็นแถว
แล้วนำไปวางในช่องรายละเอียด .ดังตัวอย่าง.






5 ใส่รูปให้ TOP 

Codeใส่รูปTOP

 <*center><*a href="#top"><*img src=https://www.bloggang.com/data/c/chomporn/picture/1295892909.gif><*/a><*/center>





6.สกอบาร์ อยากใส่สีอะไรที่โค๊ดสี# มี 2 แบบ

Codeใส่สกอบาร์
<*STYLE type="text/css"><*!-- BODY { scrollbar-face-color:WHITE; scrollbar-arrow-color:#e36b7d; scrollbar-highlight-color:#e36b7d; scrollbar-3dlight-color:WHITE; scrollbar-shadow-color:WHITE;scrollbar-darkshadow-color:#e36b7d; } --><*/STYLE>
<*style type="text/css"><*!--html, body { scrollbar-base-color:#F0DF39;scrollbar-arrow-olor:#F0DF39;}--><*/style>




7 ทำข้อความมีสีเหลือบ




 <*div style="filter:shadow(color=#ccffcc direction=800); position:relative;width:100%;"><*font color="#006600">สีที่นำไปใช้กับข้อความเหลือบ<*/font>
<*/div>

สีที่นำไปใช้กับข้อความเหลือบ




8ใส่ข้อความ,ใส่โค๊ดสี หรือใส่รูปวิ่ง

Codeใส่รูปวิ่ง

 <*marquee width="600"scrollamount="3"scrolldelay="80"><*font color="#F5F5DC" style="font-size:24px">**ใส่ข้อความที่เราต้องการ ใส่ข้อความที่เราต้องการ **<*/font><*/marquee>

 **ใส่ข้อความที่เราต้องการ ใส่ข้อความที่เราต้องการ **




9 border แบบต่างๆ 

Border แบบต่างๆ
style:solid , style: double, style:dashed style: ridge ,style: groove


border แบบต่างๆ

กรอบ solid
กรอบdouble

กรอบdashed
กรอบdotted

กรอบridge
กรอบ inset
กรอบoutset
กรอบgroove
lozocat





10. Bullet คือรูปจุดกลมๆที่แสดงอยู่หน้าGroupblog

Code Bullet
Code
<*style>ul{list-style: ;list-style-image: url(http:ของ รูป bullet);}<*/style>



11. ใส่สี+ใส่รูป หน้าชื่อ group blog

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


ใส่รูปเข้าไปข้างหน้า ใช้คำสั่งนี้ได้เลย
<*img src=URLของรูป border=0>

ใส่ สีอะไร ก็ใส่คำสั่งสีเข้าไปข้างหน้าข้อความ
<*font color="#ff69b4"size="3">ใส่ข้อความ<*/font>




12. เปลี่ยนรูปอมยิ้ม (log in) ท้ายชื่อ

Code อมยิ้ม
ข้อนี้ไปเอามาจากบล็อกของคุณ ชาเขียว หารูปที่ต้องการมาแทนอมยิ้มอันเก่า แล้วใส่ url ของรูปเข้าไป

 Code

 <*script>iLength = document.images.length; for(i=0;i<*iLength;i++) if(document.images
[i].src=="https://www.bloggang.com/images/smile.gif") {document.images[i].src="https://ของรูปที่ต้องการ"}<*/script>

 copy code ไปใส่ในช่อง script




13. Code Wrist Band เรารักในหลวง

Code Wrist Band

 script ของ wrist band เพื่อนๆส่งมาให้ป้ามดจาก https://thaiblogger.org

 Code มุมซ้าย
<*script type="text/javascript" src="https://thaiblogger.org/webbands/weloveourking_left.js"><*/script>

 Code มุมขวา
<*script type="text/javascript" src="https://thaiblogger.org/webbands/weloveourking_right.js"><*/script>

 นำโค้ดใส่ที่ช่อง script เป็นรูป wristband เรารักในหลวงคาดที่หัวมุมบล็อกด้านบน ให้เลือกซ้าย และขวา


*******


โค้ดใส่กรอบ+รูปให้กล่องเม้นท์







<*style>textarea{width: 300; height: 200; background: url(URL ของรูปที่ต้องการ);
color: โค้ดสีเวลาพิมพ์ข้อความ; font-family: MS Sans Serif; font-size: 15pt;
border: double 5px โค้ดสีกรอบที่ต้องการ;} input{background: โค้ดสีพื้นหลังตรงที่จะพิมพ์ชื่อ; color: โค้ดสีเวลาพิมพ์ชื่อ; border: double 2px โค้ดสีกรอบตรงที่จะพิมพ์ชื่อ;}
<*/style>





โค้ด ให้ข้อความหรือรูปภาพ ที่คอมเม้นท์ อยู่ตรงกลาง


<*style>div.comment{text-align: center;}<*/style>


******



14. สร้าง link


Code Link

 <*a href =URLของเว็บที่ต้องการ///// target=_blank><*img src=URL///ของรูปที่ทำลิงค์//// link border=0<*/a>

 สร้างรูปให้ link โดยใส่คำสั่งรูปต่อท้ายเข้าไป



15. สร้างรูป-อักษร เคลื่อนที่

Code 1


Code วิ่งๆๆ
ใส่รูปหรือข้อความให้เคลื่อนที่ (Marquee)
การเคลื่อนที่มีหลายแบบ
เปลี่ยนทิศทางการเคลื่อนที่ ที่ direction
และเปลี่ยนความเร็วที่ scrollamount

<*marquee>ใส่ข้อความวิ่งตรงนี้<*/marquee>



Code 2

***

Code วิ่งๆๆ


 <*marquee direction=right scrollamount=1>
ใส่ข้อความตรงนี้ <*/marquee>
ใส่ข้อความตรงนี้


Code 3

Code วิ่งๆๆ

 <*marquee><*img src=ใส่รูป><*/marquee>


Code 4

Code วิ่งๆ

 <*marquee direction=right scrollamount=1>
<*img src=ใสรูป><*/marquee>


Code Code ใส่ข้อความหรือรูปวิ่งๆ5

Codeวิ่งๆๆ

 <*marquee direction=right scrollamount=2>
<*img src="https://images.antifluff.com/download.php?file=q25gm4ny2yj1tymuyqiw.gif"> ยินดีต้อนรับทุกท่าน<*/marquee>
ยินดีต้อนรับทุกท่าน


Code 6



Codeวิ่งๆ
<*marquee direction=up style="filter:wave(add=0,lightstrength=75, phase=1, strength=1,freq=2);color:#4682B4"><*center>
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่<*/marquee>


ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่





**********
Code 7

Codeใส่สองอย่างวิ่งๆๆ

 <*marquee width=350 height=250 direction=up scrollamount=1><*center>ใส่ข้อความ และรูปที่นี<*/center><*/marquee>

ใส่ข้อความและรูปที่นี
*scrollamount=1 มีระดับความเร็วตามตัวเลข 1.2.3.4.ฯ
วิ่งช้าสุดคือ1 น้อย ค้อยเร็วขี้นๆ ตามตัวเลข 2-3-4 ที่เพิ่มขึ้น



17. วิธีคัดลอกรูปจากที่อื่นมาใส่อัลบั้มหรือไว้ใช้

Codeคัดลอกรูป


1.) การนำ URL รูปมาทำเป็น background มาใส่ในช่อง background image URL

1.1 จะไปหา URL ได้จากไหน ง่ายๆ ถ้าเพื่อนๆ เล่นอินเตอร์เน็ตแล้วไปเจอรูปที่ถูกใจ ก็คลิกขวาที่ที่รูปนั้น แล้วเลือก Properties
แล้วก๊อปปี้ URL ใน Properties ก่อนออกคลิกที่ save ก่อน
นำมาใส่ที่โค๊ด

<*img src="//////////">
1.2 จากนั้น Copy URL ค่ะ
<*img src="https://hi5.kapook.com/images_bg/images_05.jpg">

1.3 เมื่อได้ URL แล้วก็นำมามาที่ Background Image URL เท่านี้ก็เสร็จแล้วค่ะ



18.โค๊ดรูปกล่องคอมเม้น:-ดังนี้ 

แล้วนำไปวางที่ Script area

Codeใส่กล่องคอมเม้น

<*style type=text/css>textarea{width:413;height:376;background:url
("////URLของรูป/////");color=blue;font-family:KodchiangUPC; font-size:17pt;}<*/style>




19. Code กรอบที่นำมาจากคุณParadijs

โค๊ดที่เรายังไม่มี และนำมาจากบล๊อกคุณไหม

1



กรอบใส่รูป


<*table border="0"cellspacing="2" cellpadding="2" width="" align="center"style="border: 1px ridge#A0522D"><*tbody><*tr><*td align="center" valign="middle" style="border:1px ridge #FFA6D1"><*img src=" ////////"border="0"><*/td><*/tr><*/tbody><*/table>


2



เพื่อป้องกันหน้าบล็อคยืด จากการที่เพื่อนๆ
ใส่รูป ใน Comment ใหญ่เกินไป
ใส่โค้ดนี้ ไว้ที่ Script Area ค่ะ

<*style>div.comment{overflow: auto; width: 380px; height: auto;}<*/style>



3.โค้ดทำกรอบให้กับ Group Blog, All Blogs, Friends' blogs, Links, และ Emotions




<*style>li a {display: block;padding: 5px 5px 5px
5px;border: 1px ใส่ชนิดของกรอบ ใส่โค้ดสีกรอบ;background-
image:url(ใส่ URLรูป);text-decoration: none;width:
180px;}<*/style>

<*style>li a:hover {display: block;padding: 5px 5px 5px
5px;border: 1px ใส่ชนิดของกรอบ ใส่โค้ดสีกรอบ;background-
image:url(ใส่ URLรูป);text-decoration: none;width: 180px;}
<*/style>

<*style>fieldset{border: 3px ใส่ชนิดของกรอบ;padding:
5px 5px 5px 5px;border-color : ใส่โค้ดสีกรอบ;}<*/style>
<*tr><*td><*/tr><*/table>




20.กรอบรอบนอกของบล๊อก 








<*script language="JavaScript1.2">
if (document.all)
document.body.style.cssText="border:15 inset green"
<*/script>


นำไปใส่ที่Script area


////////////////ต่อจากตอนที่ 1////////////////


21.นำโค๊ดมาให้ทดลองทำ




กรอบตัวอย่างสามารถทำเองได้


Code กรอบทำเอง



Code กรอบทำเอง


 <*table border="2"cellspacing="16"cellpadding="10"width="100%"align="center"style="background-image: url('///๑////')"><*tbody><*tr><*td align="center"valign="middle"style="background-image: url('//////๒////')"><*table border="1"cellspacing="5"cellpadding="5"width="100%"align="center"style="background-image:url('////๓//////')"><*tbody><*tr><*td align="center"valign="middle">

 ใส่ข้อความ

 <*/td><*/tr><*/tbody><*/table><*/td><*/tr><*/tbody><*/table><*/font>

รูปที่นำมาใส่ มี ๓ รูป

รูปที่('///๑////') - รูปกรอบเช่นรูปวิบๆ แบบ gif
'https://6.share.photo.xuite.net/lam1112/1699a0d/4212433/168698940_x.jpg'

รูปที่('//////๒////') - รูปเช่นรูปเพชร
'https://g.udn.com.tw/community/img/PSN_PHOTO/winnie777777/f_4817975_1.gif'

รูปที่('////๓//////') - รูปสีพื้นเป็นแบกกราว
'https://www.colourlovers.com/img/DEFFB3/228/161/Minty.png'




22.วิธีลดขนาดรูป gif


ลดขนาดรูป


 ใส่ขนาดตัวเลขที่ต้องการเพื่อลดขนาดรูป
โดยกำหนดขนาดลดลงตามสัดส่วนของรูป


<*center><*img src=http:XXX width=400 height=300><*/center>





23.Codeป้องกันไม่ให้มีกรอบสีน้ำเงินที่รูป



ป้องกันกรอบสีน้ำเงิน

<*style>img {border:none;}<*/style>

โค้ดนี้จะมีผลกับทุกๆรูป 


ต่อไปเมื่อเราใส่โค้ด หริอใส่รูป
ก็ไม่ต้อง ใส่ border=0 อีกต่อไป

ใช้แค่ <*img src=//////////.> 



24.โค้ด ที่ทำให้ข้อความหรือรูปภาพ ที่เพื่อนๆคอมเม้นท์ ให้อยู่ตรงกลาง
<*style>div.comment{text-align: center;}<*/style>


นำไปวางที่ Script area





25.โค๊ดใส่ข้อความพร้อมรูป 1-9 จากบล๊อกคุณพีช



1 .โค้ดใส่ข้อความกำกับภาพ


โค้ด.... <*img src="http:รูป" alt="...ข้อความ..."/>




2. โค๊ดด้านซ้ายของรูป


<*img src="http:รูปภาพ" align=right hspace=10>
ข้อความ
<*br clear=right>





3.ใส่ข้อความกำกับด้านซ้ายบรรทัดบนของรูปภาพ


<*img src="http:รูปภาพ" align="top"> ข้อความที่ต้องการ





4.ใส่ข้อความด้านขวาของรูป


<*img src="http: รูปภาพ" align=left hspace="10" vspace="10"/> ใส่ข้อความ <*br clear=left>





5. ภาพอยู่ด้านขวา และมีรูปอยู่ใต้ข้อความภาพด้านซ้าย


โค้ด...... <*img src="https://xxxxxxx" align=right hspace=10> 


ใส่ข้อความ


<*img src='https://xxxxxxx'> <*br clear=right> 





6.ภาพด้ายซ้ายหนึ่งรูป และด้านขวาสองรูป โดยมีข้อความระหว่างกลาง


<*src="https://xxxxxxx" align=left hspace=10>
<*img src='https://xxxxxxx'>


ใส่ข้อความ


<*img src='https://xxxxxxx'> <*br clear=left> 





7.โค้ดใส่ข้อความกำกับทางด้านขวาบรรทัดล่างของรูป


<*img src="http:รูปภาพ" align="bottom"> 


<*img src='https://xxxxxxx'> <*br clear=right> 




8. ใส่ข้อความด้านขวา


<*img src="http:รูปภาพ" align="left"> ข้อความ <*br clear="left"> 





9 .ใส่ข้อความทางด้านซ้ายของรูป


โค้ด....... <*img src="http:รูปภาพ" align=right>





ใส่ไว้ที่ต่างๆ


Left= จัดภาพไว้ด้านซ้ายของตัวหนังสือ(ตัวหนังสืออยู่ขวา)


Right= จัดภาพไว้ด้านขวาของตัวหนังสือ(ตัวหนังสืออยู่ซ้าย)


Top = ตัวหนังสืออยู่บรรทัดบนของภาพ


Middle= ตัวหนังสืออยู่บรรทัดกลางของภาพ


Bottom = ตัวหนังสืออยู่บรรทัดล่างของภาพ


hspace สำหรับระยะห่างแนวนอน และ vspace สำหรับระยะห่างแนวตั้ง 








ขอแสดงความยินดี
กับเพื่อนด้วยค่ะ


Code
<*TABLE width="250" bgcolor="#FFF0cc"><*tr>
<*td align="center" height="60" style="border-
color:#688E23; border-width:6px; border-style:double;">
<*FONT color="#688E23" size="3">
<*img src="https://i123.photobucket.com/albums/o301/
myicon-2007/mcom141.gif"align= left hspace=10>
ขอแสดงความยินดีกับเพื่อนด้วยค่ะ
<*br clear=right>
<*/FONT><*/td><*/tr><*/TABLE>

<*TABLE width="250" bgcolor="#FFF0cc"><*tr>
<*td align="center" height="60" style="border-
color:#688E23; border-width:6px; border-style:double;">
<*FONT color="#688E23" size="3">
<*img src="https://i123.photobucket.com/albums/o301/
myicon-2007/mcom141.gif"align="center">
ขอแสดงความยินดี
กับเพื่อนด้วยค่ะ
<*br clear=right>
<*/FONT><*/td><*/tr><*/TABLE>


26.วิธีเปลี่ยน Title ของ Bloggang



<*script>window.document.title="ใส่ข้อความที่ Title ของ Bloggang
ตามใจชอบ.";<*/script>

นำไปวางที่ Script area




27.โค้ด Blockquote






 จัดข้อความยาวๆให้สวยงาม 
อ่านได้ง่ายๆโดยจัด
ระยะเว้นวรรคหน้าหลังให้เท่าๆกัน



<*blockquote>ใส่รายละเอียดที่นี่<*/blockquote>




28.Code เปลี่ยนสี font ของ link




<*style>A:hover{color:#F5F5DC;text-decoration: none;position: relative;left: 4px; top:4;}A:link{color:#20B2AA;text-decoration:none;}A:visited{color: #CD5C5C;text-decoration:none;<*/style> 


โค้ดสีแต่งบล็อก

เครดิต..นำมาจาก Bloggang : zairill



   ที่มาจากเว็บสี       https://xn--code-3jovd.plus.in.th/
#FFFFFF#FFFFCC#FFFF99#FFFF66#FFFF33#FFFF00
#FFCCFF#FFCCCC#FFCC99#FFCC66#FFCC33#FFCC00
#FF99FF#FF99CC#FF9999#FF9966#FF9933#FF9900
#FF66FF#FF66CC#FF6699#FF6666#FF6633#FF6600
#FF33FF#FF33CC#FF3399#FF3366#FF3333#FF3300
#FF00FF#FF00CC#FF0099#FF0066#FF0033#FF0000
#CCFFFF#CCFFCC#CCFF99#CCFF66#CCFF33#CCFF00
#CCCCFF#CCCCCC#CCCC99#CCCC66#CCCC33#CCCC00
#CC99FF#CC99CC#CC9999#CC9966#CC9933#CC9900
#CC66FF#CC66CC#CC6699#CC6666#CC6633#CC6600
#CC33FF#CC33CC#CC3399#CC3366#CC3333#CC3300
#CC00FF#CC00CC#CC0099#CC0066#CC0033#CC0000
#99FFFF#99FFCC#99FF99#99FF66#99FF33#99FF00
#99CCFF#99CCCC#99CC99#99CC66#99CC33#99CC00
#9999FF#9999CC#999999#999966#999933#999900
#9966FF#9966CC#996699#996666#996633#996600
#9933FF#9933CC#993399#993366#993333#993300
#9900FF#9900CC#990099#990066#990033#990000
#66FFFF#66FFCC#66FF99#66FF66#66FF33#66FF00
#66CCFF#66CCCC#66CC99#66CC66#66CC33#66CC00
#6699FF#6699CC#669999#669966#669933#669900
#6666FF#6666CC#666699#666666#666633#666600
#6633FF#6633CC#663399#663366#663333#663300
#6600FF#6600CC#660099#660066#660033#660000
#33FFFF#33FFCC#33FF99#33FF66#33FF33#33FF00
#33CCFF#33CCCC#33CC99#33CC66#33CC33#33CC00
#3399FF#3399CC#339999#339966#339933#339900
#3366FF#3366CC#336699#336666#336633#336600
#3333FF#3333CC#333399#333366#333333#333300
#3300FF#3300CC#330099#330066#330033#330000
#00FFFF#00FFCC#00FF99#00FF66#00FF33#00FF00
#00CCFF#00CCCC#00CC99#00CC66#00CC33#00CC00
#0099FF#0099CC#009999#009966#009933#009900
#0066FF#0066CC#006699#006666#006633#006600
#0033FF#0033CC#003399#003366#003333#003300
#0000FF#0000CC#000099#000066#000033#000000



ขอขอบคุณ เวปบล็อกจากคุณป้าชมพร  

และให้เครดิตกับที่มาแหล่งข้อมูล

โค๊ดจากคุณกึ่งยิง, ป้ามด ,คุณ Paradijs,คุณsomjadean100

ยินดีให้ลิงค์ไปที่บล๊อกของคุณ!

ไม่มีความคิดเห็น:

แสดงความคิดเห็น

สมัครสมาชิก: บทความ (Atom)

โพสต์เด่น

บทความนิยม