CSS Line-Through no se elimina

Tengo un código que pone una línea en un TR para filas eliminadas, pero esto significa que mi columna "Acciones" (que solo tiene) botones sufre. Esto se debe a que hay espacios individuales entre los botones, que también terminan en línea.CSS Line-Through no se elimina

Después de hurgar en W3Schools, me deja atónito por qué este ejemplo no funciona:

<html> 
    <head> 
    <style type="text/css"> 

    tr {text-decoration:line-through} 
    </style> 
    </head> 

    <body> 
    <table> 
     <tr> 
     <td>this needs to be line-throughed</td> 
     <td style="text-decoration: none !important;">This shouldn't be line-throughed.</td> 
     </tr> 
    </table> 
    </body> 
</html>

¿Cómo se supone que voy a borrar la línea a través de elementos secundarios?

EDITAR He actualizado mi ejemplo - el problema es que no quiero tomar el estilo fuera del elemento padre, sólo un único elemento secundario.

Fuente

2009-11-18 JustLoren

CSS no funciona de esta manera. 'h2' y' tr' son contenedores, por lo que no puede cambiar su estilo cambiando el estilo de sus hijos. Vea las respuestas de Zarembisty o Dmitri para la forma normal de hacerlo. –

No debería tener que usar estilos importantes o en línea para esto. Trate

h2 {text-decoration:line-through;} 
h2 span {text-decoration: none; border: 1px solid black;}

EDITAR

En ese caso, con tr ya que sí se aplicó text-decoration a él, usted tiene que tomar text-decoration fuera del mismo elemento tr no td. De lo contrario hacer:

tr td { text-decoration: whatever }

y luego cuando sea necesario

<td style="text-decoration: none;"></td>

Fuente

2009-11-18 19:51:26

He aclarado basándome en mi ejemplo, pero haciendo tr td lo aplico a todos los TD, donde solo necesito uno individual – JustLoren

... también, este ejemplo no funciona lol – JustLoren

Buen punto, debería poner la línea- a través de los tds – JustLoren

Hubo un similares question un poco de tiempo atrás y de acuerdo con esa respuesta no se puede hacer lo que estamos tratando de lograr.

EDIT: Teniendo en cuenta su ejemplo, ¿por qué no se aplica el tachado al TD elementos de forma individual

<html> 
    <head> 
    <style type="text/css"> 

    td.deleted {text-decoration:line-through} 
    </style> 
    </head> 

    <body> 
    <table> 
     <tr> 
     <td class="deleted">this needs to be line-throughed</td> 
     <td>This shouldn't be line-throughed.</td> 
     </tr> 
    </table> 
    </body> 
</html>

Fuente

2009-11-18 19:56:38

egads, espero que la respuesta no sea "Lawl estás en un riachuelo sin pala" – JustLoren

si tienes dudas, ve con el anterior (gana Dmitri) –

se aplica la alineación a través de la H2, así que hay que quitárselo del H2.

<html> 
    <head> 
    <style type="text/css"> 

    h2 {text-decoration:line-through} 
    h2.alt { text-decoration: none; } 
    h2.alt span { border: 1px solid black; } 
    </style> 
    </head> 

    <body> 
    <h2>Line-through</h2> 
    <h2 class="alt"><span>This is heading 2, and shouldn't be line-throughed.</span></h2> 
    </body> 
</html>

(Se puede ver aquí: http://jsbin.com/anopa/)

El niño (Span) no puede afectar el estilo de la matriz (h2), que es donde se aplica el estilo. Tienes que cambiar el lugar donde se aplicó originalmente el estilo.

Editar: ejemplo actualizado

Fuente

2009-11-18 19:57:44

Pero eso sería contrario al propósito, ya que es un elemento secundario del que necesito que se elimine, no el elemento principal. El elemento padre "necesita" tenerlo (con el diseño actual) – JustLoren

Una forma de solucionar este problema sería cambiar

tr {text-decoration:line-through}

tr td {text-decoration:line-through}

Como resultado, la línea de paso es en el individuo celda de tabla y no toda la fila. Esto le permite especificar un estilo diferente en una sola celda.

Por cierto, el problema no parece existir con el código de ejemplo que ha dado en IE5.5 +. En FF3.5, sin embargo, el ejemplo se comporta como lo explicaste. No estoy seguro de cuál es el comportamiento correcto real.

Fuente

2009-11-18 20:04:55

Try Este aviso

<html> 
    <head> 
    <style type="text/css"> 

    tr td {text-decoration:line-through;} 
    tr td.noline { text-decoration:none;} 

    </style> 
    </head> 

    <body> 
    <table> 
     <tr> 
     <td>this needs to be line-throughed</td> 
     <td class="noline">This shouldn't be line-throughed.</td> 
     </tr> 
    </table> 
    </body> 
</html>

que el estilo es "td tr" para ambos.

Fuente

2009-11-18 20:16:19

-1

<td style="text-decoration: none>

Funciona, a menos que lo que intentas anular sea un enlace a una URL.

Luego esta frase también vence el enlace.

Fuente

2015-10-23 21:16:30 user5481820

Respuesta

Cuestiones relacionadas