Va rugam dezactivati programul ad block pentru a vizualiza pagina!

Rezultate pentru tag: solutie




Legea Joule. Electroliza.

Energia electrică – legea Joule. Puterea electrică. Randamentul electric. Efectul chimic - electroliza.

Variaţia energiei de ionizare

Ion, cation, anion. Proprietăți periodice. Energie de ionizare - definiție, variație în tabelul periodic.

Soluţii. Dizolvarea compuşilor ionici şi moleculari în apă.

Soluţii. Amestecuri omogene şi amestecuri eterogene. Solvent/dizolvant şi solut/dizolvat/solvat. Soluţii lichide, gazoase şi solide. Solubilitate. Factorii care influenţează solubilitatea. Apa – cel mai bun solvent. Dizolvarea. Dizolvarea compuşilor ionici în apă. Dizolvarea substanţelor polare în apă. 

Concentraţia soluţiilor. Cristalohidraţi.

Soluţii. Concentraţia. Concentraţia procentuală şi concetraţia molară. Aplicaţie. Cristalohidraţi. Substanţă anhidră, eflorescenţă, higroscopicitate. 

Concentraţia procentuală - aplicaţii

Soluții, dizolvare. Concentrație procentuală. Masă dizolvată, masa soluției. Aplicații.

Concentraţia molară - aplicaţii

Calculul concentraţiei molare a unei soluţii. Regula de trei simplă. Molaritate. Aplicaţii.

Factorii care influenţează echilibrele chimice

Principiul lui LeChatelier. Influenţa concentraţiei, a presiunii şi a temperaturii asupra echilibrelor chimice. Reacţii endoterme şi reacţii exoterme. Procedeul Haber-Bosch, obţinerea amoniacului la scală industrială. Reacţii reversibile şi reacţii ireversibile. 

Acizi şi baze. Teoria protolitică.

Reacţia de neutralizare. Acizi, baze. Protonul. Transferul de protoni. Ion hidroniu. Teoria Brönsted-Lowry sau teoria protolitică. Clasificarea acizilor. Acid conjugat, bază conjugată. Cupluri acid-bază conjugate. 

Tăria acizilor şi bazelor – amfoliţi acido-bazici

Acizi tari şi acizi slabi. Ionizarea acizilor tari. Ionizarea acizilor slabi. Constanta de aciditate. Ka. Baze tari şi baze slabe. Ionizarea bazelor tari. Ionizarea bazelor slabe. Constanta de bazicitate, Kb. Caracterul amfoter. Amfoliţi acido-bazici. 

pH-ul soluţiilor apoase

pH – definiţie, semnificaţie matematică. Reacţia de autoprotoliză a apei. Soluţie neutră. Produsul ionic al apei, Kw. Soluţii acide, soluţii neutre şi soluţii bazice. pH neutru, pH bazic şi pH acid. Scala de pH. 

Celule electrochimice

Electrochimie. Celulă electrochimică. Elemente galvanice/voltaice. Conductori metalici şi electroliţi. Electrod, anod, catod. Semicelulă galvanică. Punte de sare. Procesele chimice care au loc la anod şi la catod. Simbolizarea unei celule electrochimice. Pile uscate/baterii. Pila Daniell.

Ecuații cu numere zecimale

Rezolvarea unor ecuații cu o necunoscută în care apar numere zecimale

Rapoarte și procente

Raportul a două numere, scara hărții, titlul unui aliaj. Procente, concentrația procentuală

Inecuaţii în mulțimea numerelor reale

Rezolvarea unor inecuații în mulțimea numerelor reale. Scrierea soluției sub formă de interval.

Ecuaţia de gradul al doilea

Forma unei ecuații de gradul doi. Deducerea formulelor care apar în rezolvarea unei ecuații de gradul al doilea.

Alchene – proprietăţi chimice

Reacţii specifice hidrocarburilor nesaturate – reacţii de adiţie, de oxidare şi de polimerizare. Hidrogenarea alchenelor, halogenarea alchenelor, adiţia hidracizilor la alchene, adiţia apei la alchene. Oxidare blândă şi oxidare energică. Reacţii comune cu hidrocarburile saturate – reacţii de ardere, reacţii de substituţie. Regula lui Markovnikov. Polimeri vinilici. 

Arene – adiţie la nucleul aromatic, reacţii la catena laterală

Reacţia de hidrogenare a benzenului, a naftalinei şi a antracenului. Reacţii caracteristice catenei laterale – halogenarea şi oxidarea. Poziţia benzilică. Oxidare blândă şi oxidare energică. 

Reacţii de alchilare

Agenţi de alchilare. Alchilarea Friedel-Crafts. Alchilarea arenelor cu alchene. Alchilarea aminelor. Alchilări cu oxid de etenă. Obţinerea oxidului de etenă. Alchilarea aminelor cu oxid de etenă. Alchilarea alcoolilor cu oxid de etenă. 

Zaharide

Fotosintesză, respiraţie. Funcţia zaharidelor în organismele vii. Monozaharide - aldoze, cetoze. D-glucoza, D-fructoza, D-riboza. Formule de proiecţie Fischer. Strucutra ciclică a D-glucozei şi D-ribozei. Adiţie intramoleculară. Semiacetali, semicetali. Anomer α, anomer β, mutarotaţie, centru anomeric. Ciclu piranozic, ciclu furanozic. Formule Haworth. Hidroxil glicozidic. Dizaharide - zaharoză. Polizaharide - amidon, celuloză.

Inecuații în mulțimea numerelor întregi

Rezolvarea inecuațiilor în mulțimea numerelor întregi. Inecuații cu modul

Ecuații în mulțimea numerelor reale

Rezolvarea ecuațiilor în mulțimea numerelor reale. Ecuații de gradul I. Ecuații simple de gradul al II-lea.

Influenţa suprafeţei de contact şi a temperaturii asupra vitezei de reacţie

Factorii care influenţează viteza de reacţie. Influenţa suprafeţei de contact asupra vitezei de reacţie. Influenţa temperaturii asupra vitezei de reacţie. Dependenţa constantei de viteză de temperatură. Relaţia lui Arrhenius. Semnificaţia matematică a elementelor din relaţia lui Arrhenius. Determinarea energiei de activare. Metoda grafică de determinare a energiei de activare. 

Ecuații în mulțimea numerelor naturale

Exprimarea ecuațiilor cu ajutorul balanțelor. Rezolvarea principalelor tipuri de ecuații date în mulțimea numerelor naturale

Ecuații de gradul I

Forma generală e ecuațiilor de gradul I. Modalitatea teoretică de rezolvare a unei ecuații de gradul întâi. Interpretarea geometrică pentru ecuația de gradul I. Ecuații cu parametru real- exerciții.

Echilibre acido-bazice. Tăria acizilor. Exponentul de aciditate.

Protonul și ionul de hidrogen. Ionul hidroniu și ionul hidroxil. Teoria protolitică Brønsted-Lowry. Cuplu acid-bază conjugată. Echilibru acido-bazic. Constanta de aciditate. Disocierea în apă a acizilor tari. Disocierea în apă a acizilor slabi. Exemple de acizi tari. Exemple de acizi slabi. 

pH-ul soluțiilor apoase de acizi

Definiție pH. Produsul ionic al apei. pH și pOH. Calculul concentrației ionilor hidroniu pentru soluțiile de acizi tari și pentru soluțiile de acizi slabi. Calculul pH-ului pentru soluțiile de acizi tari și pentru soluțiile de acizi slabi. Exemplu de calcul pH pentru o soluție de acid tare. Exemplu de calcul pH pentru o soluție de acid slab. 

pH-ul soluțiilor apoase de baze

Calculul concentrației ionilor hidroxil din soluțiile de baze tari și din soluțiile de baze slabe. Calculul concentrației ionilor hidroniu din soluțiile de baze tari și din soluțiile de baze slabe. Calculul pH-ului soluțiilor de baze tari și al soluțiilor de baze slabe. Exemplu de calcul pH pentru o soluție de bază tare. Exemplu de calcul pH pentru o soluție de bază slabă (o soluție de amoniac). 

Reacția de neutralizare în soluții apoase

Reacția de neutralizare - definiție. Neutralizarea unui acid tare cu o bază tare. Ioni spectatori. Căldura molară de neutralizare. Formarea sărurilor prin neutralizarea unui acid tare cu o bază tare. Reacția dintre un acid slab și o bază tare. Reacția dintre un acid tare și o bază slabă. 

Titrări acido-bazice

Reacția de neutralizare. Titrare acido-bazică. Punct de echivalență. Indicatori acido-bazici. Domeniu de viraj. Exemple de indicatori acido-bazici: metiloranj, turnesol, fenolftaleină. Biuretă. Exemplu de calcul: aflarea concentrației unei soluții de acid clorhidric prin titrare acido-bazică cu o soluție de hidroxid de sodiu de concentrație cunoscută. 

Hidroliza sărurilor

Sărurile - compuși ionici. Comportamentul anionilor în apă. Comportamentul cationilor în apă. Reacția de hidroliză. Săruri care formează soluții neutre (săruri provenite de la acizi tari și baze tari). Săruri care formează soluții acide (săruri provenite de la acizi tari și baze slabe). Săruri care formează soluții bazice (săruri provenite de la acizi slabi și baze tari). Săruri provenite de la acizi slabi și baze slabe. Hidroliza azotatului de sodiu (NaNO3), hidroliza clorurii de amoniu (NH4Cl), hidroliza sulfurii acide de sodiu (NaHS), hidroliza cianurii de amoniu (NH4CN). Aplicații; calculul pH-ului unei soluții de sare. 

Proprietăți ale funcțiilor: injectivitate

Funcții injective, noțiunea de funcție injectivă. Modalități de a studia injectivitatea unei funcții. 

Proprietăți ale funcțiilor: surjectivitate

Funcții surjective, noțiunea de funcție surjectivă. Modalități de a studia surjectivitatea unei funcții.

Proprietăți ale funcțiilor: bijectivitate

Funcții bijective, noțiunea de funcție bijectivă. Modalitați de a studia bijectivitatea unei funcții.

Funcţii continue pe un interval: existenţa soluţiilor unei ecuaţii

Proprietăţi ale funcţiilor continue pe un interval: existenţa soluţiilor unei ecuaţii.

HTML Responsive Web Design

Responsive Web Design vizează utilizarea HTML-ului și CSS-ului pentru redimensionarea, ascunderea, micșorarea sau mărirea unui site web automat, pentru a-l arăta bine pe toate dispozitivele (desktop-uri, tablete și telefoane).
Setarea Viewport. Când creați pagini web responsive, adăugați următorul element <meta> în toate paginile dvs. web.
Imaginile responsive sunt imagini care se dimensionează frumos pentru a se potrivi cu orice dimensiune a browserului.
Utilizarea proprietății lățime (width).
Utilizarea proprietății cu lățimea maximă (max-width).
Elementul HTML <picture> vă permite să definiți imagini diferite pentru dimensiuni diferite ale ferestrei browserului.
Responsive Text Size. Mărimea textului poate fi setată cu o unitate „vw”, ceea ce înseamnă „lățimea vizualizării” (viewport width).
Pe lângă redimensionarea textului și a imaginilor, este de asemenea obișnuit să folosești interogări media în paginile responsive web.
Cu interogări media, puteți defini stiluri complet diferite pentru diferite dimensiuni de browser.
O pagină Responsive Web ar trebui să arate bine pe ecrane desktop mari și pe telefoane mobile mici.
Există multe CSS Frameworks care oferă un Responsive Design.
O modalitate excelentă de a crea un Responsive Design este de a utiliza o responsive style sheet.
Un alt framework popular este Bootstrap, folosește HTML, CSS și jQuery pentru a face pagini web responsive.



 

Suport HTML5

HTML5 este acceptat în toate browserele moderne.
În plus, toate browserele, vechi și noi, gestionează automat elemente nerecunoscute ca elemente inline.
Din această cauză, puteți „învăța” browserele mai vechi să gestioneze elemente HTML „necunoscute”.
Puteți învăța browserele mai vechi să gestioneze corect HTML5.
HTML5 definește opt noi elemente semantice. Toate acestea sunt elemente la nivel de bloc (block-level elements).
Pentru a asigura un comportament corect în browserele mai vechi, puteți seta proprietatea de afișare CSS (CSS display property) pentru aceste elemente HTML pentru a le bloca.
Puteți adăuga, de asemenea, unei pagini HTML, elemente noi folosind un truc de browser.
Declarația JavaScript document.createElement ("myHero") este necesară pentru a crea un element nou în IE 9 și în versiunile anterioare.
Veți avea nevoie de HTML5Shiv pentru a oferi compatibilitate pentru browsere IE mai vechi decât IE 9.
HTML5Shiv este plasat în eticheta <head>.
HTML5Shiv este un fișier javascript la care se face referire într-o etichetă <script>.
Ar trebui să utilizați HTML5Shiv când utilizați noile elemente HTML5 precum: <article>, <section>, <aside>, <nav>, <footer>.

Migrare în HTML5

Acest capitol se referă în întregime la modul de migrare de la HTML4 la HTML5.
Acest capitol arată cum se poate converti o pagină HTML4 într-o pagină HTML5, fără a distruge nimic din conținutul sau structura originală.
Migrarea de la HTML4 la HTML5:
<div id="header"> -   <header>
<div id="menu">  -   <nav>
<div id="content">  -   <section>
<div class="article">  -   <article>
<div id="footer">  -   <footer>
Modificați doctype la doctype HTML5.
Modificați informațiile de codificare la codarea HTML5.
Adăugați HTML5Shiv.
Schimbare la elemente semantice HTML5.
CSS-ul existent conține ID-uri și clase pentru stilizarea elementelor.
Înlocuiți cu stiluri CSS egale pentru elemente semantice HTML5.
Schimbați elementele în elemente semantice HTML5​​​​​​.
Există o diferență confuză (lipsa) în standardul HTML5, între <article> <section> și <div>.
În standardul HTML5, elementul <secțiune> este definit ca un bloc de elemente conexe.
Elementul <article> este definit ca un bloc complet, de sine stătător, al elementelor conexe.
Elementul <div> este definit ca un bloc de elemente pentru copii.
<article> în <article>.
<div> în <article>.
<div> în <section> în <article>.
 

HTML YouTube

Cel mai simplu mod de a reda videoclipuri în HTML, este să folosiți YouTube.
Conversia videoclipurilor în diferite formate poate fi dificilă și necesită mult timp.
O soluție mai ușoară este să permiteți YouTube-ului să redea videoclipurile din pagina dvs. web.
YouTube va afișa un id (cum ar fi tgbNymZ7vqY), atunci când salvați (sau redați) un videoclip.
Puteți utiliza acest id și faceți referire la videoclipul dvs. în codul HTML.
Pentru a reda videoclipul dvs. pe o pagină web, faceți următoarele:
Încărcați videoclipul pe YouTube Ia o notă de identificare a videoclipului.
Definiți un element <frame> în pagina dvs. web.
Lăsați atributul src să indice URL-ul videoclipului.
Utilizați atributele de lățime și înălțime (width și height) pentru a specifica dimensiunea playerului.
Adăugați alți parametri la adresa URL (vezi mai jos).
Redare automată YouTube (YouTube Autoplay)
Puteți face ca videoclipul dvs. să înceapă să se redea automat atunci când un utilizator vizitează pagina respectivă adăugând un parametru simplu la adresa URL a YouTube.
Fiți atenți când decideți redarea automată a videoclipurilor dvs. Pornirea automată a unui videoclip vă poate enerva vizitatorul și poate ajunge să provoace mai mult rău decât bine.
Listă de redare YouTube (YouTube Playlist)
O listă separată de virgule a videoclipurilor de redat (pe lângă adresa URL originală).
Buclă YouTube (YouTube Loop)
Valoarea 0 (implicit): Videoclipul va fi redat o singură dată.
Valoarea 1: Videoclipul se va bucla (pentru totdeauna).
Controale YouTube (YouTube Controls)
Valoarea 0: Player controls nu se afișează.
Valoarea 1 (implicit): Afișare player controls.
YouTube - Folosim <object> sau <embed>
 YouTube  <object> și <embed> sunt depășite din ianuarie 2015. Ar trebui să vă migrați videoclipurile pentru a utiliza <iframe>.

CSS Float

Proprietatea CSS float  specifică modul în care un element ar trebui să plutească (float).
Proprietatea CSS clear specifică ce elemente pot pluti  (float) lângă elementul șters și pe ce parte.
Proprietatea float
Proprietatea float este utilizată pentru poziționarea și formatarea conținutului, de ex. lăsați o imagine să plutească stânga spre text într-un container.
Proprietatea float poate avea una dintre următoarele valori:
left (stânga) - Elementul plutește în stânga containerului său.
right (dreapta) - Elementul plutește în dreapta containerului său.
none - Elementul nu plutește (va fi afișat acolo unde apare în text). Aceasta este implicită.
inherit (mostenire) - elementul moștenește valoarea float a părintelui său.
În cea mai simplă utilizare, proprietatea float poate fi utilizată pentru a înfășura text în jurul imaginilor.
Elementul float: right; (float: dreapta;).
Elementul float: left; (float: stânga;).
Elementul float: none;. 
Proprietatea clear
Proprietatea clear specifică ce elemente pot pluti (float) lângă elementul șters și pe ce parte.
Proprietatea clear poate avea una dintre următoarele valori:
none - Permite elemente plutitoare de ambele părți. Aceasta este implicită.
left (stânga) - Nu sunt permise elemente plutitoare în partea stângă.
right (dreapta) - Nu sunt permise elemente plutitoare în partea dreaptă.
both (ambele) - Nu sunt permise elemente plutitoare nici pe partea stângă, fie pe partea dreaptă.
inherit (mostenirea) - Elementul mosteneste valoarea clara a parintelui său.
Cel mai obișnuit mod de a utiliza proprietatea clear este după ce ați utilizat o proprietate float pe un element.
Când ștergeți floats, ar trebui să potriviți clear cu float: Dacă un element este float la stânga, atunci ar trebui să ștergeți la stânga. Elementul float va continua să plutească, dar elementul șters va apărea sub el pe pagina web.
The clearfix Hack
Dacă un element este mai înalt decât elementul care îl conține și este float, acesta se va „overflow” în afara containerului său.
overflow: auto clearfix  funcționează bine atâta timp cât sunteți în stare să păstrați controlul asupra margin-ului și a padding-ului (altfel puteți vedea bare de defilare). Totuși, noul clearfix hack however este mai sigur de utilizat și următorul cod este folosit pentru majoritatea paginilor web.
Grid of Boxes / Equal Width Boxes
Ce este box-sizing?
Puteți crea cu ușurință trei cutii plutitoare (floating boxes) una lângă alta. Cu toate acestea, când adăugați ceva care mărește lățimea fiecărei cutii (de exemplu, padding sau borders), caseta se va rupe. Proprietatea de dimensionare a cutiei ne permite să includem padding și border în lățimea totală (și înălțimea) a cutiei, asigurându-ne că padding rămâne în interiorul cutiei și că nu se rupe.
Grila casetelor poate fi de asemenea folosită pentru a afișa imagini side by side:
Cutii de înălțime egală (Equal Height Boxes)
Este bine dacă puteți garanta că casetele vor avea întotdeauna aceeași cantitate de conținut în ele. Dar de multe ori, conținutul nu este același. Dacă încercați exemplul de mai sus pe un telefon mobil, veți vedea că conținutul celei de-a doua cutii va fi afișat în afara casetei. Acesta este locul în care CSS3 Flexbox vine la îndemână - deoarece poate întinde automat cutiile pentru a fi la fel de lungă ca cea mai lungă casetă:
Flexbox nu este acceptat în Internet Explorer 10 sau în versiunile anterioare.
Meniu de navigatie (Navigation Menu)
Utilizați float cu o listă de hyperlinkuri pentru a crea un meniu orizontal.
Exemplu de dispunere web (Web Layout Example)
Este, de asemenea, obișnuit să faceți web layouts folosind proprietatea float.
Toate proprietățiile CSS float.
box-sizing Defineste modul în care se calculează lățimea și înălțimea unui element: trebuie să includă sau nu borduri
clear Specifica ce elemente pot pluti lângă elementul șters și pe ce parte
float Specifică modul în care un element trebuie să plutească
overflow Specifică ce se întâmplă dacă conținutul revărsă caseta unui element
overflow-x Specifică ce se poate face cu marginile stânga / dreapta ale conținutului dacă acesta revărsă zona de conținut a elementului
overflow-y Specifică ce trebuie făcut cu marginile de sus / de jos ale conținutului dacă acesta revărsă zona de conținut a elementului

CSS Align

CSS Layout - Aliniere orizontală și verticală
Elemente de aliniere de centru
Pentru a centra orizontal un element de block (cum ar fi <div>), utilizați margin: auto;
Setarea lățimii elementului îl va împiedica să se întindă până la marginile containerului său.
Elementul va prelua apoi lățimea specificată, iar spațiul rămas va fi împărțit în mod egal între cele două margini.
Notă: Alinierea la centru nu are efect dacă proprietatea lățimii nu este setată (sau setată la 100%).
Centrare aliniere text (Center Align Text)
Pentru a centra doar textul în interiorul unui element, utilizați text-align: center;
Centrați o imagine
Pentru a centra o imagine, setați marginea stângă și dreaptă pe auto și transformați-o într-un element block.
Aliniere stânga și dreapta - Folosire position
O metodă de aliniere a elementelor este utilizarea position: absolut ;:
Aliniere stânga și dreapta - Folosire float
O altă metodă pentru alinierea elementelor este utilizarea proprietății float.
Dacă un element este mai înalt decât elementul care îl conține și este float, acesta se va revărsa (overflow) în afara containerului său. Puteți utiliza hackul „clearfix” pentru a remedia acest lucru (a se vedea exemplul de mai jos).
The clearfix Hack
Putem adăuga overflow: auto; la elementul conținut pentru a remedia această problemă.
Centrare vertical - Folosire padding
Există multe moduri de a centra un element pe verticală în CSS. O soluție simplă este utilizarea paddingu-ului de sus și de jos.
Centru vertical - Folosire line-height
Un alt truc este să folosiți proprietatea line-height cu o valoare egală cu proprietatea height.
Centru vertical - Folosire position și transform
Dacă padding și line-height nu sunt opțiuni, o a treia soluție este utilizarea poziționării și a proprietății de transformare.

CSS Flexbox

CSS Flexbox
CSS Modulul Flexbox Layout (CSS Flexbox Layout Module)
Înainte de modulul Layout Flexbox, existau patru moduri de aspect:
Block, pentru secțiunile dintr-o pagină web
Inline, pentru text
Table, pentru date în două dimensiuni ale tabelului
Positioned, pentru poziția explicită a unui element
Flexible Box Layout Module, face mai ușoară proiectarea unei structuri flexibile layout responsive fără a folosi float sau poziționare (positioning).
Asistență browser(Browser Support)
Proprietățilie flexbox sunt acceptate în toate browserele moderne.
Elemente Flexbox (Flexbox Elements)
Pentru a începe să utilizați modelul Flexbox, trebuie să definiți mai întâi un recipient flex (flex container).
Elementul de mai sus reprezintă un recipient flex (flex container) (zona albastră) cu trei elemente flexibile.
Un container flex cu trei articole flexibile.
O dispunere flexibilă (Flexible Layout) trebuie să aibă un element părinte cu proprietatea de afișare setată la flex.
Elementele directe ale copilului ale containerului flexibil devin automat elemente flexibile.
Proprietățiile containerului flex sunt: flex-direction, flex-wrap, flex-flow, justify-content, align-items, align-content.
Proprietatea flex-direction
Proprietatea flex-direction definește în ce direcție containerul dorește să stiveze elementele flex.
 "flex-direction: column;" stivuiește elementele flexate vertical (de sus în jos).
Valoarea coloanei (column) stochează vertical elementele flex (de sus în jos).
Valoarea coloană-inversă (column-reverse) stochează vertical elementele flex (dar de jos în sus).
Valoarea row-reverse stochează elementele flexate pe orizontală (dar de la dreapta la stânga).
Proprietatea flex-wrap specifică dacă elementele flex trebuie să fie wrap sau nu.
Valoarea wrap specifică faptul că elementele flex se vor wrap dacă este necesar.
Valoarea nowrap specifică faptul că elementele flex nu se vor wrap (aceasta este implicită).
Valoarea wrap-reverse specifică faptul că elementele flexibile se vor wrap dacă este necesar, în ordine inversă.
Proprietatea flex-flow este o proprietate shorthand pentru setarea proprietăților flex-direction și flex-wrap.
Proprietatea justify-content este utilizată pentru alinierea elementelor flex
Valoarea center aliniază elementele flex în centrul containerului
Valoarea flex-start aliniază elementele flex la începutul containerului (implicit)
Valoarea flex-end aliniază elementele flex la sfârșitul containerului
Valoarea space-around afișează elementele flex cu spațiu înainte, între și după linii (before, between și after)
Valoarea space-between afișează elementele flexibile cu spațiu între linii
Proprietatea align-items este utilizată pentru alinierea elementelor flexate pe verticală.
Utilizăm un container înalt de 200 de pixeli, pentru a demonstra mai bine proprietatea align-items.
Valoarea center aliniază elementele flex din mijlocul containerului.
Valoarea flex-start aliniază elementele flex din partea de sus a containerului.
Valoarea flex-end aliniază elementele flex din partea de jos a containerului.
Valoarea stretch întinde elementele flex pentru a umple containerul (aceasta este implicit).
Valoarea baseline aliniază elementele flex, cum ar fi alinierea lor de bază.
Proprietatea align-content este utilizată pentru a alinia liniile flex.
În aceste exemple, utilizăm un container înalt de 600 de pixeli, cu proprietatea flex-wrap setată pentru a wrapa, pentru a demonstra mai bine proprietatea align-content.
Valoarea space-between afișează liniile flexate cu spațiu egal între ele.
Valoarea space-around afișează liniile flexate cu spațiu înainte, între și după ele.
Valoarea stretch întinde liniile flex pentru a ocupa spațiul rămas (acesta este implicit).
Valoarea center afișează liniile de flexare din mijlocul containerului.
Valoarea flex-start afișează liniile flex la începutul containerului.
Valoarea flex-end afișează liniile de flex la sfârșitul containerului.
Centrare perfectă
În următorul exemplu, vom rezolva o problemă de stil foarte comună: centrarea perfectă (perfect centering).
Setați atât proprietățiile justify-content, cât și align-items in centru, iar elementul flex va fi perfect centrat.
Child Elements (Items)
Elementele child directe ale unui recipient flex devin automat elemente flexibile (flexibile).
Proprietățiile elementului flex: order, flex-grow, flex-shrink, flex-basis, flex, align-self.
Proprietatea order specifică ordinea elementelor flex.
Primul element flex din cod nu trebuie să apară ca primul element din layout.
Valoarea order trebuie să fie un număr, valoarea implicită este 0.
Proprietatea order poate modifica ordinea articolelor flex.
Proprietatea flex-grow specifică cât de mult va crește un element flex în raport cu restul elementelor flex.
Valoarea flex-grow trebuie să fie un număr, valoarea implicită este 0.
Faceți ca cel de-al treilea element flex să crească de opt ori mai rapid decât celelalte elemente flex.
Proprietatea flex-shrink specifică cât de mult se va micsora un element flex în raport cu restul elementelor flex.
Valoarea flex-shrink trebuie să fie un număr, valoarea implicită este 1.
Nu lăsați al treilea element flex să se micșoreze la fel de mult decât celelalte elemente flex.
Proprietatea flex-basis specifică lungimea inițială a unui element flex.
Proprietatea flex este o proprietate shorthand pentru proprietățiile flex-grow, flex-shrink și flex-basis.
Proprietatea align-self specifică alinierea pentru elementul selectat în interiorul containerului flexibil.
Proprietatea align-self înlocuiește alinierea setată implicit de proprietatea align-items a containerului.
Galerie de imagini responsive folosind Flexbox
Utilizați flexbox pentru a crea o galerie de imagini responsive care variază între patru, două sau imagini cu lățime completă, în funcție de dimensiunea ecranului.
Website responsive folosind Flexbox
Utilizați flexbox pentru a crea un responsive website, care conține o bară de navigare flexibilă și conținut flexibil.
Proprietăți CSS Flexbox
display - Specifică tipul de box folosit pentru un element HTML
flex-direction - Specifică direcția articolelor flexibile din interiorul unui recipient flex
justify-content - Aliniază orizontal elementele flex atunci când elementele nu folosesc tot spațiul disponibil pe axa principală
align-items - Aliniază vertical elementele flex atunci când elementele nu folosesc tot spațiul disponibil pe axa transversală
flex-wrap - Specifică dacă elementele flexate trebuie să se înfășoare (wrap) sau nu, dacă nu există suficient loc pentru ele pe o singură linie flex
align-content - Modifică comportamentul proprietății flex-wrap. Este similar cu align-items, dar în loc să alinieze elementele flex, aliniază liniile flex
flex-flow - O proprietate shorthand pentru flex-direction și flex-wrap
order - Specifică ordinea unui articol flexibil în raport cu restul elementelor flexibile din interiorul aceluiași recipient
align-self - Folosit pe articolele flex. Înlocuiește proprietatea align-items
flex - O proprietate shorthand pentru proprietățile flex-grow, flex-shrink și flex-basis

CSS Responsive Web Design - Imagini

Responsive Web Design - Images
Utilizarea proprietății Width
Dacă proprietatea lățimii (width) este setată la un procent și înălțimea este setată la „auto”, imaginea va fi receptivă și va scala în sus și în jos.
Imaginea poate fi redusă pentru a fi mai mare decât dimensiunea inițială. O soluție mai bună, în multe cazuri, va fi utilizarea în schimb a proprietății cu lățimea maximă.
Imaginile de fundal (Background Images) pot răspunde, de asemenea, la redimensionare și scalare (resizing și scaling).
Dacă proprietatea background-size este setată pe „contain”, imaginea de fundal (background Images) se va scala și va încerca să se potrivească zonei de conținut. Cu toate acestea, imaginea își va păstra raportul de aspect (relația proporțională între lățimea și înălțimea imaginii (width și height)).
Dacă proprietatea background-size este setată pe „100% 100%”, imaginea de fundal (background image) se va întinde pentru a acoperi întreaga zonă de conținut.
Dacă proprietatea background-size este setată pe „cover”, imaginea de fundal (background image) se va scala pentru a acoperi întreaga zonă de conținut. Observați că valoarea „cover” păstrează raportul de aspect (aspect ratio), iar o parte din imaginea de fundal (background image) poate fi tăiată.
Imagini diferite pentru dispozitive diferite
O imagine mare poate fi perfectă pe un ecran mare al unui computer, dar inutilă pe un dispozitiv mic. De ce să încărcați o imagine mare atunci când trebuie să o măriți în jos? Pentru a reduce încărcarea sau pentru orice alte motive, puteți utiliza interogări media (media queries) pentru a afișa imagini diferite pe dispozitive diferite.
Puteți utiliza interogarea media (media query) min-device-width, în loc de min-width, care verifică lățimea dispozitivului, în loc de lățimea browserului. Atunci imaginea nu se va schimba când redimensionați fereastra browserului.
Elementul HTML5 <picture>
HTML5 a introdus elementul <picture>, care vă permite să definiți mai multe imagini.
Asistență browser (Browser Support)
Elementul <picture> funcționează similar cu elementele <video> și <audio>. Configurați surse diferite, iar prima sursă care se potrivește preferințelor este cea utilizată:
Atributul srcset este necesar și definește sursa imaginii.
Atributul media este opțional și acceptă interogările media (media queries) pe care le găsiți în regula CSS @media.
De asemenea, ar trebui să definiți un element <img> pentru browserele care nu acceptă elementul <picture>.

CSS Responsive Web Design - Videoclipuri

Responsive Web Design - Videoclipuri
Utilizarea proprietății width
Dacă proprietatea lățimii (width) este setată la 100%, playerul video va răspunde și va scala în sus și în jos.
Rețineți că, playerul video poate fi amplificat pentru a fi mai mare decât dimensiunea inițială. O soluție mai bună, în multe cazuri, va fi utilizarea în schimb a proprietății cu lățimea maximă (max-width).
Utilizarea proprietății lățime maximă (max-width)
Dacă proprietatea lățime maximă (max-width) este setată la 100%, playerul video va scădea în jos dacă trebuie, dar niciodată nu va fi mai mare decât dimensiunea inițială.
Adăugați un videoclip la pagina web de exemplu
Vrem să adăugăm un videoclip în pagina noastră web de exemplu. Videoclipul va fi redimensionat pentru a ocupa întotdeauna tot spațiul disponibil.

SQL Găzduire

SQL Găzduire (SQL Hosting)
Dacă doriți ca site-ul dvs. web să poată stoca și prelua date dintr-o bază de date, serverul dvs. web ar trebui să aibă acces la o bază de date (database-system) care utilizează limbajul SQL.
Dacă serverul dvs. web este găzduit de un furnizor de servicii Internet ( Internet Service Provider) (ISP), va trebui să căutați planuri de găzduire SQL (SQL hosting).
Cele mai frecvente baze de date de găzduire SQL (SQL hosting databases) sunt MS SQL Server, Oracle, MySQL și MS Access.
MS SQL Server
Microsoft SQL Server este un software popular de bază de date pentru site-uri web bazate pe baze de date (database-driven) cu trafic ridicat.
SQL Server este un sistem de baze de date SQL (SQL database system) foarte puternic, robust și complet prezentat.
Oracle
Oracle este, de asemenea, un software popular de baze de date pentru site-uri web bazate pe baze de date cu trafic ridicat.
Oracle este un sistem de baze de date SQL foarte puternic, robust și complet prezentat.
MySQL
MySQL este, de asemenea, un software popular de baze de date pentru site-uri web.
MySQL este un sistem de baze de date SQL foarte puternic, robust și complet caracterizat.
MySQL este o alternativă ieftină la soluțiile scumpe Microsoft și Oracle.
Access
Când un site web necesită doar o bază de date simplă, Microsoft Access poate fi o soluție.
Access-ul nu este potrivit pentru traficul foarte ridicat și nu este la fel de puternic ca MySQL, SQL Server sau Oracle.

Acizi

Definirea acizilor conform teoriei disociației electrolitice și a teoriei protolitice; hidracizi și oxoacizi; radicali acizi; formula generală și nomenclatura acizilor; proprietățile și reacțiile chimice specifice acizilor; ionizarea acizilor; metode generale de obținere a acizilor. 

Baze

Definirea bazelor conform teoriei disociației electrolitice și teoriei protolitice; formula generală și nomenclatura bazelor; proprietățile și reacțiile chimice specifice bazelor; ionizarea bazelor; metode generale de obținere a bazelor. 

Săruri

Structura și formula generală a sărurilor; săruri neutre, săruri acide și săruri bazice; nomenclatura sărurilor; proprietățile și reacțiile chimice ale sărurilor; metode generale de obținere a sărurilor; neutralizare și hidroliză. 

Apa

Răspândirea apei în natură. Purificarea apei - sedimentare, filtrare, sterilizare. Apele industriale. Distiliarea apei. Apa higroscopică. Proprietățile fizice ale apei. Structura moleculei de apă. Proprietățile chimice ale apei. Hidrați.  

Grupa 17 sau grupa a VII-a principală

Grupa a VII-a principală, numerotată VII A sau 17, numită și grupa halogenilor, conține următoarele elemente: fluor, F, clor, Cl, brom, Br, iod, I, astatin, At.
 

Grupa 15 sau grupa a V-a principală

Grupa a V-a principală a sistemului periodic, numerotată V A sau 15, cuprinde următoarele elemente: azot, N, fosfor, P, arsen, As, stibiu (antimoniu), Sb, și bismut, Bi. 
 

Grupa 14 sau grupa a IV-a principală

Grupa a IV-a principală a sistemului periodic, numerotată IV A sau 14, cuprinde elementele carbon, C, siliciu, Si, germaniu, Ge, staniu, Sn, și plumb, Pb. 

Grupa 13 sau grupa a III-a principală

Grupa a III-a principală a sistemului periodic, numerotată III A sau 13, cuprinde elementele bor, B, aluminiu, Al, galiu, Ga, indiu, In, și taliu, Tl. 

Grupa 2 sau grupa a II-a principală

Grupa a II-a principală a sistemului periodic, numerotată II A sau 2, cuprinde elementele: beriliu, Be, magneziu, Mg, calciu, Ca, stronțiu, Sr, bariu, și radiu, Ra. Această grupă se mai numește grupa metalelor alcalino-pământoase. 

Grupa 4 sau grupa a IV-a secundară

Grupa a IV-a secundară a sistemului periodic, numerotată IV B sau 4, cuprinde elementele rare titan, Ti, zirconiu, Zr, și hafniu, Hf. 

Grupa 5 sau grupa a V-a secundară

Grupa a V-a secundară a sistemului periodic, numerotată V B sau 5, cuprinde elementele rare vanadiu, V, niobiu, Nb, și tantal, Ta.

Grupa 7 sau grupa a VII-a secundară

Grupa a VII-a secundară a sistemului periodic, numerotată VII B sau 7, cuprinde elementele mangan, Mn, technețiul, Tc, și reniu, Re. 

Grupa 9 sau grupa a VIII-a secundară

Grupa 9 a sistemului periodic, în trecut considerată parte a grupei a VIII-a secundare alături de grupele 8 și 10, cuprinde elementele cobalt, Co, rodiu, Rh, și iridiu, Ir. 

Grupa 10 sau grupa a VIII-a secundară

Grupa 10 a sistemului periodic, în trecut considerată parte a grupei a VIII-a secundare, alături de grupele 8 și 9, cuprinde elementele nichel, Ni, paladiu, Pd, și platină, Pt. 

Despre Lecții-Virtuale.ro

Lecții-Virtuale este o platformă educațională care oferă suport în vederea pregătirii pentru Evaluare Națională și Bacalaureat la Matematică, Fizică și Chimie. Lecțiile noastre sunt alcătuite din filme și exerciții și probleme cu tot cu rezolvări. Platforma noastră este o soluție ideală pentru școala online. Pentru facilitarea activității profesorilor în cadrul ecosistemului GSuite de la Google am implementat butonul Google Classroom. Scopul nostru este să ne concentrăm pe prezentarea noțiunilor și fenomenelor într-o manieră care să stimuleze înțelegerea și nu memorarea mecanică. Ne propunem să facilităm accesul la conținut educațional de calitate mai ales elevilor cu venituri mai modeste care nu își pemit meditații particulare. Sperăm să vă simțiti bine alături de noi și să invățați lucruri folositoare. Hai România!

Newsletter

Abonează-te la Newsletter pentru a fi la curent cu toate ofertele noastre.

Parteneri

EduApps partener Lectii Virtuale UiPath partener Lectii Virtuale Scoala365 partener Lectii Virtuale CCD Galați partener Lectii Virtuale

2024 © Lecții-virtuale.ro Toate drepturile rezervate
Termeni   Despre   Contact   Confidenţialitate   Cariere Parteneri