'How can i add background image as a Logo for my html heading

How can I add a background image for my heading(site name) ?

ps: I am only using html and css.

htmlcss


Solution 1:[1]

Do you want something like this?

.wrapper {display:flex; flex-direction:row; align-items: center; font-size:40px;}
.wrapper span {margin:20px;}

.logo {height:100px; width:100px; background:url("https://picsum.photos/100/100");}
<div class="wrapper">
  <div class="logo"></div>
  <span>My Website</span>
</div>

Solution 2:[2]

From what I understand from your description

.head_back {
  background-image:url('http://commondatastorage.googleapis.com/codeskulptor-assets/lathrop/nebula_blue.s2014.png');
  padding:5px;
}

.heading {
  color:yellow;
}
<div class="head_back">
  <h2 class="heading">My Website</h2>
</div>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Deadpool
Solution 2 mohit maroliya

Related Questions