发表新帖
发表新帖

HTML: Changing colors of specific words in a string of text

后端 未结
关注
8 1706
轻奢々
轻奢々 2020-12-02 18:17

I have the below message (slightly changed):

\"Enter the competition by January 30, 2011 and you could win up to $$$$ — including amazing summer tri

相关标签:
8条回答
  • 滥情空心
    2020-12-02 18:22

    use spans. ex) <span style='color: #FF0000;'>January 30, 2011</span>

    0 讨论(0)
  • 误落风尘
    2020-12-02 18:26 
    <p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">
    Enter the competition by <span style="color:#FF0000">January 30, 2011</span> and you could win up to $$$$ — including amazing <span style="color:#0000A0">summer</span> trips!
</p>

    The span elements are inline an thus don't break the flow of the paragraph, only style in between the tags.

    0 讨论(0)
  • 轮回少年
    2020-12-02 18:36

    You can also make a class:

    <span class="mychangecolor"> I am in yellow color!!!!!!</span>

    then in a css file do: 

    .mychangecolor{ color:#ff5 /* it changes to yellow */ }
    0 讨论(0)
  • 我在风中等你
    2020-12-02 18:38 
    <p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">
  Enter the competition by 
  <span style="color: #ff0000">January 30, 2011</span>
  and you could win up to $$$$ — including amazing 
  <span style="color: #0000a0">summer</span> 
  trips!
</p>

    Or you may want to use CSS classes instead:

    <html>
  <head>
    <style type="text/css">
      p { 
        font-size:14px; 
        color:#538b01; 
        font-weight:bold; 
        font-style:italic;
      }
      .date {
        color: #ff0000;
      }
      .season { /* OK, a bit contrived... */
        color: #0000a0;
      }
    </style>
  </head>
  <body>
    <p>
      Enter the competition by 
      <span class="date">January 30, 2011</span>
      and you could win up to $$$$ — including amazing 
      <span class="season">summer</span> 
      trips!
    </p>
  </body>
</html>
    0 讨论(0)
  • 别跟我提以往
    2020-12-02 18:43

    You could use the longer boringer way 

    <p style="font-size:14px; color:#538b01; font-weight:bold; font-style:italic;">Enter the competition by</p><p style="font-size:14px; color:#ff00; font-weight:bold; font-style:italic;">summer</p>

    you get the point for the rest

    0 讨论(0)
  • 青春惊慌失措
    2020-12-02 18:46

    Tailor this code however you like to fit your needs, you can select text? in the paragraph to be what font or style you need!:

    <head>
<style>
p{ color:#ff0000;font-family: "Times New Roman", Times, serif;} 
font{color:#000fff;background:#000000;font-size:225%;}
b{color:green;}
</style>
</head>
<body>
<p>This is your <b>text. <font>Type</font></strong></b>what you like</p>
</body>
    0 讨论(0)
 看不清?
提交回复
热议问题