Anda telah melihatnya sebelum ini: Anda merancang susun atur yang indah dan seseorang berjalan ke pejabat anda dengan cetakan dan anda mengkritik di tapak kerja keras anda yang diwakili oleh pencetak.
Versi bercetak reka bentuk web jarang apa yang anda harapkan. Mereka mengambil beberapa tweak tambahan dan beberapa pementasan. Tetapi, pemahaman tentang bagaimana untuk menubuhkan paparan cetak supaya kandungan keluar seperti yang diharapkan tidak terlalu sukar apabila anda mendapat gantungnya.
Dalam artikel ini, saya akan menunjukkan kepada anda bagaimana untuk menyediakan lembaran gaya hanya untuk mencetak kandungan anda di laman web. Saya akan menggunakan tapak WordPress sebagai titik permulaan, kerana ia adalah rangka kerja yang popular, tetapi ini akan berfungsi untuk mana -mana tapak selagi anda menggunakan prinsip yang sama.
Nota cepat: Tidak ada cara mudah untuk membuat Web mencetak sempurna. Anda perlu melompat ke sana dan bekerja melalui setiap elemen yang anda mahu menyesuaikan diri. Saya mulakan dengan pergi ke halaman dan mencetaknya untuk melihat apa yang saya mulakan. Kemudian, saya memecahkan setiap elemen atau seksyen struktur dengan apa yang saya perlukan dan apa yang perlu diubah. Ia mengambil masa, tetapi ia berbaloi.
adakah anda memerlukan versi cetak?
Perkara pertama yang saya tanya diri saya sebelum membina versi bercetak tapak adalah sama ada atau tidak saya memerlukannya. Pereka yang teliti dalam diri saya cenderung menendang dan saya bersandar ke arah "ya" dalam kebanyakan kes. Tetapi, selalunya tidak ada keperluan untuk lembaran gaya cetak, bergantung kepada sifat dan tujuan laman web anda.
Juga, apabila orang mencetak halaman dari laman web anda, apakah matlamat mereka? Sering kali, mereka hanya mahu kandungan anda di tangan dan itu semua - mereka tidak mahu semua grafik, susun atur cantik, tajuk, sidebars, dan sebagainya. (Dan, mereka mungkin tidak mahu menggunakan dakwat mahal mereka pada unsur -unsur yang tidak penting.) Jadi, pertimbangkan apa yang sebenarnya diperlukan.
Pertimbangan cetak
Saya sentiasa menukar teks saya menjadi hitam supaya pencetak memahami bahawa tiada teduhan yang diperlukan (yang merupakan penyelamat dakwat besar). Saya juga berubah dari saiz fon dalam piksel ke mata. Sekiranya anda cuba memadankan saiz fon, ini boleh menjadi sedikit cabaran, tetapi inilah carta licin untuk membantu anda menukar dengan cepat dari px ke
mensasarkan kandungan anda
WordPress biasanya mempunyai struktur terbina dalam yang kelihatan seperti ini:
Setiap halaman mempunyai unsur -unsur struktur yang anda boleh target dengan mudah dengan CSS. Walaupun laman web anda tidak mempunyai struktur yang tepat ini, kunci adalah untuk menyesuaikan lembaran gaya cetak anda untuk tujuan anda.
Sasaran setiap struktur dalam CSS menggunakan #Header untuk bahagian tersebut dengan ID atau .header jika ia adalah kelas.
Akhir sekali, dan mungkin yang paling penting, kami akan menggunakan CSS @media CSS untuk menentukan apabila gaya CSS tertentu digunakan dengan betul.
Sebagai contoh, untuk mengeluarkan semua kandungan dari gaya cetak anda, anda akan melakukan sesuatu semudah ini dalam gaya anda.css:
[Bahasa SourCecode = "CSS"]
@media cetak {
#header {paparan: tiada;}
#content {display: none;}
#comments {paparan: tiada;}
#sidebar {paparan: tiada;}
#footer {display: none;}
.Site-Description {Display: none;}
.Site-Title {Display: none;}
}
[/Sourcecode]
Ini bekerja untuk tema dua puluh dua belas untuk WordPress dan memberi saya slate kosong yang bersih dan bersih untuk bermula dengan.
Jika anda berjuang untuk mengeluarkan elemen straggler, perkara yang paling mudah dilakukan ialah klik kanan elemen dalam penyemak imbas anda dan dapatkannya dalam dokumen sumber anda. Chrome mempunyai ciri "Periksa Elemen" yang melonjak ke kod untuk elemen itu, menjadikannya sangat mudah untuk mencari elemen yang menyinggung perasaan. Cari sama ada definisi ID atau kelas dan kemudian targetkannya dengan sewajarnya.
Dalam contoh ini, kita mungkin mempunyai straggler ini muncul dalam cetakan kami. Di sini anda dapat melihat ID:
Kita kini boleh menargetkan elemen ini dengan CSS berikut:
[Bahasa SourCecode = "CSS"]
#Contact-Popup {Display: none;}
[/Sourcecode]
Page Breaks
Pencetak memecahkan kandungan anda ke dalam halaman, dengan mengandaikan anda mempunyai lebih daripada satu halaman untuk dicetak. Anda boleh memberitahu penyemak imbas untuk mengelakkan rehat halaman pada titik tertentu. Anda boleh membaca semua tentang rehat halaman di CSS di halaman W3.org. Singkatnya, pilihan anda adalah seperti berikut:
Ingatlah bahawa halaman pecah hanya terpakai untuk menyekat kandungan. Contoh yang sama adalah senarai - anda mungkin mahu membuat senarai blok dan kemudian menghalang rehat halaman yang berlaku di tengah -tengah senarai. Pengecualian adalah teks, yang anda boleh menentukan sebagai blok dan kemudian gunakan pecahan halaman untuk mengubah bagaimana ia akan mencetak, tetapi biasanya teks harus mengalir dan anda boleh membenarkan penyemak imbas untuk mengetahui di mana untuk meletakkannya.
Contoh Contoh
Sekarang kita mempunyai slate kosong, mari kita mula menambah kepingan struktur yang sebenarnya kita mahu paparkan apabila dicetak. Bahagian Kandungan adalah calon yang jelas, jadi mari tambahkannya kembali dan tukar saiz fon perenggan ke titik:
[Bahasa SourCecode = "CSS"]
@media cetak {
#content p {
saiz font: 11pt;
Warna: Hitam;
}#content img {
paparan: blok;
Page-Break-selepas: Elakkan;
Page-Break-Inside: Elakkan;
}
#content ul, li {
paparan: blok;
Page-Break-Inside: Elakkan;
}
#header {paparan: tiada;}
#comments {paparan: tiada;}
#sidebar {paparan: tiada;}
#footer {display: none;}
.Site-Description {Display: none;}
.Site-Title {Display: none;}
}
[/Sourcecode]
Saya mengeluarkan paparan : tiada;
Melangkah dari web ke cetak boleh mengecewakan, tetapi pertanyaan media cetak
@media membolehkan kami mendapatkan sasaran dengan cara yang dicetak dan bagaimana mereka dicetak.
Tiada jalan pintas sebenar. Sekiranya anda memerlukan laman web anda untuk kelihatan baik dalam cetakan, anda mungkin perlu membuat definisi CSS yang berasingan pada tahap setiap elemen sehingga ia sempurna.
adalah bahagian cetak stylesheets sebahagian daripada proses reka bentuk standard anda, atau adakah anda menganggap mereka tambahan tambahan, bagus untuk mempunyai laman web yang direka dengan teliti?
soalan yang sering ditanya mengenai membuat lembaran gaya cetak yang disesuaikan
Apakah kepentingan membuat lembaran stylesheet cetak?
Lembaran stylesheet cetak adalah penting untuk menyediakan versi yang mesra pencetak laman web anda. Ia membolehkan anda mengawal bagaimana halaman kelihatan apabila dicetak, mengeluarkan unsur -unsur yang tidak perlu seperti menu navigasi, warna latar belakang, dan iklan. Ini bukan sahaja menjimatkan dakwat tetapi juga memastikan bahawa versi bercetak memberi tumpuan kepada kandungan penting, menjadikannya lebih mudah untuk dibaca dan difahami. Boleh menyembunyikan unsur -unsur tertentu apabila mencetak laman web dengan menggunakan harta 'paparan: tiada' dalam lembaran cetak anda. Sebagai contoh, jika anda ingin menyembunyikan menu navigasi, anda akan menyasarkan elemen yang mengandungi menu dan menetapkan harta paparannya kepada tiada. Ini akan memastikan bahawa elemen tidak dicetak.
Bolehkah saya mengawal pecahan halaman dalam versi cetakan laman web? Anda boleh melakukan ini dengan menggunakan sifat 'Page-Break-sebelum' dan 'Page-Break-selepas' dalam lembaran cetakan anda. Ciri -ciri ini membolehkan anda menentukan di mana pecahan halaman harus berlaku, membantu mengelakkan rehat yang janggal di tengah -tengah kandungan anda. Dengan menggunakan ciri Pratonton Cetak dalam penyemak imbas web anda. Ini akan menunjukkan kepada anda bagaimana laman web anda akan kelihatan apabila dicetak, membolehkan anda membuat sebarang pelarasan yang diperlukan untuk lembaran styleshe cetak anda. Ya, anda boleh memasukkan tajuk dan footer dalam versi cetakan laman web. Anda boleh melakukan ini dengan menggunakan harta 'kedudukan: tetap' dalam lembaran cetak anda. Ini akan memastikan bahawa tajuk dan kaki muncul di setiap halaman yang dicetak. harta 'terapung' dalam lembaran gaya cetak anda. Ini membolehkan anda mengawal kedudukan unsur -unsur di halaman, memastikan bahawa mereka diatur dengan cara yang masuk akal apabila dicetak. >
Ya, anda boleh mengawal margin dan padding dalam versi cetak laman web. Anda boleh melakukan ini dengan menggunakan sifat 'margin' dan 'padding' dalam lembaran cetakan anda. Ini membolehkan anda memastikan bahawa kandungan anda betul -betul jarak dan mudah dibaca apabila dicetak. Versi cetak laman web. Walau bagaimanapun, anda harus sedar bagaimana mereka akan melihat apabila dicetak. Anda mungkin mahu mengeluarkan imej latar belakang dan memastikan bahawa sebarang imej penting adalah jelas dan mudah dilihat dalam warna hitam dan putih. Anda boleh mengawal paparan imej menggunakan harta 'paparan' dalam lembaran styleshe cetak anda.
Atas ialah kandungan terperinci Buat lembaran gaya cetak yang disesuaikan dalam beberapa minit. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Alat AI Hot

Undress AI Tool
Gambar buka pakaian secara percuma

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Clothoff.io
Penyingkiran pakaian AI

Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Sebab-sebab utama mengapa WordPress menyebabkan lonjakan dalam penggunaan CPU pelayan termasuk masalah pemalam, pertanyaan pangkalan data yang tidak cekap, kualiti kod tema yang buruk, atau lonjakan trafik. 1. 2. Masukkan mod penyelesaian masalah untuk secara beransur-ansur membolehkan pemalam untuk menyelesaikan masalah kesesakan prestasi, gunakan QueryMonitor untuk menganalisis pelaksanaan pemalam dan memadam atau menggantikan pemalam yang tidak cekap; 3. Pasang pemalam cache, bersihkan data berlebihan, menganalisis log pertanyaan perlahan untuk mengoptimumkan pangkalan data; 4. Periksa sama ada topik itu mempunyai masalah seperti kandungan beban, pertanyaan kompleks, atau kekurangan mekanisme caching. Adalah disyorkan untuk menggunakan ujian topik standard untuk membandingkan dan mengoptimumkan logik kod. Ikuti langkah -langkah di atas untuk memeriksa dan menyelesaikan lokasi dan selesaikan masalah satu demi satu.

Fail JavaScript Minive boleh meningkatkan kelajuan memuatkan laman web WordPress dengan mengeluarkan kosong, komen, dan kod yang tidak berguna. 1. Gunakan pemalam cache yang menyokong penggabungan mampatan, seperti w3totalcache, aktifkan dan pilih mod mampatan dalam pilihan "Minify"; 2. Gunakan plug-in mampatan khusus seperti fastvelocityminify untuk memberikan lebih banyak kawalan berbutir; 3. Secara manual memampatkan fail JS dan memuat naiknya melalui FTP, sesuai untuk pengguna yang biasa dengan alat pembangunan. Perhatikan bahawa beberapa tema atau skrip plug-in mungkin bertentangan dengan fungsi mampatan, dan anda perlu menguji fungsi laman web dengan teliti selepas pengaktifan.

Kaedah untuk mengoptimumkan tapak WordPress yang tidak bergantung pada pemalam termasuk: 1. Gunakan tema ringan, seperti Astra atau GeneratePress, untuk mengelakkan tema tumpukan; 2. Secara manual memampatkan dan menggabungkan fail CSS dan JS untuk mengurangkan permintaan HTTP; 3. Mengoptimumkan imej sebelum memuat naik, gunakan format web dan saiz fail kawalan; 4. Configure.htaccess untuk membolehkan cache penyemak imbas, dan sambungkan ke CDN untuk meningkatkan kelajuan pemuatan sumber statik; 5. Hadkan semakan artikel dan data yang kerap dibersihkan data yang berlebihan.

Cara yang paling berkesan untuk mengelakkan spam komen adalah untuk mengenal pasti dan memintasnya secara automatik melalui cara programatik. 1. Menggunakan mekanisme kod pengesahan (seperti Googler Captcha atau HCaptcha) untuk membezakan secara berkesan antara manusia dan robot, terutama yang sesuai untuk laman web awam; 2. Tetapkan bidang tersembunyi (teknologi honeypot), dan gunakan robot untuk mengisi ciri -ciri secara automatik untuk mengenal pasti komen spam tanpa menjejaskan pengalaman pengguna; 3. Semak senarai hitam Kata Kunci Kandungan Komen, maklumat spam penapis melalui pemadanan kata yang sensitif, dan perhatikan untuk mengelakkan salah faham; 4. Hakim kekerapan dan sumber IP komen, hadkan bilangan penyerahan per unit masa dan buat senarai hitam; 5. Gunakan perkhidmatan anti-spam pihak ketiga (seperti Akismet, CloudFlare) untuk meningkatkan ketepatan pengenalan. Boleh berdasarkan laman web

Transientsapi adalah alat terbina dalam di WordPress untuk menyimpan data tamat tempoh automatik sementara. Fungsi terasnya adalah set_transient, get_transient dan delete_transient. Berbanding dengan OptionsAPI, transien menyokong penetapan masa kelangsungan hidup (TTL), yang sesuai untuk senario seperti hasil permintaan API cache dan data pengkomputeran yang kompleks. Apabila menggunakannya, anda perlu memberi perhatian kepada keunikan penamaan utama dan ruang nama, mekanisme "penghapusan malas" cache, dan isu yang mungkin tidak bertahan dalam persekitaran cache objek. Senario aplikasi biasa termasuk mengurangkan kekerapan permintaan luaran, mengawal irama pelaksanaan kod, dan meningkatkan prestasi pemuatan halaman.

Apabila membangunkan blok gutenberg, kaedah aset enqueue yang betul termasuk: 1. Gunakan daftar_block_type untuk menentukan laluan editor_script, editor_style dan gaya; 2. Daftar sumber melalui wp_register_script dan wp_register_style dalam fungsi.php atau plug-in, dan tetapkan kebergantungan dan versi yang betul; 3. Konfigurasikan alat binaan untuk mengeluarkan format modul yang sesuai dan pastikan laluan itu konsisten; 4. Kawalan logik pemuatan gaya depan melalui add_theme_support atau enqueue_block_assets untuk memastikan logik pemuatan gaya front-end dipastikan.

Untuk menambah medan pengguna tersuai, anda perlu memilih kaedah lanjutan mengikut platform dan memberi perhatian kepada pengesahan data dan kawalan kebenaran. Amalan umum termasuk: 1. Gunakan jadual tambahan atau pasangan nilai utama pangkalan data untuk menyimpan maklumat; 2. Tambah kotak input ke hujung depan dan diintegrasikan dengan hujung belakang; 3. Mengatasi Pemeriksaan Format dan Kebenaran Akses untuk Data Sensitif; 4. Kemas kini antara muka dan templat untuk menyokong paparan dan penyuntingan medan baru, sambil mengambil kira penyesuaian mudah alih dan pengalaman pengguna.

Kunci untuk menambah peraturan penulisan semula tersuai di WordPress adalah dengan menggunakan fungsi add_rewrite_rule dan pastikan peraturan berkuatkuasa dengan betul. 1. Gunakan add_rewrite_rule untuk mendaftarkan peraturan, formatnya adalah add_rewrite_rule ($ regex, $ redirect, $ selepas), di mana $ regex adalah url yang sepadan dengan ungkapan biasa, $ redirect menentukan pertanyaan sebenar, dan $ selepas mengawal lokasi peraturan; 2. Pembolehubah pertanyaan tersuai perlu ditambah melalui add_filter; 3. Selepas pengubahsuaian, tetapan pautan tetap mesti disegarkan semula; 4. Adalah disyorkan untuk meletakkan peraturan di 'atas' untuk mengelakkan konflik; 5. Anda boleh menggunakan pemalam untuk melihat peraturan semasa untuk kemudahan
