Estilo de entrada HTML para ocultar el cuadro pero mostrar el contenido

StackOverflow https://stackoverflow.com/questions/150513

  •  02-07-2019
  •  | 
  •  

Pregunta

Tengo un formulario en HTML donde nuestros usuarios completan los datos y luego los imprimen. Los datos no se guardan en ningún lado. Estos formularios provienen de fuera de nuestra empresa y se crean como páginas html para parecerse lo más posible al original y luego se guardan y se olvidan en una carpeta en la intranet. Normalmente otro desarrollador los hace, pero tengo que hacer algunos mientras él está fuera. Mirando a través de su código, todos sus formularios tienen un montón de código del lado del servidor para tomar las entradas y volver a escribir la página con solo el contenido. Parece que debería haber una mejor manera.

Solo quiero aplicar estilo a las entradas de texto usando un selector de medios para que cuando se imprima pueda ver el texto, pero nada del cuadro que lo rodea. ¿Alguna idea?

¿Fue útil?

Solución

Agregue un archivo CSS separado para imprimir haciendo algo como esto: 

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

agréguelo a la sección <head> de la página.

En este archivo (print.css) incluya el estilo relevante para lo que desea ver cuando se imprime la página, por ejemplo:

input{border: 0px} debería ocultar el borde de los cuadros de entrada al imprimir.

Otros consejos

Suponiendo que solo desea eliminar el borde y demás de los textos, deberá darles una clase. Tal vez algo como: 

<input type="text" class="print-clean" .../>

Y css, cargado con media = " print " ;: 

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

contendría algo como esto: 

.print-clean {
    border: none;
    background: transparent;
}

<input type="text" style="border: 0; background-color: #fff;" />

Donde #fff es el color de fondo ..

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top