Cum se fac prezentări HTML cu diapozitive web

Într-o lume în care arată-ne ideile pe internet A devenit din ce în ce mai necesar și acolo unde diversitatea instrumentelor ne-a determinat să creăm prezentări uimitoare, care în multe cazuri ajung să fie incompatibile cu unele medii, fără îndoială, Prezentări HTML vor continua să fie alternativa universală în acest domeniu.

Dar nu este un secret pentru nimeni că crearea de prezentări HTML frumoase poate dura mult timp și necesită cunoștințe oarecum avansate de HTML, CSS și, în unele cazuri, JavaScript. Din aceste probleme, reiese un instrument excelent numit diapozitive web.

Ce este diapozitivele web?

Este să-l numim cumva un „cadru” open source, realizat de Jose Luis Antunez, asta ne permite creați prezentări HTML repede și ușor. Instrumentul are elementele esențiale pentru a vă face propriile prezentări, la fel, puteți lua una dintre prezentările demo și o puteți personaliza după bunul plac în câteva minute.

Prezentările HTML pe care le-am făcut cu acest instrument vor avea o estetică impresionantă. Este demn de remarcat faptul că acest instrument necesită cunoștințe de bază despre HTML și CSS, deci este ideal pentru toate tipurile de utilizatori, care ar trebui să se concentreze doar pe conținut și foarte puțin pe modul în care pregătesc prezentarea.

Cum se descarcă diapozitive web?

Pentru a descărca diapozitive web, pur și simplu efectuați următoarea comandă din directorul dvs. preferat:

wget https://github.com/jlantunez/webslides/archive/master.zip

De asemenea, puteți clona depozitul oficial cu

git clone https://github.com/jlantunez/webslides.git

În folderul proiectului veți obține js, css și demonstrațiile necesare pentru a începe să creați cu ușurință propriile dvs. prezentări HTML.

Cum se utilizează diapozitive web?

Cel mai mare avantaj al diapozitivelor web este ușurința de utilizare, acest instrument facilitează cu adevărat crearea de prezentări cu diferite obiective, iar seria sa de demonstrații accelerează procesul de creare a prezentărilor cu un procent foarte mare.

Ce obținem atunci când descărcăm diapozitive web?

Când descărcăm diapozitive web, accesăm diferite foldere, care includ demonstrații și imagini (dispozitive și sigle).

• Dosarul CSS va stoca stilurile prezentărilor noastre
• Javascripturile necesare vor fi stocate în folderul js, inclusiv webslide.js fundamental, unde se face cea mai mare parte a magiei.
• Imaginile și fișierele html ale demonstrațiilor vor fi salvate în folderele de imagini și respectiv demonstrații.

webslides/
├── index.html
├── css/
│   ├── base.css
│   └── colors.css
│   └── svg-icons.css (optional)
├── js/
│   ├── webslides.js
│   └── svg-icons.js (optional)
└── demos/
└── images/

Crearea de prezentări HTML cu diapozitive web

Există 2 avantaje fundamentale atunci când utilizați diapozitive web, pe care le menționăm mai jos:

• Codul este curat și scalabil. De asemenea, include un markup intuitiv cu utilizarea celor mai populare nomenclaturi. Nu este nevoie să folosiți clase sau să nu folosiți excesiv cuibărirea.
• Fiecare <section> în #webslides reprezintă un slide. Deci paginarea este extrem de simplă.

Slide 1  Slide 1

În același mod putem realiza diapozitive verticale, adăugând un stil vertical

Clase care alcătuiesc CSS-urile web

• Tipografie: .text-landing, .text-data, .text-intro ...
• Culori de fundal: .bg-primar, .bg-măr, .bg-albastru ...
• Imagini de fundal:. Fundal,. Fundal-centru-jos ...
• Carduri: .card-50, .card-40 ...
• Blocuri flexibile: .flexblock.clients, .flexblock.metrics ...

Se extinde la diapozitive web

weblides ne permite să adăugăm noi stiluri și funcționalități, pentru aceasta, de exemplu, putem adăuga unele dintre următoarele resurse:

• Unsplash
• animate.css
• particule.js
• pt

Demo-uri de prezentare HTML realizate cu diapozitive web

Puteți vedea o serie de demonstrații de prezentări HTML realizate cu diapozitive web aici. În mod similar, atunci când descărcați cadrul, puteți accesa codificarea fiecăruia dintre aceste demonstrații.

Acesta este un instrument care ne va permite să creăm prezentări HTML rapid și cu finisaje excelente, dar ne va ajuta, de asemenea, să ne concentrăm asupra conținutului și să obținem rezultate pe care nu ni le imaginam înainte.