ทำการ Print ข้อความในหน้าเว็บไซต์แค่บางส่วนที่ต้องการ

Post a reply


This question is a means of preventing automated form submissions by spambots.
Smilies
:icon_plusone: :like: :plusone: :gfb: :-D :) :( :-o 8O :? 8) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: :angry: :baa: :biggrin:
View more smilies

BBCode is ON
[img] is ON
[flash] is OFF
[url] is ON
Smilies are ON

Topic review
   

Expand view Topic review: ทำการ Print ข้อความในหน้าเว็บไซต์แค่บางส่วนที่ต้องการ

ทำการ Print ข้อความในหน้าเว็บไซต์แค่บางส่วนที่ต้องการ

Post by 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. แค่นีก็เสร็จสิ้นแล้วครับ ลองไปประยุกต์ใช้ดูครับ

Top