โดย codetukyang » 21/11/2010 3:22 pm
>> ดูเนื้อหา & ตัวอย่าง แบบเต็มๆที่ http://www.codetukyang.com ครับ
*วิธีการทำ*
หลักการ คือ เราจะใส่ข้อความลงใน DIV ก่อน แล้วเวลาจะพิมพ์ก็ใช้ CSS ทำการซ่อน DIV ที่ไม่ต้องการจะให้พิมพ์ออกมาทางหน้าจอเท่านั้น
1. นำ Code ด้านล่างไปไว้ที่ <head> ครับ
<STYLE type=text/css>
#printable { display: block; }
@media print
{
#non-printable { display: none; }
#printable { display: block; }
}
</STYLE>
2. นำ Code ด้านล่างไปไว้ในตำแหน่งที่ต้องการให้แสดงข้อความใน <body> นะครับ
<DIV id=non-printable>
<CENTER><FONT color=red><B>สิ่งที่จะให้แสดงออกมาทางหน้าจอ แต่ว่าไม่เห็นเวลา Print หน้านี้ออกมา</B></FONT></CENTER>
</DIV>
<BR>
<DIV id=printable>
<CENTER><FONT color=blue><B>สิ่งที่จะให้แสดงออกมาทางหน้าจอ และจะเห็นเวลา Print หน้านี้ออกมาด้วย</B></FONT></CENTER>
</DIV>
3. แค่นีก็เสร็จสิ้นแล้วครับ ลองไปประยุกต์ใช้ดูครับ
[size=150]>> ดูเนื้อหา & ตัวอย่าง แบบเต็มๆที่ http://www.codetukyang.com ครับ[/size]
*วิธีการทำ*
หลักการ คือ เราจะใส่ข้อความลงใน DIV ก่อน แล้วเวลาจะพิมพ์ก็ใช้ CSS ทำการซ่อน DIV ที่ไม่ต้องการจะให้พิมพ์ออกมาทางหน้าจอเท่านั้น
1. นำ Code ด้านล่างไปไว้ที่ <head> ครับ
<STYLE type=text/css>
#printable { display: block; }
@media print
{
#non-printable { display: none; }
#printable { display: block; }
}
</STYLE>
2. นำ Code ด้านล่างไปไว้ในตำแหน่งที่ต้องการให้แสดงข้อความใน <body> นะครับ
<DIV id=non-printable>
<CENTER><FONT color=red><B>สิ่งที่จะให้แสดงออกมาทางหน้าจอ แต่ว่าไม่เห็นเวลา Print หน้านี้ออกมา</B></FONT></CENTER>
</DIV>
<BR>
<DIV id=printable>
<CENTER><FONT color=blue><B>สิ่งที่จะให้แสดงออกมาทางหน้าจอ และจะเห็นเวลา Print หน้านี้ออกมาด้วย</B></FONT></CENTER>
</DIV>
3. แค่นีก็เสร็จสิ้นแล้วครับ ลองไปประยุกต์ใช้ดูครับ