Perlu menghapus nilai href saat mencetak di Chrome

290

Saya mencoba untuk menyesuaikan cetak CSS, dan menemukan bahwa itu mencetak tautan dengan hrefnilai serta tautan.

Ini ada di Chrome.

Untuk HTML ini:

<a href="http://www.google.com">Google</a>

Mencetak:

Google (http://www.google.com)

Dan saya ingin mencetak:

Google

— Chris Gratigny
sumber

1

Perlu diingat MENGAPA setiap kerangka CSS utama melakukan itu - Anda tidak dapat mengklik di atas kertas! Jadi, jika Anda akan menonaktifkannya, Anda harus menambahkan daftar tautan di bagian bawah, seperti ini: alistapart.com/article/improvingprint

— Julix

1

Itu benar, tapi saya pikir lebih baik untuk mengontrol kapan dan di mana tautan muncul. Misalnya, di tautan saya, saya ingin mereka muncul di baris berikutnya setelah teks, dan tanpa tanda kurung. Jadi saya hanya menunjukkan url di teks.

— user4052054

602

Bootstrap melakukan hal yang sama (... seperti jawaban yang dipilih di bawah).

@media print {
  a[href]:after {
    content: " (" attr(href) ")";
  }
}

Hapus saja dari sana, atau ganti dengan lembar gaya cetak Anda sendiri:

@media print {
  a[href]:after {
    content: none !important;
  }
}

— Alex Ghiculescu
sumber

17

<style>@media print{a[href]:after{content:none}}</style>Sebagian besar memposting untuk saya sendiri ketika saya terus kembali ke halaman ini, terima kasih

— William Entriken

1

Rupanya Foundation juga melakukan hal yang sama.

— spasticninja

Sepertinya HTML5 Boilerplate juga melakukan ini! Jadi saya kira saya harus menimpanya melalui perubahan kode di situs web saya sendiri, dan melalui Inspektur di situs web lain ...

— ADTC

Peringatan: Kami memiliki masalah ketika sebuah tabel terkadang kehilangan beberapa baris terakhir saat mencetak. Ternyata aturan ini adalah pelakunya, atau setidaknya menghapusnya memperbaiki masalah. Tidak tahu mengapa itu memiliki efek seperti itu.

— Henrik N

1

@ HenrikN - saya pikir itu terkait dengan kolom bootstrap mengambang. menggunakan di float:nonemana perlu memperbaiki masalah serupa untuk saya beberapa minggu yang lalu; mungkin membantu Anda, tetapi itu masalah yang berbeda

— Andrew

40

Tidak . Di suatu tempat di lembar gaya pencetakan Anda, Anda harus memiliki bagian kode ini:

a[href]::after {
    content: " (" attr(href) ")"
}

Satu-satunya kemungkinan lain adalah Anda memiliki ekstensi untuk melakukannya.

— Eric
sumber

1

Saya mendapatkannya di zurb foundation css.

— forX

26

@media print {
   a[href]:after {
      display: none;
      visibility: hidden;
   }
}

Luaskan cuplikan

Pekerjaan sempurna.

— JELEWA.de
sumber

10

Jika Anda menggunakan CSS berikut

<link href="~/Content/common/bootstrap.css" rel="stylesheet" type="text/css"    />
<link href="~/Content/common/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="~/Content/common/site.css" rel="stylesheet" type="text/css" />

ubah saja ke gaya berikut dengan menambahkan media = "layar"

<link href="~/Content/common/bootstrap.css" rel="stylesheet" **media="screen"** type="text/css" />
<link href="~/Content/common/bootstrap.min.css" rel="stylesheet" **media="screen"** type="text/css" />
<link href="~/Content/common/site.css" rel="stylesheet" **media="screen"** type="text/css" />

Saya pikir itu akan berhasil.

jawaban mantan suka

    @media print {
  a[href]:after {
    content: none !important;
  }
}

tidak berfungsi dengan baik di penelusuran krom.

— Wang Jijun
sumber

4

Saya mengalami masalah serupa hanya dengan img bersarang di jangkar saya:

<a href="some/link">
   <img src="some/src">
</a>

Ketika saya melamar

@media print {
   a[href]:after {
      content: none !important;
   }
}

Saya kehilangan img dan seluruh lebar jangkar karena beberapa alasan, jadi saya malah menggunakan:

@media print {
   a[href]:after {
      visibility: hidden;
   }
}

yang bekerja dengan sempurna.

Kiat bonus : periksa pratinjau cetak

— TrampGuy
sumber

1

Untuk menyembunyikan url Halaman.

gunakan media="print"dalam contoh gaya tage:

<style type="text/css" media="print">
            @page {
                size: auto;   /* auto is the initial value */
                margin: 0;  /* this affects the margin in the printer settings */
            }
            @page { size: portrait; }
</style>

Jika Anda ingin menghapus tautan:

@media print {
   a[href]:after {
      visibility: hidden !important;
   }
}

— Abd Abughazaleh
sumber

-2

Untuk pengguna normal. Buka jendela periksa halaman saat ini. Dan ketik:

l = document.getElementsByTagName("a");
for (var i =0; i<l.length; i++) {
    l[i].href = "";
}

Maka Anda tidak akan melihat tautan url di pratinjau cetak.

— Wen Xin
sumber

Ini adalah solusi yang baik jika Anda tidak memiliki kendali atas kode sumber dari halaman yang Anda coba cetak.

— Paddymac