1. Forum
  2. Usenet
  3. COMP.INFO.WWW.AUTHORING.S

  • Override Global Declaration

    From =?UTF-8?B?8J+YiSBHb29kIEd1eSDwn5iJ?@21:1/5 to Mike Copeland on Thu Oct 8 23:10:56 2020
    This is a multi-part message in MIME format.
    On 08/10/2020 22:23, Mike Copeland wrote:
    How do I override a global setting for a specific CSS attribute? For example, I have a default declaration of
    a:link { color: Orange; }
    but I have a specific declaration of
    .c4 { background-image: url("bg2.jpg"); }
    to which I want to override the "a:link" declaration color to "Black".
    How do I do this? TIA



    Inline style might do the trick.

    ||

    |Google Website <www.google.com> |

    ||

    <a href="www.google.com" style="color: black;">Google Website</a>

    --

    With over 1.2 billion devices now running Windows 10, customer
    satisfaction is higher than any previous version of windows.


    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body text="#008000" bgcolor="#faf0e6">
    <div class="moz-cite-prefix">On 08/10/2020 22:23, Mike Copeland
    wrote:<br>
    </div>
    <blockquote type="cite"
    cite="mid:MPG.39e9313af4275cbc9896f0@news.eternal-september.org">
    <pre class="moz-quote-pre" wrap=""> How do I override a global setting for a specific CSS attribute? For
    example, I have a default declaration of
    a:link { color: Orange; }
    but I have a specific declaration of
    .c4 { background-image: url("bg2.jpg"); }
    to which I want to override the "a:link" declaration color to "Black".
    How do I do this? TIA



    </pre>
    </blockquote>
    <p>Inline style might do the trick.</p>
    <p><code>
    <pre><a href="www.google.com" style="color: black;">Google Website</a> </pre>
    </code></p>
    <div class="moz-signature">
    <blockquote type="cite">&lt;a href="<a class="moz-txt-link-abbreviated" href="http://www.google.com">www.google.com</a>" style="color:
    black;"&gt;Google Website&lt;/a&gt;</blockquote>
    <br>
    </div>
    <div class="moz-signature">-- <br>
    <div style="background-color: blue; color: yellow; font-weight:
    bolder; display: grid; align-items: center; justify-items:
    center; min-height: 80px; font-size: 1.2em; border-radius: 50px;
    ">
    <p>With over 1.2 billion devices now running Windows 10,
    customer satisfaction is higher than any previous version of
    windows.</p>
    </div>
    </div>
    </body>
    </html>

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Mike Copeland@21:1/5 to All on Thu Oct 8 14:23:28 2020
    How do I override a global setting for a specific CSS attribute? For example, I have a default declaration of
    a:link { color: Orange; }
    but I have a specific declaration of
    .c4 { background-image: url("bg2.jpg"); }
    to which I want to override the "a:link" declaration color to "Black".
    How do I do this? TIA



    --
    This email has been checked for viruses by Avast antivirus software. https://www.avast.com/antivirus

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From James Kirk@21:1/5 to Mike Copeland on Thu Oct 8 18:35:35 2020
    In Message: <MPG.39e9313af4275cbc9896f0@news.eternal-september.org>
    Mike Copeland <mrc2323@cox.net> wrote:

    How do I override a global setting for a specific CSS attribute?
    For example, I have a default declaration of

    a:link { color: Orange; }

    but I have a specific declaration of

    .c4 { background-image: url("bg2.jpg"); }

    to which I want to override the "a:link" declaration color to
    "Black". How do I do this? TIA

    Specificity - CSS: Cascading Style Sheets | MDN https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

    Presuming html is something similar:

    <a href="/" class="c4">:link class c4</a>

    One of many possibilities:

    a:link.c4 { color:black; }

    --
    J𝕒𝕞𝕖𝕤 𝕂𝕚𝕣𝕜

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Evertjan.@21:1/5 to James Kirk on Fri Oct 9 14:11:15 2020
    James Kirk <noneya.invalid@gmail.com> wrote on 09 Oct 2020 in comp.infosystems.www.authoring.stylesheets:

    In Message: <MPG.39e9313af4275cbc9896f0@news.eternal-september.org>
    Mike Copeland <mrc2323@cox.net> wrote:

    How do I override a global setting for a specific CSS attribute?
    For example, I have a default declaration of

    a:link { color: Orange; }

    but I have a specific declaration of

    .c4 { background-image: url("bg2.jpg"); }

    to which I want to override the "a:link" declaration color to
    "Black". How do I do this? TIA

    Specificity - CSS: Cascading Style Sheets | MDN https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

    Presuming html is something similar:

    <a href="/" class="c4">:link class c4</a>

    One of many possibilities:

    a:link.c4 { color:black; }

    https://stackoverflow.com/questions/13735635/css-styling-links-using-ids- and-classes

    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Mike Copeland@21:1/5 to All on Fri Oct 9 11:08:42 2020
    In article <XnsAC5190532E601eejj99@194.109.6.166>, exxjxw.hannivoort@inter.nl.net says...

    James Kirk <noneya.invalid@gmail.com> wrote on 09 Oct 2020 in comp.infosystems.www.authoring.stylesheets:

    In Message: <MPG.39e9313af4275cbc9896f0@news.eternal-september.org>
    Mike Copeland <mrc2323@cox.net> wrote:

    How do I override a global setting for a specific CSS attribute?
    For example, I have a default declaration of

    a:link { color: Orange; }

    but I have a specific declaration of

    .c4 { background-image: url("bg2.jpg"); }

    to which I want to override the "a:link" declaration color to
    "Black". How do I do this? TIA

    Specificity - CSS: Cascading Style Sheets | MDN https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

    Presuming html is something similar:

    <a href="/" class="c4">:link class c4</a>

    One of many possibilities:

    a:link.c4 { color:black; }

    https://stackoverflow.com/questions/13735635/css-styling-links-using-
    ids-and-classes

    My apologizes: I'm confused by these answers, and my attempts to use
    the information do not work. Here's my code, which fails to apply a
    "White" color to the text of Table #2. Please advise; TIA
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>2 Table Test</title>
    <link rel="StyleSheet" type="text/css" href="main16.css">
    <style>
    .body { margin: 0px 30px 120px 30px;
    font-family: Courier; font-size: 1.5em; color: white;
    background-color: Black;
    }
    .b8 {
    border-color: black; border-style: outset;
    border-width: 15px; font-size: 110%;
    font-weight: bold; width: 100%;
    }
    td.idx { font-size: 75%; padding-left: 20px; }
    .c3 { color: Orange; background-color: Black;); }
    .c4 { color: White; background-color: Black; }
    div { margin-left: 50px; margin-right: 50px; }
    a:link { color: Orange; }
    a:link.c4 { color: Black; }
    a:visited { color: LightGreen; }
    a:hover { color: LightBlue; }
    a:active { color: Gray; }
    </style>
    </head>
    <body class="body">
    <div>
    <h3 class="center">Table #1 - Orange Text</h3>
    <table class="b8 c3">
    <tr>
    <td class="idx"><a href="#LPC">Item 1</a></td>
    <td class="idx"><a href="#MRC">Item 2</a></td>
    <td class="idx"><a href="#FAM">Item 3</a></td>
    </tr>
    </table>
    </div>
    <div>
    <h3 class="center">Table #2 - White Text???</h3>
    <table class="b8 c4">
    <tr>
    <td class="idx c4"><a href="#TAUCK2004">Picture 1</a></td>
    <td class="idx c4"><a href="#CHI2007">Picture 2</a></td>
    <td class="idx c4"><a href="#MED2008">Picture 3</a></td>
    </tr>
    </table>
    </div>
    </body></html>

    --
    This email has been checked for viruses by Avast antivirus software. https://www.avast.com/antivirus

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From =?UTF-8?B?8J+YiSBHb29kIEd1eSDwn5iJ?@21:1/5 to Mike Copeland on Fri Oct 9 19:32:37 2020
    This is a multi-part message in MIME format.
    td.c4 a:link {
                color: White;
                background-color: Black;
            }



    On 09/10/2020 19:08, Mike Copeland wrote:

    My apologizes: I'm confused by these answers, and my attempts to use
    the information do not work. Here's my code, which fails to apply a
    "White" color to the text of Table #2. Please advise; TIA
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>2 Table Test</title>
    <link rel="StyleSheet" type="text/css" href="main16.css">
    <style>
    .body { margin: 0px 30px 120px 30px;
    font-family: Courier; font-size: 1.5em; color: white;
    background-color: Black;
    }
    .b8 {
    border-color: black; border-style: outset;
    border-width: 15px; font-size: 110%;
    font-weight: bold; width: 100%;
    }
    td.idx { font-size: 75%; padding-left: 20px; }
    .c3 { color: Orange; background-color: Black;); }
    .c4 { color: White; background-color: Black; }
    div { margin-left: 50px; margin-right: 50px; }
    a:link { color: Orange; }
    a:link.c4 { color: Black; }
    a:visited { color: LightGreen; }
    a:hover { color: LightBlue; }
    a:active { color: Gray; }
    </style>
    </head>
    <body class="body">
    <div>
    <h3 class="center">Table #1 - Orange Text</h3>
    <table class="b8 c3">
    <tr>
    <td class="idx"><a href="#LPC">Item 1</a></td>
    <td class="idx"><a href="#MRC">Item 2</a></td>
    <td class="idx"><a href="#FAM">Item 3</a></td>
    </tr>
    </table>
    </div>
    <div>
    <h3 class="center">Table #2 - White Text???</h3>
    <table class="b8 c4">
    <tr>
    <td class="idx c4"><a href="#TAUCK2004">Picture 1</a></td>
    <td class="idx c4"><a href="#CHI2007">Picture 2</a></td>
    <td class="idx c4"><a href="#MED2008">Picture 3</a></td>
    </tr>
    </table>
    </div>
    </body></html>


    --

    With over 1.2 billion devices now running Windows 10, customer
    satisfaction is higher than any previous version of windows.


    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body text="#008000" bgcolor="#faf0e6">
    <div class="moz-cite-prefix"><br>
    </div>
    <div class="moz-cite-prefix">
    <blockquote type="cite">td.c4 a:link {<br>
                color: White;<br>
                background-color: Black;<br>
            }</blockquote>
    <br>
    </div>
    <div class="moz-cite-prefix"><br>
    </div>
    <div class="moz-cite-prefix"><br>
    </div>
    <div class="moz-cite-prefix">On 09/10/2020 19:08, Mike Copeland
    wrote:<br>
    </div>
    <blockquote type="cite"
    cite="mid:MPG.39ea5519873bda829896f1@news.eternal-september.org"><br>
    <pre class="moz-quote-pre" wrap="">
    My apologizes: I'm confused by these answers, and my attempts to use
    the information do not work. Here's my code, which fails to apply a
    "White" color to the text of Table #2. Please advise; TIA
    &lt;!DOCTYPE html&gt;
    &lt;html lang="en"&gt;
    &lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;title&gt;2 Table Test&lt;/title&gt;
    &lt;link rel="StyleSheet" type="text/css" href="main16.css"&gt;
    &lt;style&gt;
    .body { margin: 0px 30px 120px 30px;
    font-family: Courier; font-size: 1.5em; color: white;
    background-color: Black;
    }
    .b8 {
    border-color: black; border-style: outset;
    border-width: 15px; font-size: 110%;
    font-weight: bold; width: 100%;
    }
    td.idx { font-size: 75%; padding-left: 20px; }
    .c3 { color: Orange; background-color: Black;); }
    .c4 { color: White; background-color: Black; }
    div { margin-left: 50px; margin-right: 50px; }
    a:link { color: Orange; }
    a:link.c4 { color: Black; }
    a:visited { color: LightGreen; }
    a:hover { color: LightBlue; }
    a:active { color: Gray; }
    &lt;/style&gt;
    &lt;/head&gt;
    &lt;body class="body"&gt;
    &lt;div&gt;
    &lt;h3 class="center"&gt;Table #1 - Orange Text&lt;/h3&gt;
    &lt;table class="b8 c3"&gt;
    &lt;tr&gt;
    &lt;td class="idx"&gt;&lt;a href="#LPC"&gt;Item 1&lt;/a&gt;&lt;/td&gt;
    &lt;td class="idx"&gt;&lt;a href="#MRC"&gt;Item 2&lt;/a&gt;&lt;/td&gt;
    &lt;td class="idx"&gt;&lt;a href="#FAM"&gt;Item 3&lt;/a&gt;&lt;/td&gt;
    &lt;/tr&gt;
    &lt;/table&gt;
    &lt;/div&gt;
    &lt;div&gt;
    &lt;h3 class="center"&gt;Table #2 - White Text???&lt;/h3&gt;
    &lt;table class="b8 c4"&gt;
    &lt;tr&gt;
    &lt;td class="idx c4"&gt;&lt;a href="#TAUCK2004"&gt;Picture 1&lt;/a&gt;&lt;/td&gt;
    &lt;td class="idx c4"&gt;&lt;a href="#CHI2007"&gt;Picture 2&lt;/a&gt;&lt;/td&gt;
    &lt;td class="idx c4"&gt;&lt;a href="#MED2008"&gt;Picture 3&lt;/a&gt;&lt;/td&gt;
    &lt;/tr&gt;
    &lt;/table&gt;
    &lt;/div&gt;
    &lt;/body&gt;&lt;/html&gt;

    </pre>
    </blockquote>
    <p><br>
    </p>
    <div class="moz-signature">-- <br>
    <div style="background-color: blue; color: yellow; font-weight:
    bolder; display: grid; align-items: center; justify-items:
    center; min-height: 80px; font-size: 1.2em; border-radius: 50px;
    ">
    <p>With over 1.2 billion devices now running Windows 10,
    customer satisfaction is higher than any previous version of
    windows.</p>
    </div>
    </div>
    </body>
    </html>

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)