problemas media print css

alfinete

alfinete

Power Member
pus este code no css coorespondete ao form em causa que vai ser chamado na respectiva div para inibir os botões do form

no qual funciona em tdos os browsers excepto no ie6.



Código: 
@media print {

      .onlyprint
      {
      display: block;
      visibility: visible;
      }
      .noprint
      {
       display: none;
       visibility: hidden;
      }     
}


gostava que me ajudassem pq
 
Honestamente não sei..

Mas fiquei curioso sobre essa forma de organizar a CSS, que nunca tinha visto.

Imagina que queres usar a classe .noprint, como é que o fazes (sim, sou preguiçoso e não quero ir testar).

Cumps

EDIT: E o que faz a @ ?
 
chamas no botão ou na div tipo

Código: 
<button id="btnimprimir" class="noprint" value="imprimir"  onClick="window.print();></button>
<div class="noprint"></div>

neste caso ao clicares no botão ele chama a janela de impressão e ao imprimir , na impressão não mostra nem o botão nem a div nem qualquer outro obj que chames a class noprint

mas isto funciona em tdos os browsers excepto no ie 6
 
ou fazes assim ao inicio da page html

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

ou assim no css

Código: 
@media print 
{

.impressao
{
}
}
sobre um ponto de vista @media print é uma classe css onde podes criar novas classes

so especificas para a impressão, mais ou menos isso

mais ajudas sobre os media tipes

http://www.oficinadanet.com.br/artigo/84/css_e_suas_media_types
 
Última edição:
Ah..

Já percebi.. Eu sei xHTML relativamente bem, mas nunca surgiu oportunidade/situação em que precisasse de usar isto.

Obrigado pelo esclarecimento.

Em relação ao que estás a tentar fazer, provavelmente deve haver hacks...

Do estilo do * / > / _ ;)
 
hYpe disse:
Honestamente não sei..

Mas fiquei curioso sobre essa forma de organizar a CSS, que nunca tinha visto.

Imagina que queres usar a classe .noprint, como é que o fazes (sim, sou preguiçoso e não quero ir testar).

Cumps

EDIT: E o que faz a @ ?
Clicar para expandir...

off-topic

@ significa "at-rule"

Também uso raramente o @

Por ex.
Código: 
  <style type="text/css" media="print">
      .onlyprint{display: block;visibility: visible;}
      .noprint{display: none;visibility: hidden;}
  </style>
vai fazer o mesmo que isto
Código: 
  <style type="text/css">
    @media print{
      .onlyprint{display: block;visibility: visible;}
      .noprint{display: none;visibility: hidden;}
    }

Ou com o alfinete já tinha dito podes usar o <link>
Código: 
<link rel="stylesheet" type="text/css" href="style.css" media="print" >
ou o @import
Código: 
  <style type="text/css">
    @import url("style.css") print;
  </style>

Basicamente o @import será um "include", em vez de estares a escrever dentro do <style> todo o código css.
Enquanto o <link> é uma tag html que te permite fazer várias coisas, o @import será mesmo especifico css, também podes usar para "esconder" o código de browsers mais antigos que não suportam (há vários hacks também para isso).

Acho que é isto, espero não estar a induzir ninguém em erro.


on-topic

O teu problema é o evento onclick não funcionar ou os objectos aparecerem sempre quando fazes print?

Não estou a ver qual é o problema, se por ex. eu fizer isto
Código: 
<html>
<head>
  <style type="text/css">
    @media print{
      .onlyprint{display: block;visibility: visible;}
      .noprint{display: none;visibility: hidden;}
    }
  </style>
</head>
<body>
  <div class="noprint">
    Inside DIV, this should only appear when printing ...
  </div>
  <button id="btnimprimir" class="noprint" value="imprimir" onclick="window.print();">Imprimir</button>
</body>
</html>
funciona bem no IE6.


Se por ex. tiveres esse código num ficheiro externo e fizeres
Código: 
<link rel="stylesheet" type="text/css" href="style_print.css" media="print" >
também não funciona?

Tenta colocar aqui mais código da página, pode ser que alguém te ajude e consiga ver melhor o problema
 
Última edição:
Inicie sessão ou registe-se para poder participar.
Back
Topo