Emoji using HTML
Emojis are commonly used in today’s computer-based communication. We often find an emoji font face pre-installed on many devices which is necessary for the rendering of the emoji symbol. In the following EXAMPLE, I will try to discuss some key moments that enabled emojis to circulate through our network and society. if you want to display emojis on your website, you can use the HTML entity.
<!doctype html>
<title>Emoji</title>
<style>
.media {
display: flex;
align-items: flex-start;
background: #F6F3EB;
padding: 1em;
border-radius: 3px;
max-width: 500px;
}
.media-object {
margin-right: .4em;
font-size: 4em;
}
.media-body {
flex: 1;
}
.media-heading {
margin: 0 0 .5em;
}
</style>
<h2>Face Emoji</h2>
<div class="media">
<div class="media-object">😎</div>
<div class="media-object">😂</div>
<div class="media-object">😍</div>
<div class="media-object">😱</div>
<div class="media-object">😋</div>
<div class="media-object">😷</div>
</div>
<h2>Animal-Bird Emoji</h2>
<div class="media">
<div class="media-object">🐎 </div>
<div class="media-object">🐓</div>
<div class="media-object">🐉</div>
<div class="media-object">🐦</div>
<div class="media-object">🐵</div>
<div class="media-object">🐌</div>
</div>
<h2>Flower Emoji</h2>
<div class="media">
<div class="media-object">🌹 </div>
<div class="media-object">🌲 </div>
<div class="media-object">🍁</div>
<div class="media-object">💐</div>
<div class="media-object">🌺</div>
<div class="media-object">🌱</div>
</div>
Leave a Reply