Распечатать сайт без распечатки ссылок?

Question

Я вызываю функцию печати навигатора с помощью простого window.print ();вызов.Он печатается идеально (я хочу печатать то же, что вижу на экране, поэтому я не использую специальный CSS для печати), но он показывает расположение ссылки рядом с текстовой ссылкой, что-то вроде:

    Homepage (http://localhost)

Проще говоря: я не хочу, чтобы ссылки располагались рядом со ссылками в печатной версии, у меня есть контроль над CSS, но я не могу найти это поведение в любом месте, поэтому я думаю, что это связано с навигаторомпроблема!

РЕДАКТИРОВАТЬ: Это происходит под Firefox 3.6.8 и последним Chrome, на Ubuntu Windows XP / Vista.

Answer 1

Чтобы избежать дополнительной распечатки информации о ссылках на распечатанной веб-странице, добавьте следующие правила в раздел @media print:

a:link:after, a:visited:after {
    content: "";
}

Это удалит некрасивую информацию о ссылке, такую ​​как Homepage (http://localhost), и уменьшит ее до Homepage. Конечно, вы можете добавить правила, чтобы избежать их, только в текстовом разделе (или только в навигации, но вы не должны отображать навигацию в формате распечатки вашей веб-страницы.

Answer 2

Кажется, что вы печатаете страницу с этим стилем из браузера, совместимого с CSS2

http://www.alistapart.com/articles/goingtoprint/

В браузере, полностью совместимом с CSS2, мы можем вставить в скобки URL-адресассылки после каждой, что делает их довольно полезными для тех, у кого есть копия распечатки и удобный веб-браузер.Вот правило, которое ограничивает этот эффект элементом div «content» и, таким образом, позволяет избежать залипания URL-адреса в заголовке:

#content a:link:after, #content a:visited:after {    
  content: " ("attr(href) ") ";    
  font-size: 90%;   
}

Попробуйте его в браузере на основе Gecko, напримерMozilla или Netscape 6.x.После каждой ссылки в распечатке вы должны увидеть URL ссылки в скобках.

Answer 3

содержание: ""; не работает Я использую это:

@media print {
    .noprint {display:none !important;}
    a:link:after, a:visited:after {  
      display: none;
      content: "";    
    }
}

Это работает, чтобы отключить!

Answer 4

В настоящее время использование свойства содержимого должно работать во всех основных браузерах.

    @media print  - or -  <style type="text/css" media="print">

    a:link:after, a:visited:after {  
        content: normal; //TODO: add !important if it is overridden  
    }

Дополнительные параметры здесь: Содержимое CSS .

Более полезные способы использования содержимогоатрибут здесь: CSS Tricks

Answer 5

Мой сервер приложений (rails) потребовал, чтобы я использовал родительский селектор.Элемент body идеально подходит для выбора всей страницы.

body a:link:after, body a:visited:after {    
  content: "";
}

Answer 6

Для любого, кто использует Bootstrap 3, используется селектор:

a[href]:after { }

И может быть переопределен чем-то вроде:

a[href]:after {
   content: initial;
}

Answer 7

Я обнаружил, что другие решения не работают (больше) кросс-браузер. Следующие работы в FF 29, Chrome 35, IE 11:

a:link:after, a:visited:after {  
  content: normal !important;  
}

Answer 8

Несмотря на то, что было предложено много опций css, если вы хотите избавиться от ссылок и заголовков в верхнем / нижнем колонтитуле, которые принудительно отображаются на каждой странице, для вас есть настройка. Как показано ниже.

Вот и все.

Answer 9

Добавление этого поможет вам удалить эти нежелательные ссылки

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

Чтение этого поможет

Answer 10

Используйте дополнительный CSS для печати. ​​

Смотрите здесь: http://www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml