munca css cu poze (imagini)

Imaginile sunt foarte puternice mijloace de creștere a eficienței unei pagini web (cu excepția cazului, desigur, cu o minte pentru a le folosi). Imaginea corect formatat îmbunătățește semnificativ lizibilitatea și claritatea informațiilor furnizate pe site.

Utilizați dimensiunea atribute de imagine: înălțime, lățime. Ele definesc înălțimea și lățimea imaginii și browser-ul atunci când încărcarea unei pagini Web „știe“ cât de mult spațiu aveți nevoie pentru a face o fotografie. Dacă aceste date nu indică faptul că pagina este încărcată va fi „scuturarea“ pagina până când este complet încărcat.

Nu neglijați atributul alt. care conține descrierea de text a imaginii. Acum, acest atribut este utilizat foarte activ de motoarele de căutare pentru a căuta imagini. Dacă este corect pentru a descrie o imagine, puteți obține aflux suplimentar de vizitatori care văd imaginile de pe site-urile (și există mai multe și mai mult).

Imaginile tag poate fi setat folosind atributul frame chenar grosime în jurul imaginii. Dar este un design mult mai flexibilă a imaginilor cadru dă CSS:

  • none - nici un cadru;
  • ascuns - cadru invizibil;
  • frame punct - punctată;
  • punctată - punctat cadru;
  • solid - line;
  • dublu - linie dublă;
  • canelură - cadru de circuit încastrat (3D-efect);
  • creasta - reliefează deasupra conturului (3D-efect);
  • platcă - cadru încastrat suprafață interioară (3D-efect);
  • început - suprafața interioară a actelor de cadru (3D-efect).

utilizarea de frontieră EXEMPLU în imagini: Exemplul №13

CSS vă permite să definiți elementele individuale ale cadrului:

  • border-top - partea superioară a cadrului;
  • border-bottom - cadrul inferior;
  • frontieră-dreapta - partea dreaptă a cadrului;
  • border-stânga - partea stângă a cadrului.

Cu ajutorul acestor patru parametri pot fi setate pentru valorile individuale ale cadrului. Pentru valorile parametrilor trebuie specificate grosimea, tipul și culoarea cadrului.

Exemplu de individ Fotografie laturile chenarului: Exemplul №14

HTML-cod al paginii nu sa schimbat în comparație cu exemplul anterior, conectat numai la o altă foaie de stil.

După cum puteți vedea, orice rame de formatare pot fi combinate pentru a formata simultan câteva cadre. Notă clasa img2 - în care primele valori de referință stabilite pentru toate laturile cadrului, apoi specificați formatarea pentru părți, în cazul în care aceasta este diferită de cea principală.

articole similare