Metode Jquery pentru lucrul cu stilurile css

Astăzi, să analizăm metodele folosite pentru stilurile CSS.

Deci, pentru a adăuga un element unui stil, trebuie să utilizați următoarea metodă:







Această instrucțiune va înconjura Div cu o margine albastră.

Ca parametri, numele și valorile folosite în CSS sunt folosite aici: fundal, margine, stil de font, culoare etc.

Dacă trebuie să setați mai multe reguli CSS pentru un element, este mai bine să utilizați următoarea construcție:

Această instrucțiune va schița divul cu o margine albastră, va face ca fundalul să fie roșu și textul să fie aldine.

Rețineți că pentru proprietățile CSS complexe, cum ar fi greutatea fontului și culoarea de fundal, se utilizează echivalentul lui JS: fontWeight, backgroundColor, etc.

Să enumerăm alte metode de lucru cu stiluri:

Această instrucțiune va adăuga clasa principală la ultimul element al paragrafului.

Această instrucțiune va elimina clasa principală din toate paragrafele par.

Această instrucțiune va elimina clasa principală din toate paragrafele dacă este prezentă. Și adăugați această clasă dacă lipsește.

Această instrucțiune vă permite să obțineți linii în partea stângă și mai sus pentru element. Pentru a obține valorile unei anumite proprietăți, trebuie să utilizați următoarele proprietăți: offset.left pentru marginea stângă și offset.top pentru linia din partea de sus.







Această instrucțiune vă permite să obțineți (prima linie) și să setați (a doua linie) înălțimea elementului.

Această instrucțiune vă permite să obțineți (prima linie) și să setați (a doua linie) lățimea elementului.

Un alt exemplu:
var widDiv = $ ("div"), înălțime (); $ ("div.fir") lățime (300);
Prima linie scrie valoarea lățimii primului div la variabila widDiv. A doua instrucțiune stabilește divul de brad de clasă la o lățime de 300 de pixeli.

Aceasta este o caracteristică foarte interesantă a metodelor jQuery: acestea sunt folosite atât pentru specificarea parametrilor (când sunt acceptate două argumente), cât și pentru obținerea valorilor acestor parametri (dacă este trecut un argument).


Să folosim cunoștințele pe care le avem pentru a face un meniu cu file, aici este tipul (faceți clic pe file):
jQuery - CSS

Tab. 1
Tab 2
Tab 3
Tab 4

Deci, codul HTML al paginii este următorul:


După cum puteți vedea, toate filele au același stil, definit de clasa vkl, iar fila selectată are clasa selectată.

Aspect pe pagina style.css

Există cea mai interesantă funcție, și anume funcția chang ():


Deci, cum funcționează această funcție? În primul rând, căutăm un element care are o clasă selectată și această clasă este eliminată din ea. Apoi (a doua linie), clasa selectată este adăugată la elementul selectat (este găsit de id-ul transmis funcției ca parametru s). Este atât de simplu.

În următoarea lecție, învățăm cum să folosim jQuery pentru a insera bucăți întregi de cod html într-o pagină și pentru a le manipula.







Articole similare

Pagina anterioară

Pagina următoare

Trimiteți-le prietenilor: