how do i overload underline and italic to a highlighting in yellow and red

Comments

8 comments

  • Avatar
    rawbytz

    Change:  .contentUnderline
    To:  .content u 

    Change: .contentItalic
    To:  .content i 

  • Avatar
    Arthur

    rawbytz, thanks a lot!!! it works!!!

    :)

  • Avatar
    Eberhard

    But how does it work then if one would like to combine “underline“, “bold“ and „italic“?

    I‘ve had some definitions for ...

    span.contentUnderline

    span.contentUnderline.contentBold

    span.contentUnderline.contentItalic

    span.contentUnderline.contentBold.contentItalic

    I‘ve tried ...

    .content u

    .content u b

    . content u i

    . content u i b 

    ... but obviously “.content u i“ is over-painting “.content u i b“.

    Thanks for any suggestion!

  • Avatar
    Eberhard

    That‘s what I‘m having thus far ...

    —-

    /*  UNDERLINE  */   

      .content u

      {

        text-decoration: none !important;

        color: black !important;

        background-color: gold !important;

        font-family: inherit !important;

        font-weight: inherit !important;

        font-size: inherit !important;

      }                                       

     

    /*  UNDERLINE + BOLD  */

      .content u b

      {

        font-size: 120%;

        line-height: 2.0;

            

        background-color: #0000a4 !important;

        padding: 3px 10px 3px 10px;

        box-shadow: 3px 3px 3px #B0B0B0;

        margin-top: 10px;

        margin-bottom: 10px;

        color: white !important;

        text-decoration: none !important;

      }

     

    /*  UNDERLINE + BOLD + ITALIC  */

      .content u i b

      {

        font-size: 100%;

        line-height: 2.0;

        

        background-color: #DC143C !important;

        padding: 3px 10px 3px 10px;

        box-shadow: 3px 3px 3px #E6E6E6;

        margin-top: 10px;

        margin-bottom: 10px;

        color: white !important;

        text-decoration: none !important;

      }

     

    /*  UNDERLINE + ITALIC  */

      .content u i

      {

        font-size: 100%;

        line-height: 2.0;

        

        background-color: #FFD700 !important;

        padding: 3px 10px 3px 10px;

        box-shadow: 3px 3px 3px #E6E6E6;

        margin-top: 10px;

        margin-bottom: 10px;

        color: black !important;

        text-decoration: none !important;

      }   

  • Avatar
    Tobias

    "highlighting (yellow, red) via Chrome Stylus Plugin:"

    Sorry for the newbie question but where do I put these code snippets? Thanks!

  • Avatar
    Tobias

    Ah, I found it. We need a browser extension called stylish

    https://userstyles.org/ 

  • Avatar
    rawbytz

    @muschelklaus  

    Highly recommend you install 'Stylus' and NOT 'Stylish'. 

    Stylus is actually a clone of an earlier no spyware version of Stylish.

     

  • Avatar
    Tobias

    Thank you for the heads up. 

Please sign in to leave a comment.