Creați o pagină cu un cursor frumos
În această lecție vom crea o pagină cu un cursor care vă poate bloca fotografiile cu efectul dorit. Un astfel de cursor va arăta foarte impresionant atât pe pagina principală, cât și pe antetul site-ului. Și nu va fi deloc dificil! După ce ai făcut o dată și ai înțeles principiul, poți folosi această tehnică în lucrările tale așa cum dorești.
2. Folosind secțiunea tag, creați un container în interiorul etichetei și alocați-l id = "wrapper". În acest mod putem controla lățimea paginii noastre.
3. Acum folosim o altă etichetă HTML5: eticheta antetului. Puneți-l în interiorul containerului nostru. În interiorul acestuia, plasăm o div divizată cu id = "logo". Acest lucru ne va permite să lucrăm la aceasta printr-o foaie de stil, pe care o vom crea în curând. Acest lucru va ușura pagina noastră.
4. În interiorul etichetei antetului, plasați încă o etichetă HTML5 - eticheta de navigare. În interiorul acestuia, folosind o listă neordonată, plasați butoanele de navigare. Atribuiți clasei active = "curent" pentru a face stilul său diferit de celelalte.
5. Acum, după eticheta noastră cu antetul, plasați secțiunea de etichetă și apelați-o slider_wrap, în care va fi localizat cursorul. În interior vom crea div id = "slider_bg" în el fundalul nostru verde al cursorului va fi localizat. Apoi, creați div id = "shadow". unde va exista o umbră de la cursor:
6. Deși nu ne-am dus la proprietățile CSS, să includem în propriile noastre
2. Acum, să facem stilurile pentru bara de navigare. La mine s-a dovedit astfel (dacă faceți designul distinct de a mea, editați culorile și tot ceea ce vă convine):
3. Setați stilurile pentru cursor:
Aici o lăsăm la 50px și o aliniem pe partea stângă.
4. Wow_slider și umbra.
În wow_slider imaginile noastre vor fi situate. Setați stilurile pentru ea și pentru umbra de jos:
Fiți conștienți de noile publicații de pe blog!
Articole similare
Trimiteți-le prietenilor: