Het ontwerp van uw site: CSS Achtergronden

Het ontwerp van een website is net zo (zo niet meer) belangrijker dan de functionaliteit en bruikbaarheid. Het is van fundamenteel belang voor een succesvolle website te sterk visueel als foundationally.

Laten we een kort moment om de Sixtijnse Kapel te bespreken om mijn punt te illustreren. De kapel zelf werd gebouwd om lang mee en is foundationally geluid. Echter, de kapel is niet alleen beroemd vanwege zijn functionaliteit. Michelangelo's beroemde schilderij berust op het plafond van de kapel en laat het meeste ontzag voor artistieke schoonheid. Het resultaat van deze combinatie is gewoon een van de grootste kapellen van de wereld.

Websites kunnen bestaan een beroep op hetzij de aanwezigheid van grote fantastische ontwerp of code, maar om te gedijen voor websites is het essentieel om de twee te combineren.

In deze post wil ik graag een kijkje nemen op de belangrijke onderdeel van het ontwerp en de codering van vergelijking met CSS, meer specificeren de CSS achtergrond van het pand.

W3Schools definieert de CSS Achtergrond van het pand als: "een afgekorte eigenschap voor het instellen van alle achtergrond eigenschappen in een verklaring." Merk op dat de meeste gevonden waarden in de achtergrond het pand kan worden gebruikt als hun eigendom. De voorbeelden hieronder zullen alleen worden met behulp van de verkorte versie van de achtergrond van het pand. Een nadeel aan het gebruik van alleen stenografie is dat het niet groot is voor het debuggen of ontdekken spelfouten

Laten we beginnen door te kijken naar de meest fundamentele waarde, een die dient eerst te worden op elke achtergrond goed: Kleur.

body {
background: #000000;
}

Behulp van eenvoudige kleurwaarde, kan een achtergrond worden zeer duidelijk en eenvoudig. Deze eenvoud kan nuttig zijn voor vele websites. Houd in gedachten dat uitstekend design techniek betekent niet noodzakelijk flitsende beelden en Web 2.0 schuinhoekig overal. Naast de kleuren die in de achtergrond het pand, kunt u ook gebruik maken van de waarde van transparant. De transparante waarde wordt voornamelijk gebruikt op de achtergrond in de site, zoals binnen divs en tabellen, en niet vaak op de achtergrond als een lichaam gevonden hier.

De kleur waarde moet altijd een ankerpunt worden in uw achtergrond eigendom. Zelfs als u een afbeelding in je achtergrond, dat overspant 1000 + pixels, bent u nog steeds te willen een kleur waarde achter het zo dat, terwijl je achtergrond afbeelding wordt het laden van de gebruiker niet een spierwitte achtergrond zie je mooi donker website.

Vervolgens kunt bespreken achtergrond een andere belangrijke waarde, vooral in web van vandaag wereld, de background-image.

body {
background: #000000 url(images/yourimage.jpg) repeat fixed top;
}

Foto's kunnen worden gebruikt in een verscheidenheid van verschillende manieren, en in samenhang met waarden als background-attachment, background-position en background-repeat. Er is geen einde aan wat u kunt doen om uw lichaam achtergrond. Terwijl u kunt een afbeelding in je CSS zonder toevoeging van deze andere waarden is het essentieel dat de vier waarden blijven bij elkaar.

De voorbeelden hierboven en hieronder tonen slechts een paar manieren waarop u kunt de background-image waarde te gebruiken met behulp van de background-repeat waarde. Eenvoudige patroon achtergronden met de background-repeat waarde ingesteld te herhalen worden geïllustreerd hierboven. Ingewikkelder versies van de waarde wordt ingesteld op repeat-x kan hieronder zien. Centered beelden kunnen worden bereikt door de vaststelling van de waarde no-repeat, zoals de mooie donkere website, de achtergrond-repeat en background-image ondersteund door de background-position en background-attachment waarden steun in de aandacht uw sites stijl.