Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,037

HOME > บทความจากสมาชิก > เชิญชวนเว็บมาสเตอร์ติด ริปปิ้นดำ (ribbon) ตรง มุม บนซ้าย,บนขวา,ล่างซ้าย,ล่างขวา ของเว็บไซต์

เชิญชวนเว็บมาสเตอร์ติด ริปปิ้นดำ (ribbon) ตรง มุม บนซ้าย,บนขวา,ล่างซ้าย,ล่างขวา ของเว็บไซต์

เชิญชวนเว็บมาสเตอร์ติด ริปปิ้นดำ (ribbon) ตรง มุม บนซ้าย,บนขวา,ล่างซ้าย,ล่างขวา ของเว็บไซต์ เนื่องจากภายในปีนี้จะมีการ พิธีถวายพระเพลิงพระบรมศพ พระบาทสมเด็จพระปรมินทรมหาภูมิพลอดุลยเดช (ในหลวงรัชกาลที่ ๙) เชิญชวนทุกท่านติดริปปิ้นดำ (Black Ribbon) เพื่อร่วมไว้อาลัย น้อมส่งเสด็จ สู่สวรรคาลัย แอดมินเชิญชวน Webmaster ทุกท่านที่มีเว็บไซต์หรือดูแลเว็บไซต์ ร่วมกันติดริปปิ้นดำ เพื่อร่วมแสดงความไว้อาลัยตลอดทั้งปี ด้วยวิธีการง่าย ๆ โดยเลือกติดได้ 4 รูปแบบคือ มุม บนซ้าย,บนขวา,ล่างซ้าย,ล่างขวา ขึ้นว่าอยู่ Layout ที่เหมาะสมของเว็บไซต์

ribbon ริปปิ้นดำ

สำหรับรูปริปปิ้นดำ สามารถดาวน์โหลดได้จากท้ายของบทความ โดยมีอยู่ 4 รูปแบบคือ

มุมบนซ้าย
มุมบนขวา
มุมล่างซ้าย
มุมล่างขวา

โค้ด CSS และ HTML สำหรับการวาง

ริปปิ้นดำ มุมบนซ้าย

<style>
.ribbon_top_left {
	position: fixed;
	z-index: 100;
	left: 0;
	top: 0;
}
</style>
<!-- บนซ้าย -->
<img src="images/ribbon_top_left.png" class="ribbon_top_left">

ริปปิ้นดำ มุมบนขวา

<style>
.ribbon_top_right {
	position: fixed;
	z-index: 100;
	right: 0;
	top: 0;
}
</style>
<!-- บนขวา -->
<img src="images/ribbon_top_right.png" class="ribbon_top_right">

ริปปิ้นดำ มุมล่างซ้าย

<style>
.ribbon_bottom_left {
	position: fixed;
	z-index: 100;
	left: 0;
	bottom: 0;
}
</style>
<!-- ล่างซ้าย -->
<img src="images/ribbon_bottom_left.png" class="ribbon_bottom_left">

ริปปิ้นดำ มุมล่างขวา

<style>
.ribbon_bottom_right {
	position: fixed;
	z-index: 100;
	right: 0;
	bottom: 0;
}
</style>
<!-- ล่างขวา -->
<img src="images/ribbon_bottom_right.png" class="ribbon_bottom_right">

โดยเลือกให้เหมาะสมกับ Layout ของเว็บ เพื่อให้ดูเหมาะสมและสวยงาม

Code ทั้งหมด

<html>
<head>
  <title>Your Website Title</title>
</head>
<style>
.ribbon_top_left {
	position: fixed;
	z-index: 100;
	left: 0;
	top: 0;
}

.ribbon_top_right {
	position: fixed;
	z-index: 100;
	right: 0;
	top: 0;
}

.ribbon_bottom_left {
	position: fixed;
	z-index: 100;
	left: 0;
	bottom: 0;
}

.ribbon_bottom_right {
	position: fixed;
	z-index: 100;
	right: 0;
	bottom: 0;
}

</style>
<body>

<!-- บนซ้าย -->
<img src="images/ribbon_top_left.png" class="ribbon_top_left">

<!-- บนขวา -->
<img src="images/ribbon_top_right.png" class="ribbon_top_right">

<!-- ล่างซ้าย -->
<img src="images/ribbon_bottom_left.png" class="ribbon_bottom_left">

<!-- ล่างขวา -->
<img src="images/ribbon_bottom_right.png" class="ribbon_bottom_right">

</body>
</html>

Download!!

ริปปิ้นดำ (ribbon)

โดยอยากจะเชิญชวนให้ติดตลอดกันทั้งปี 2560 (2017) ซึ่งตอนนี้แอดมินไทยครีเอทก็ได้ทำการติดเรียบร้อยแล้วครับ

ริปปิ้นดำ (ribbon)

ThaiCreate!


	By :	TC Admin
	Article :	บทความเป็นการเขียนโดยสมาชิก หากมีปัญหาเรื่องลิขสิทธิ์ กรุณาแจ้งให้ทาง webmaster ทราบด้วยครับ
	Score Rating :
	Create Date :	2017-03-23
	Download :	No files

Sponsored Links

สอน Windows Phone การเขียนโปรแกรม Windows Phone 7 และ 8

สอน Java GUI การเขียนโปรแกรม ภาษา Java GUI

Free Tutorial

	สอน Google Maps Api
	สอน Windows Service
	สอน Entity Framework
	สอน Android
	สอน Java เขียน Java
	Java GUI Swing
	สอน JSP (Web App)
	iOS (iPhone,iPad)
	Windows Phone
	Windows Azure
	Windows Store
	Laravel Framework
	Yii PHP Framework
	สอน jQuery
	สอน jQuery กับ Ajax
	สอน PHP OOP (Vdo)
	Ajax Tutorials
	SQL Tutorials
	สอน SQL (Part 2)
	JavaScript Tutorial
	Javascript Tips
	VBScript Tutorial
	VBScript Validation
	Microsoft Access
	MySQL Tutorials
	-- Stored Procedure
	MariaDB Database
	SQL Server Tutorial
	SQL Server 2005
	SQL Server 2008
	SQL Server 2012
	-- Stored Procedure
	Oracle Database
	-- Stored Procedure
	SVN (Subversion)
	แนวทางการทำ SEO
	ปรับแต่งเว็บให้โหลดเร็ว