Inserare imagine fundal, background HTML
Īn HTML, putem ad?uga cu u?urin?? imaginea de fundal īn documentul HTML care urmeaz? s? fie afi?at pe o pagin? web folosind urm?toarele dou? metode diferite:
Utilizarea atributului Background (Etichet? HTML)
Utilizarea unei foi de stil interne
Dac? dorim s? ad?ug?m imaginea de fundal īn documentul HTML folosind atributul Background, atunci trebuie s? urm?m pa?ii de mai jos. Folosind ace?ti pa?i, putem vizualiza cu u?urin?? o imagine pe o pagin? web:
Īn primul rānd, trebuie s? tast?m codul HTML īn orice editor de text sau s? deschidem fi?ierul HTML existent īn editorul de text īn care dorim s? utiliz?m atributul de fundal.
<body background="image_fisier.jpg">
Exemplu:
Pute?i īncerca s? rula?i urm?torul cod pentru a observa imaginea pe fundal
<!DOCTYPE html>
<html>
<head>
<title>Inserare imagine fundal, background HTML - example</title>
</head>
<body background="https://www.agernic.com/uploads/css-background-image-size-fit-full-screen.jpg">
<h2>Inserare imagine fundal, background HTML</h2>
<p>Inserare imagine fundal, background HTML</p>
</body>
</html>
Utilizarea unei foi de stil interne pentru inserare imagine fundal HTML
Folosirea foii de stil (<style>) CSS intern.Dac? dorim s? ad?ug?m imaginea de fundal īn documentul HTML folosind CSS intern, atunci trebuie s? urm?m pa?ii de mai jos.
Folosind ace?ti pa?i, putem vizualiza cu u?urin?? o imagine pe o pagin? web, exemplu:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS background image size to fit full screen responsive - how to create - example</title>
<style>
body {
/* Location of the image for page */
background-image: url(https://www.agernic.com/uploads/css-background-image-size-fit-full-screen.jpg);
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
}
h1,h2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: bold;
}
#container { width: auto; margin: 50px auto; padding: 20px; background: white; -moz-box-shadow: 0 0 20px black; -webkit-box-shadow: 0 0 20px black; box-shadow: 0 0 20px black; }
</style>
<head>
<body>
<div id="container">
<h1>CSS background image size to fit full screen - how to create - example</h1>
This is a way to add background image for a web page using html. <br />
In this case I used:<br />
<strong>html</strong>
to cover the entire background. <br />
</div>
<html/>
</body>
This tool makes it easy to create, adjust, and experiment with custom colors for the web.

Magnews2 is a modern and creative free magazine and news website template that will help you kick off your online project in style.

Find here examples of creative and unique website layouts.

Find here examples of creative and unique website CSS HTML menu.