กดถูกใจ เป็นกำลังใจให้เรา 😍

VIR9.COM

ขอบคุณน๊าา 🥰

Close

  • แสดงข้อมูลใน iframe ตามตำแหน่งที่ต้องการด้วย css

    June 3, 2017
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>css iframe position</title>
<style type="text/css">
body{
	background-color:#FFF;	
}
/* ส่วนกำหนดสำหรับ แสดง iframe  */
div#myiframe_position1{
	position:relative;
	margin:auto;
	display:block;	
	width:270px; /*ความกว้างส่วนของเนื้อหา iframe ที่ต้องการแสดง*/
	height:700px; /* ความสูงส่วนของเนื้อหา iframe ที่ต้องการแสดง */
	overflow:hidden;
}
/* ส่วนกำหนด สำหรับ iframe */
div#myiframe_position1 iframe{
	position:absolute;
	display:block;
	float:left;
	margin-top:-420px; /* ปรับค่าของ iframe ให้ขยับขึ้นบนตามตำแหน่งที่ต้องการ */
	margin-left:-715px; /* ปรับค่าของ iframe ให้ขยับมาด้านซ้ายตามตำแหน่งที่ต้องการ */
}
</style>
</head>
<body>

<div id="myiframe_position1">
<iframe src="http://www.cymiz.com" scrolling="no"
frameborder="0" width="1000" height="1000"></iframe>
</div>
</body>
</html>

    ตัวอย่าง

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>css iframe position</title>
<style type="text/css">
body{
	background-color:#FFF;	
}
/* ส่วนกำหนดสำหรับ แสดง iframe  */
div#myiframe_position1{
	position:relative;
	margin:auto;
	display:block;	
	width:900px; /*ความกว้างส่วนของเนื้อหา iframe ที่ต้องการแสดง*/
	height:1150px; /* ความสูงส่วนของเนื้อหา iframe ที่ต้องการแสดง */
	overflow:hidden;
}
/* ส่วนกำหนด สำหรับ iframe */
div#myiframe_position1 iframe{
	position:absolute;
	display:block;
	float:left;
	margin-top:-140px; /* ปรับค่าของ iframe ให้ขยับขึ้นบนตามตำแหน่งที่ต้องการ */
	margin-left:-50px; /* ปรับค่าของ iframe ให้ขยับมาด้านซ้ายตามตำแหน่งที่ต้องการ */
}
</style>
</head>

<body>

<div id="myiframe_position1">
<iframe src="http://www.tlaa.org/2012/enews_safe_life.php" scrolling="no"
frameborder="0" width="1000" height="1500"></iframe>
</div>
</body>
</html>

เวอไนน์ไอคอร์ส

ประหยัดเวลากว่า 100 เท่า!

เวอไนน์เว็บไซต์⚡️
สร้างเว็บไซต์ ดูแลเว็บไซต์

Categories