+ 2
Question about headers (HTML).
Does anyone know how I can put an image in a header so that it shows up in the corner as a logo? Thanks for reading guys! Domino :-)
4 Answers
+ 2
<!DOCTYPE html>
<html>
<head>
<title>Logo in Header</title>
<style>
#logo {
position: absolute;
top: 10px;
left: 10px;
width: 100px; /* Adjust the width as needed */
height: auto; /* Maintain aspect ratio */
}
</style>
</head>
<body>
<header>
<img src="logo.png" alt="Company Logo" id="logo">
<h1>Welcome to our website</h1>
</header>
<!-- Rest of your webpage content -->
</body>
</html>
+ 1
When you say header, do you mean like the icon that is beside the title?
It's called a favicon and you can see this from W3 Schools om how to get it working:
https://www.w3schools.com/html/html_favicon.asp
+ 1
Refer this https://code.sololearn.com/WHmU8sUTFIMb/?ref=app
Replace "path/to/your/logo.png" with the actual path to your logo image. The img element with the class "logo" will be floated to the left, displaying the logo in the corner, and other header content will be displayed next to it. Adjust the height, width, and other styles to fit your logo and header design preferences.
0
You will need to reduce the size of your image as small as possible and you will be able to write text close to it because images are inline element