How to style red heart emoji differently from the style of p tag in html?

user_14602896 0
Viewed 832

How do i show my heart emoji in red color? I am not sure how to separate the p tag styling and the heart emoji. Does anyone knows how do i style it differently?

this is the p tag in the html code

<p style="position: absolute;
width: 252px;
height: 15px;
left: 80px;
top: 779px;
padding-top: 190px;
text-align: center;
color: #FFFFFF;">Made with &#10084; by WAP </p>
emoji css html
3 Answers

wrap it in span tags and change the color.

<p>Made with <span style="color: #ff0000;">&#10084;</span> by WAP </p>

user_41012100

You can wrap your emoji using <span> tag. Refer this :

<!DOCTYPE html>
<html>

<head>
  <title>Emoji Test</title>
</head>

<body>
  <p style="position: absolute;
        text-align: center;
        color: black;">Made with <span style="color:red;">&#10084;</span> by WAP </p>
</body>

</html>

user_113273020

I'm assuming you have encoding in utf-8. And thus you can just select the emojis which are compatible with that encoding in the main text i.e. inside:

<p>sample text (your heart emoji)</p>

and it will just print the same way. make sure the encoding is utf-8 and the emoji should be compatible for it , or if it is another encoding then just search on the internet emoji compatible with your respective encoding and paste it inside the text.

for utf-8 the site many devs use is : https://unicode.org/emoji/charts/full-emoji-list.html

user_144050960
Related