የህትመት ጣቢያ የተወሰነ አካባቢ የሲ

ከመቼውም ጊዜ የጣቢያውን ብቻ የተወሰነ አካባቢ ማተም አለብዎት? እንግዲህ, ይህ ለህትመት አካባቢ ለመግለጽ እንዴት? የሲ ኤስ መፍትሔ ነው!

ችግር

Cenário: እኔ እዚያ በማያ ገጹ ላይ መላው ጣቢያ ነበር, እና ሪፖርት አይነት መሃል ላይ በቀኝ (በሲጋራ ውሂብ). Como imprimir apenas a área que eu tinha interesse?

መፍትሔ

Como sabemos, @media print é um recurso CSS que nos permite controlar o estilo do que será impresso. Vamos analisar duas situações.

Not Print

1° CasoImprimir tudo, mas excluir uma ou mais áreas da impressão
Quando você tem uma área que deseja excluir da impressão é fácil, basta criar uma uma class dentro de@media printocultando a visibilidade e atribuí-la ao elemento (tag html) que você não quer imprimir. No caso abaixo, foi criado a classe .notprint e atribuída a uma DIV que não deve ser impressa.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html>
<html>
<ራስ>
  <አርእስት>Not Print</አርእስት>
  <style type="text/css">
      @media እትም { 
          .notprint { visibility:hidden; } 
      }
  </ቅጥ>
</ራስ>
<አካል>
  <strong>Isto vai ser impresso!</strong>
  <div መደብ="notprint">
      Já isto, não será impresso!
  </div> 
  Aqui também será impresso!             
</አካል>
</html>

Yes Print

2° CasoIncluir uma única área na impressão, e excluir demais
Mas e quando for o contrário, በሌላ አባባል ውስጥ, e se eu quiser imprimir apenas uma área específica, como uma DIV, ለምሳሌ, e não quiser que o restante do site apareça na impressão. Eis o motivo deste Post! ግልጽ, também usaremos o @media print, só que raciocinando de forma diferente. በዚህ ጉዳይ ላይ, ocultamos a visibilidade de todos (*) os elementos do site e, em seguida, damos visibilidade apenas ao elemento que queremos imprimir, devidamente designado por um ID que chamei de #yesprint. እንደዚህ, podemos, ለምሳሌ, imprimir apenas conteúdo de uma DIV específica.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html>
<html>
<ራስ>
  <አርእስት>Yes Print</አርእስት>
  <style type="text/css">
    @media እትም {
      * {
        visibility:hidden;
      }
 
      #yesprint {
        visibility:visible;
        position: absolute;
        top:0;
        left:0;                                     
      }                                  
    }
  </ቅጥ>
</ራስ>
<አካል>
  <strong>Isto não vai ser impresso!</strong>  
  <div መታወቂያ="yesprint">
      Já isto e, apenas isto, será impresso!
  </div> 
  Aqui também não vai sair na impressão!            
</አካል>
</html>

Caso não ocorra o efeito desejado, possivelmente seja devido a sua template estar pegando estilo residual de algum CSS acima (pai). Tente usar !important ou ajustar o código para forçar o resultado esperado. Veja também se não há alguma tag quebrada, sem abrir ou fechar.

Testei esta solução no Internet Explorer 9, ፋየርፎክስ 14.0.1 e Chrome 21.0.1180.8. Todos pareceram funcionar corretamenteLembro também, que caso queira imprimir cores e imagens do plano de fundo, isto deve ser configurado diretamente em cada navegador. ለምሳሌ, no Internet Explorer, vá no menu Arquivo > Configurar Página e habilite a opçãoImprimir cores e imagens do plano de fundo“, ከታች እንደሚታየው. Nesta mesma janela, é possível fazer outros ajustes de impressão.

Veja também: ለማተም የማይታይ ዲቪ ይሁኑ | የሲ ኤስ ኤስ የተለየ እንደሆነ አትም.

ያ… use por sua conta e risco!

ጠቅላላ የመጠቀሚያ ጊዜ: 14119

4 ግምገማዎች “የህትመት ጣቢያ የተወሰነ አካባቢ የሲ

    • Copie o código exatamente como está no exemplo do Post para seu servidor e teste para ver se funciona. Tente também colocar o CSS embutido direto na página (e não fazendo chamada externa), só para fins de testes. Às vezes, se você estiver usando código de CSS de terceiros (como plugins), pode ser que alguma Tag esteja definida como important!. Use o Firefox com o Firebug e procure identificar corretamente as classes ou ids CSS que você está querendo modificar. Use o ponteiro do Firebug para isto! E por aí vai

አንድ መልስ ውጣ

የእርስዎ ኢሜይል አድራሻ ሊታተም አይችልም. የሚያስፈልጉ መስኮች ጋር ምልክት ነው *