AgerNic.com/ro
WEB DEVELOPER SITE, HTML, CSS, PHP, SQL
Tutorial

Fundaluri Background imagine CSS


Next Page >>
HTML images

CSS Tutorial » Fundaluri Background imagine CSS

Proprietățile de fundal CSS sunt utilizate pentru a adăuga efecte de fundal pentru elemente.

CSS oferă diverse proprietăți pentru proiectarea fundalului unei pagini web, inclusiv colorarea fundalului, plasarea imaginilor în fundal și gestionarea poziționării acestora etc.

În aceste capitole, veți afla despre următoarele proprietăți de fundal CSS:

  • culoare de fundal
  • imagine de fundal
  • fundal-repetare
  • atașament de fundal
  • fundal-poziție
  • fundal (proprietate de stenografie)

 

Adaugare culoare de fundal in CSS

Proprietatea background-color este utilizată pentru a seta culoarea de fundal a unui element sau a intregii pagini web.

Următorul exemplu arată cum să setați culoarea de fundal pentru întreaga pagină.

Ejemplo
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>Setarea culoarea de fundal a unui element în CSS</title>
<style>
body {
background-color: #F5EFB1;
}
h1 {
background-color: #87DABF;
}
</style>
</head>
<body>
<h1>Background Color Demo</h1>
<p>CSS definește cinci proprietăți pentru a seta fundalul fiecărui element <br />
Următorul exemplu prezintă o pagină web cu o culoare de fundal gri deschis: <br />
CSS și care stochează toate imaginile utilizate în proiectarea paginilor.<br />
Se aplică pentru: Toate elementele<br />
Valoarea initiala: transparent<br />
Proprietate: background-color<br />
Valori: color | transparent | inherit</p>
</body>
</html>

Valorile culorilor din CSS sunt cel mai adesea specificate în următoarele formate:

  • un nume de culoare - precum "red"
  • o valoare HEX - precum "#ff0000"
  • o valoare RGB - precum "rgb(255, 0, 0)"

Tags: fundaluri css pentru pagini web, animat, gradient, exemplu, html, culoare, definiție pentru html css

 

Adaugare imagine de fundal - background

Proprietatea background-image setează o imagine ca fundal al unui element HTML.

Să vedem următorul exemplu care setează imaginea de fundal pentru întreaga pagină.

Ejemplo
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>Proprietatea background-image setează o imagine ca fundal al unui element HTML</title>
<style>
body {
background-image: url("https://www.agernic.com/uploads/landscape_beach.jpg");
}
</style>
</head>
<body>
<h1>Proprietatea background-image setează o imagine ca fundal al unui element HTML</h1>
<p>CSS definește cinci proprietăți pentru a seta fundalul fiecărui element <br />
Următorul exemplu prezintă o pagină web cu o culoare de fundal gri deschis: <br />
CSS și care stochează toate imaginile utilizate în proiectarea paginilor.<br />
Se aplica pentru: Toate elementele<br />
Valoare inițială: transparent<br />
Proprietate: background-color<br />
Valori: color | transparent | inherit</p>
</body>
</html>
Notă: Atunci când aplicați imaginea de fundal unui element, asigurați-vă că imaginea pe care o alegeți nu afectează lizibilitatea conținutului text al elementului.

În mod implicit, browserul repetă sau acoperă imaginea de fundal atât pe orizontală, cât și pe verticală pentru a umple întreaga zonă a unui element. Puteți controla acest lucru cu proprietatea background-repeat.

 

Repetarea imagini pe fundal

Proprietatea background-repeat vă permite să controlați modul în care o imagine de fundal este repetată sau plasată în fundalul unui element. Puteți seta o imagine de fundal să se repete pe verticală (axa y), orizontal (axa x), în ambele direcții sau în nici una dintre direcții.

Să încercăm următorul exemplu care demonstrează cum se setează fundalul de gradient pentru o pagină web repetând imaginea decupată orizontal de-a lungul axei x.

În mod similar, puteți utiliza valoarea de repetare-y pentru a repeta imaginea de fundal pe verticală de-a lungul axei y, sau valoarea fără repetare pentru a evita repetarea totală.

Ejemplo
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>Setări orizontale pentru repetarea fundalului în CSS</title>
<style>
body {
background-image: url("https://www.agernic.com/uploads/smiley.gif");
background-repeat: repeat-x;
}
</style>
</head>
<body>
<h1>Proprietatea background-image setează o imagine ca fundal al unui element HTML</h1>
<p>CSS definește cinci proprietăți pentru a seta fundalul fiecărui element <br />
Următorul exemplu prezintă o pagină web cu o culoare de fundal gri deschis: <br />
CSS care stochează toate imaginile utilizate în proiectarea paginilor.<br />
Se aplica pentru: Todos los elementos<br />
valoarea initiala: transparent<br />
Propietatea: background-color<br />
Valoarea: color | transparent | inherit</p>
</body>
</html>

 

Ce este css, Inserare imagine fundal html, Culoare fundal html, Fonturi css, Imagine background HTML, Chenar html,

Inserare imagine fundal html, Fonturi css, Fundaluri Background imagine CSS, fundaluri css pentru pagina web

HTML culoare
Tags: Inserare imagine fundal html

Online Editor
ONLINE EDITOR

news templates


COLOR PICKER

news templates
This tool makes it easy to create, adjust, and experiment with custom colors for the web.


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


CSS HTML Layout
news templates
Find here examples of creative and unique website layouts.


Free CSS HTML Menu
news templates
Find here examples of creative and unique website CSS HTML menu.


Online Editor
ONLINE EDITOR

news templates


COLOR PICKER

news templates
This tool makes it easy to create, adjust, and experiment with custom colors for the web.


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


CSS HTML Layout
news templates
Find here examples of creative and unique website layouts.


Free CSS HTML Menu
news templates
Find here examples of creative and unique website CSS HTML menu.