How to control the thickness/thickness of the tag 'strike, del, s', the famous line above the text

Asked

Viewed 276 times

4

Today I was developing a project and I reached a point that for the first time in my life I decided to make use of the tag <strike> html. I don’t know if it was the font style I was using, but the line above the text was hardly noticeable. Which led me to the question:

Is there any way to control the length (thickness/thickness) of the line above the text?

A tag "strike" adiciona uma <strike>linha por cima de um texto</strike>.

1 answer

2


Here is an alternative solution for tag usage <strike>, <del> or <s>more malleable and that gives us more control not only for the thickness of the line but also for the color of it and adapt it to various types of needs:

Additional information:

According to the w3schools, it seems that the tag <strike> is not supported in HTML5. To use this HTML5 tag we must use <del> or <s> instead.

.strikeText {
    position: relative;
}
.strikeText::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    height: 0.20rem;   /* Muda o tamanho da espessura da linha para o desejado aqui */
    background-color: red;
}
Lorem <span class="strikeText">IPSUM DOLOR</span> sit amet
<br/>
<h1>Lorem <span class="strikeText">IPSUM DOLOR</span> sit amet</h1>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.