Apa itu Print.css ?

nah kali ini saya mau membahas apa itu Print.css ? apa kegunaannya ? dan bagaimana cara pasang dan settingnya ?
saya coba ambil contoh (tanpa menggunakan print.css) dari gambar berikut :


by : http://www.onextrapixel.com/2009/05/05/how-to-create-a-simple-print-css-for-your-site/

nah seperti itulah jika sebuah document web tanpa print.css jika di print , dan untuk bagaimana dan cara settingnya saya tunggu yg ahlinya bicara dulu deh hehehe yuk yg ahli komen dong ajarin kita2
Update : buat liat preview print alias demo nya (di firefox) buka menu > print > print preview . Nah itulah hasil dari Print.css

 

Di sumbernya jelas sekali

Di sumbernya jelas sekali kalau print.css tersebut ditambahkan di head dari halaman kita:

Code:

<link rel="stylesheet" href="alamat file print.css-nya" type="text/css" media="print" />

 

Dan wrote:

haha itu memang iyaah brarti clear sudah , dan selanjutnya mungkin pakai normalize kali atau reset.css tambah dikit2 yg susah yaa buat isi file css nya

 

jadi sebuah website juga

jadi sebuah website juga perlu print.css ya , baru tau

 

samuel wrote:

Iya perlu biar keliatan lebih beautiful kalau di print. Bener gak Mas fahmi?

Code:

Bagus..!

 

D-dig wrote:

yoi mas braey biar keren saat di print, misal pada saat di print saya tidak mau sidebar/banner/widget itu terbawa ke print, nah settingnya ya di print.css nya , iya kan?

 

Sebenernya saya baru tau

Sebenernya saya baru tau tapi saya tidak pernah print situs, lebih sering print screen

 

Maksudnya isi dari print.css

Maksudnya isi dari print.css bukan mas?
Kan disitu udah dikasih tau

Spoiler

Code:

body {margin:0; padding:0; line-height: 1.4em; word-spacing:1px; letter-spacing:0.2px; font: 13px Arial, Helvetica,"Lucida Grande", serif; color: #000;}

/*Header*/
h2 {color:#000; font-size:25px;}
.post .entry h2 {font-size:20px;}

/* Links */
a:link, a:visited {background: transparent; color:#333; text-decoration:none;}
a:link[href^="http://"]:after, a[href^="http://"]:visited:after {content: " (" attr(href) ") "; font-size: 11px;}
a[href^="http://"] {color:#000;} 

/*Image*/
img, img a, .more-link a {border:none;}

/*Remove Element*/
#logo, #catnavi, .topnavi, .more-link, .navigation, #sidebartop, #related, #social, #sponsors, .tabs, #allpost, .toolbar, .splitbox, #commentform, #commentabs .idTabs, .postmeta-content .comments, #respond h3, .tag, .footerlinks {display:none;}

/*Post*/
.post {border-bottom:1px solid #000;}
.postmeta {font-size:10pt; margin-top:10px;}
.postfooter {font-size:10pt; margin-bottom:20px;}

/*Comment Section*/
.commentlist .avatar {float:left; margin-right:10px;}
.commentlist .children {margin-top:10px;}
#comments {page-break-before: always;}

/*Footer*/
#footer {margin-top:10px;}

Maaf kalo salah

 

ternyata komponen kecil

ternyata komponen kecil sangat berguna yah dalam desain

 

ekselsior wrote:

Kalau kita mau nge print halaman suatu website dengan cara yang sudah disebutkan di awal, yaitu :
Update : buat liat preview print alias demo nya (di firefox) buka menu > print > print preview . Nah itulah hasil dari Print.css
Maka nanti hasilnya seperti di tampilan print tersebut.

 

Wah, baru mau bikin pertanyaan eh tapi udh langsung terjawab sama masternya. Mungkin TS bisa nambahin tentang print.css kepada para newbie, mungkin bisa bermanfaat, tapi overall yang itu juga sangat bermanaat . terimakasih.

 

Tanpa print css, ngeprint halaman web bisa kok tampilannya sama.
Coba buka file>Page setup