Блог

Главная - Вопросы по программированию - Как напечатать только изображение на моей веб-странице?

Как напечатать только изображение на моей веб-странице?

#c# #javascript #jquery #asp.net #web-applications

#c# #javascript #jquery #asp.net #веб-приложения

Вопрос:

У меня есть веб-страница, которая создает штрих-коды. Я хочу напечатать этот штрих-код на наклейке. Вот почему я хочу печатать только выделенную область (только штрих-код), и я не хочу печатать верхний и нижний колонтитулы веб-страницы.Только штрих-код.

Как я могу решить эту проблему?

Спасибо за внимание!!!

P.S Веб-страница создается на ASP.NET с помощью C#

Комментарии:

1. Как бы вы напечатали веб-страницу? Является ли пользовательская Print ссылка, которая переходит к другому pae, подходящим решением для вас?

Ответ №1:

Сначала создайте печатную версию вашего CSS-документа, которая скрывает верхний и нижний колонтитулы.

 /* print.css */
#header { display: none; }
#footer { display: none; }

Затем свяжите таблицу стилей в заголовке вашего HTML-документа с таблицей стилей «печать»:

 <link rel="stylesheet" type="text/css" href="print.css" media="print">

После внесения этих изменений верхний и нижний колонтитулы не будут включены в выходные данные для печати.

Ответ №2:

Я бы использовал CSS @media print для обработки этого:

 @media print
{
    /* Add this to everything that you don't want to print (your header and footer) */
    .noPrint
    {
        display:none;
    }

    /* You could also reference your header and footer containers specifically */
    #headerContainer
    {
        display:none;
    }

    #footerContainer
    {
        display:none;
    }
}

Если вы хотите сохранить CSS-файл для печати отдельно в другом файле, добавьте media="print" атрибут в свой link тег:

 <link rel="stylesheet" type="text/css" href="printCSS.css" media="print">

Примечание: Если вы просто определяете noPrint класс CSS, я не вижу причин создавать совершенно новый файл CSS для размещения этого простого определения класса.

Ответ №3:

Я бы создал пользовательский класс css для печати. Просто укажите атрибут media.

 <link rel="stylesheet" type="text/css" href="print.css" media="print" />

Ознакомьтесь с этим руководством.