Rezultate pentru tag: puncte
HTML și XHTML
XHTML este HTML scris ca XML.
XHTML înseamnă limbaj de extindere HyperText Markup Language
XHTML este aproape identic cu HTML
XHTML este mai strict decât HTML
XHTML este HTML definit ca o aplicație XML
XHTML este acceptat de toate browserele principale
HTML APIs
API Geolocalizare HTML este utilizat pentru a localiza poziția unui utilizator.
Localizați Poziția Utilizatorului
API Geolocalizare în HTML este utilizat pentru a obține poziția geografică a unui utilizator.
Deoarece acest lucru poate compromite confidențialitatea, poziția nu este disponibilă decât dacă utilizatorul o aprobă.
Geolocalizarea este cea mai precisă pentru dispozitivele cu GPS, cum ar fi smartphone-ul.
Începând cu Chrome 5.0, API-ul de geolocalizare va funcționa numai pe contexte sigure, cum ar fi HTTPS. Dacă site-ul dvs. este găzduit pe o origine nesigură (cum ar fi HTTP), solicitările pentru a obține locația utilizatorilor nu vor mai funcționa.
Utilizarea geolocalizării în HTML
Metoda getCurrentPosition () este utilizată pentru a returna poziția utilizatorului.
Al doilea parametru al metodei getCurrentPosition () este utilizat pentru a gestiona erorile. Specifică o funcție care trebuie executată dacă nu reușește să obțină locația utilizatorului:
Pentru a afișa rezultatul într-o hartă, aveți nevoie de acces la un serviciu de hartă, cum ar fi Google Maps.
Geolocalizarea este de asemenea foarte utilă pentru informații specifice locației, cum ar fi:
Informații locale actualizate.
Afișare Puncte de interes în apropierea utilizatorului.
Navigare rotativă (GPS).
Metoda getCurrentPosition () returnează un obiect de succes. Proprietățile de latitudine, longitudine și precizie sunt întotdeauna returnate. Celelalte proprietăți sunt returnate dacă sunt disponibile:
coords.latitude - Latitudinea ca număr zecimal (întors întotdeauna)
coords.longitude - Longitudinea ca număr zecimal (întors întotdeauna)
coords.acuratetă - Precizia poziției (întoarsă întotdeauna)
coords.altitude - Altitudinea în metri peste nivelul mării medii (returnat dacă este disponibil)
coords.altitude - Accarity Precizia altitudinii de poziție (returnată dacă este disponibilă)
coords.heading - Titlul ca grade în sensul acelor de ceasornic dinspre nord (returnat dacă este disponibil)
coords.speed - Viteza în metri pe secundă (returnată dacă este disponibilă)
timestamp - Data / ora răspunsului (returnat dacă este disponibil)
Obiect de geolocalizare - Alte metode interesante
watchPosition () - returnează poziția actuală a utilizatorului și continuă să returneze poziția actualizată pe măsură ce utilizatorul se mișcă (precum GPS-ul într-o mașină).
clearWatch () - Oprește metoda watchPosition ().
CSS Sintaxă
Un set de reguli CSS constă dintr-un selector și un bloc de declarații.
Selectorul indică elementul HTML pe care doriți să-l creeze în stil.
Blocul de declarație conține una sau mai multe declarații separate prin punct și virgulă.
Fiecare declarație include un nume de proprietate CSS și o valoare, separate de două puncte.
O declarație CSS se încheie întotdeauna cu punct și virgulă, iar blocurile de declarație sunt înconjurate de acolade.
Comentariile sunt utilizate pentru a explica codul și pot fi utile atunci când editați codul sursă la o dată ulterioară.
Comentariile sunt ignorate de browsere.
Un comentariu CSS începe cu / * și se termină cu * /. De asemenea, comentariile pot cuprinde mai multe linii.
CSS Liste
În HTML, există două tipuri principale de liste:
liste neordonate (<ul>) - articolele din listă sunt marcate cu buline.
liste ordonate (<ol>) - elementele din listă sunt marcate cu numere sau litere.
Proprietățiile listei CSS vă permit să:
Setați markeri de articole de listă diferite pentru liste ordonate.
Setați markeri de articole de listă diferite pentru liste neordonate.
Setați o imagine ca marker a elementelor din listă.
Adăugați culori de fundal la liste și elemente de listă.
Different List Item Markers
Proprietatea list-style-type specifică tipul markerului de element de listă.
O imagine ca marker element de listă
Proprietatea list-style-image specifică o imagine ca marker al elementului de listă.
Poziționează marcatorii de elemente de listă (Position The List Item Markers)
Proprietatea list-style-position specifică poziția marcatorilor de elemente de listă (puncte glonț).
"list-style-position: outside;" - înseamnă că punctele glonț se vor afla în afara articolului din listă. Începutul fiecărei linii a unui element de listă va fi aliniat vertical. Aceasta este implicită.
"list-style-position: inside;" - înseamnă că punctele glonț vor fi în interiorul articolului din listă. Deoarece face parte din elementul listei, acesta va face parte din text și va împinge textul la început.
Eliminați setările implicite
Proprietatea list-style-type:none poate fi utilizată pentru a elimina markerele / gloanțele. Rețineți că lista are, de asemenea, margin și padding implicite. Pentru a elimina acest lucru, adăugați margin: 0 și padding: 0 până la <ul> sau <ol>.
Listă - Proprietatea Shorthand
Proprietatea list-style este o proprietate de tip shorthand. Este utilizat pentru a seta toate proprietățile listei într-o singură declarație.
Când utilizați proprietatea shorthand, ordinea valorilor proprietății este:
list-style-type - (dacă este specificată o imagine-list-style-image, valoarea acestei proprietăți va fi afișată dacă imaginea din anumite motive nu poate fi afișată)
list-style-position - (specifică dacă markerii elementelor de listă trebuie să apară în interiorul sau în afara fluxului de conținut)
list-style-image (specifică o imagine ca marker pentru elementele de listă)
Dacă una din valorile proprietății de mai sus lipsește, valoarea implicită pentru proprietatea lipsă va fi introdusă, dacă există.
Styling List With Colors.
Putem, de asemenea, stiliza listele cu culori, pentru a le face să pară ceva mai interesante.
Orice lucru adăugat la eticheta <ol> sau <ul>, afectează întreaga listă, în timp ce proprietățile adăugate la eticheta <li> vor afecta elementele listei individuale.
list-style Setează toate proprietățile pentru o listă într-o singură declarație.
list-style-image Specifică o imagine ca marker de listă.
list-style-position Specifică poziția markerilor elementelor din listă (puncte glont).
list-style-type Specifică tipul markerului de listă.
CSS Unități
Unități CSS
CSS are mai multe unități diferite pentru exprimarea unei lungimi.
Multe proprietăți CSS iau valori „de lungime” (lenght), cum ar fi lățimea, marja, căptușirea, dimensiunea fontului etc (width, margin, padding, font-size).
Lungimea este un număr urmat de o unitate de lungime, cum ar fi 10px, 2em etc.
Un whitespace nu poate apărea între număr și unitate. Cu toate acestea, dacă valoarea este 0, unitatea poate fi omisă.
Pentru unele proprietăți CSS, lungimile negative sunt permise.
Există două tipuri de unități de lungime: absolută și relativă.
Lungimi absolute (Absolute Lengths)
Unitățile de lungime absolută sunt fixe și o lungime exprimată în oricare dintre acestea va apărea exact ca acea dimensiune.
Unitățile de lungime absolută nu sunt recomandate pentru utilizare pe ecran, deoarece dimensiunile ecranului diferă atât de mult. Cu toate acestea, pot fi utilizate dacă este cunoscut suportul de ieșire, cum ar fi pentru aspectul tipăririi.
cm - centimetri
mm - millimetri
in - inci (1in = 96px = 2.54cm)
px * - pixeli (1px = 1/96th of 1in)
pt - puncte (1pt = 1/72 of 1in)
pc - picas (1pc = 12 pt)
* Pixelii (px) sunt în raport cu dispozitivul de vizualizare. Pentru dispozitivele cu valoare redusă, 1px este un pixel de dispozitiv (punct) al afișajului. Pentru imprimante și ecrane de înaltă rezoluție, 1px implică mai mulți pixeli de dispozitiv.
Lungimi relative (Relative Lengths)
Unitățile de lungime relativă specifică o lungime relativă la o altă proprietate lungime. Unitățile de lungime relativă scalează mai bine între diferite medii de redare.
em - În raport cu dimensiunea fontului elementului (2em înseamnă de 2 ori dimensiunea fontului curent)
ex - În raport cu înălțimea x a fontului curent (rar folosit)
ch - În raport cu lățimea "0" (zero)
rem - Relativ la dimensiunea fontului elementului rădăcină
vw - În raport cu 1% din lățimea afișajului *
vh - În raport cu 1% din înălțimea viewport *
vmin - În raport cu 1% din dimensiunea mai mică a portofoliului *
vmax - În raport cu 1% din dimensiunea mai mare a portofoliului
% - În raport cu elementul părinte
Unitățile em și rem sunt practice în crearea unui aspect scalabil perfect!
* Viewport = dimensiunea ferestrei browserului. Dacă viewport are 50cm lățime, 1vw = 0,5cm.
Asistență browser (Browser Support)
Numerele din tabel specifică prima versiune a browserului care acceptă integral unitatea de lungime.
CSS Tooltip
CSS Tooltip
Creați tooltips cu CSS.
Un tooltip este adesea folosit pentru a specifica informații suplimentare despre ceva când utilizatorul mută indicatorul mouse-ului peste un element.
Basic Tooltip
Creați un tooltip care apare când utilizatorul mută mouse-ul peste un element.
HTML: Utilizați un element container (cum ar fi <div>) și adăugați-i clasa „tooltip”. Când utilizatorul trece cu mouse-ul peste acest <div>, va afișa textul de tip tooltip.
Textul de tip tooltip este plasat în interiorul unui element inline (cum ar fi <span>) cu class = "tooltiptext".
CSS: Clasa tooltip folosește position:relative, care este necesară pentru poziționarea textului tooltip (position:absolute).
Consultați exemplele de mai jos despre cum să poziționați indicatorul.
Clasa tooltiptext conține textul actual de tip tooltip. Este ascunsă în mod implicit și va fi vizibilă în hover (vezi mai jos). De asemenea, i-am adăugat câteva stiluri de bază: 120px lățime (width), culoare de fundal neagră, culoare text alb, text centrat (black background color, white text color, centered text) și 5px top și bottom padding.
Proprietatea CSS border-radius este utilizată pentru a adăuga colțuri rotunjite (rounded corners) tooltip text.
Selectorul :hover este utilizat pentru a afișa textul de tip tooltip atunci când utilizatorul mută mouse-ul peste <div> cu class="tooltip".
Positioning Tooltips
tooltip-ul este plasat la dreapta (left: 105%) a textului „hoverable” (<div>). De asemenea, rețineți că partea de sus:-5px (top:-5px) este utilizată pentru a-l plasa în mijlocul elementului container. Folosim numărul 5 deoarece textul de tip tooltip are o acoperire de 5px în partea de sus și de jos (top and bottom padding). Dacă măriți padding, creșteți și valoarea proprietății de top pentru a vă asigura că aceasta rămâne la mijloc (dacă este ceea ce doriți). Același lucru este valabil dacă doriți ca tooltip să fie plasat la stânga.
Dacă doriți ca tooltip să apară în partea de sus sau de jos ( top sau bottom), consultați exemplele de mai jos. Rețineți că folosim proprietatea margin-left cu o valoare de minus 60 pixeli. Acest lucru este pentru a centra tooltip deasupra/sub (above/below ) textul hoverable. Este setat la jumătatea lățimii tooltip-ului (120/2 = 60).
Instrumente săgeți (Tooltip Arrows)
Pentru a crea o săgeată (arrow) care ar trebui să apară dintr-o parte specifică a tooltip-ului, adăugați conținut „empty” după tooltip, cu pseudo-element class ::after împreună cu proprietatea content. Săgeata în sine este creată folosind borders. Acest lucru va face ca tooltip-ul să pară un speech bubble.
Adăugare săgeată la partea de jos a tooltip-ului.
Poziționarea săgeții în interiorul tooltip: top: 100% va așeza săgeata în partea de jos a tooltip. left: 50% va centra săgeata.
Proprietatea border-width specifică dimensiunea săgeții. Dacă schimbați acest lucru, modificați, de asemenea, valoarea margin-left. Aceasta va menține săgeata centrată.
Border-color este utilizată pentru a transforma conținutul într-o săgeată. Am stabilit top border la negru, iar restul la transparent. Dacă toate părțile ar fi negre, s-ar termina cu o black square box.
Adăugați o săgeată în partea de sus a tooltip.
Adăugați o săgeată la stânga tooltip-ului.
Adăugați o săgeată la dreapta tooltip-ului.
Fade In Tooltips (Animation)
Dacă doriți să aplicați fade în tooltip text când urmează să fie vizibil, puteți utiliza proprietatea CSS transition împreună cu proprietatea opacity și puteți trece de la a fi complet invizibil la 100% vizibil, într-un număr de secunde specificate (1 secundă în exemplul nostru).
PHP Funcții
Funcții PHP
Puterea reală a PHP provine din funcțiile sale.
PHP are peste 1000 de funcții încorporate și, în plus, vă puteți crea propriile funcții personalizate.
Funcții încorporate în PHP (PHP Built-in Functions)
PHP are peste 1000 de funcții încorporate (built-in) care pot fi apelate direct, dintr-un script, pentru a efectua o sarcină specifică.
Funcții definite de utilizator în PHP
Pe lângă funcțiile PHP încorporate (built-in), este posibil să vă creați propriile funcții.
O funcție este un block de declarații care poate fi utilizat în mod repetat într-un program.
O funcție nu se va executa automat atunci când se încarcă o pagină.
O funcție va fi executată de un apel către funcție.
Creați o funcție definită de utilizator în PHP
O declarație de funcție definită de utilizator (user-defined function) începe cu funcția cuvânt:
Sintaxă
function functionName() {
cod de executat;
}
Un nume de funcție trebuie să înceapă cu o literă sau o subliniere (underscore).
Numele funcțiilor NU sunt case-sensitive.
Dați funcției un nume care să reflecte ceea ce face funcția!
În exemplul de mai jos, creem o funcție numită "writeMsg()". Paranteza ondulată de deschidere ({) indică începutul codului funcției, iar paranteza ondulată de închidere (}) indică sfârșitul funcției. Funcția întoarce (outputs ) „Hello world!”. Pentru a apela funcția, trebuie doar să scrieți numele ei urmată de paranteze ():
<?php
function writeMsg() {
echo "Hello world!";
}
writeMsg(); // apelați funcția
?>
Argumentele funcției PHP
Informațiile pot fi transmise funcțiilor prin argumente. Un argument este la fel ca o variabilă.
Argumentele sunt specificate după numele funcției, în interiorul parantezelor. Puteți adăuga oricâte argumente doriți, doar separați-le cu virgulă.
Următorul exemplu are o funcție cu un argument ($fname). Când se numește funcția familyName(), de asemenea, trecem de-a lungul unui nume (de exemplu, Ionescu) și numele este folosit în interiorul funcției, care produce (outputs) mai multe prenume diferite, dar un nume egal:
<?php
function familyName($fname) {
echo "$fname Refsnes.<br>";
}
familyName("Ionescu");
familyName("Popescu");
familyName("Georgescu");
familyName("Filipescu");
familyName("Zinescu");
?>
Următorul exemplu are o funcție cu două argumente ($fname și $year):
<?php
function familyName($fname, $year) {
echo "$fname Refsnes. Născut în $year <br>";
}
familyName("Ionescu", "1975");
familyName("Popescu", "1978");
familyName("Zinescu", "1983");
?>
PHP este un limbaj tiparit mai puțin (PHP is a Loosely Typed Language)
În exemplul precedent, observați că nu trebuie să spunem PHP-ului ce tip de date (data type) este variabila.
PHP asociază automat un tip de date (data type) variabilei, în funcție de valoarea acesteia. Deoarece tipurile de date (data types) nu sunt setate într-un sens strict, puteți face lucruri precum adăugarea unui șir (string) la un număr întreg (integer) fără a provoca o eroare.
În PHP 7, au fost adăugate declarații de tip (type declarations). Aceasta ne oferă opțiunea de a specifica tipul de date (data type) preconizat la declararea unei funcții, iar prin adăugarea declarației strict, va arunca o „Fatal Error” dacă nu există o nepotrivire a tipului de date (data type).
În exemplul următor, încercăm să trimitem atât un număr cât și un șir (string) la funcție fără a folosi o declarația strict:
<?php
function addNumbers(int $a, int $b) {
return $a + $b;
}
echo addNumbers(5, "5 days");
// deoarece NU este activat strict, „5 days” este schimbat în int(5) și va întoarce 10
?>
Pentru a specifica strict trebuie să setăm declarația (strict_types=1);. Aceasta trebuie să fie chiar în prima linie a fișierului PHP.
În exemplul următor încercăm să trimitem atât un număr cât și un șir (string) la funcție, dar aici am adăugat declarația strict:
<?php declare(strict_types=1); // cerință strictă
function addNumbers(int $a, int $b) {
return $a + $b;
}
echo addNumbers(5, "5 days");
// din moment ce strict este activat și „5 days” nu este un număr întreg (integer), va fi afișată o eroare
?>
PHP valoarea argumentului default (PHP Default Argument Value)
Următorul exemplu arată cum se utilizează un parametru default (parametru impicit). Dacă numim funcția setHeight() fără argumente, aceasta are valoarea default (valoarea implicită) ca argument:
<?php declare(strict_types=1); // strict requirement
function setHeight(int $minheight = 50) {
echo "Înălțimea este: $minheight <br>";
}
setHeight(350);
setHeight(); // vom folosi valoarea default (valoarea implicită) of 50
setHeight(135);
setHeight(80);
?>
Funcții PHP - Returnarea valorilor
Pentru a permite unei funcții să returneze o valoare, utilizați instrucțiunea return:
<?php declare(strict_types=1); // cerință strictă
function sum(int $x, int $y) {
$z = $x + $y;
return $z;
}
echo "5 + 10 = " . sum(5, 10) . "<br>";
echo "7 + 13 = " . sum(7, 13) . "<br>";
echo "2 + 4 = " . sum(2, 4);
?>
PHP Declarații de tip return (PHP Return Type Declarations)
PHP 7 acceptă, de asemenea, declarații de tip (Type Declarations) pentru instrucțiunea return. Ca și în cazul declarației de tip (type declaration) pentru argumentele funcției, activând cerința strictă, va returna o „Fatal Error” ca nepotrivire de tip (type mismatch).
Pentru a declara un tip (type) pentru funcția returnată, adăugați două puncte (:) și tipul (type) chiar înainte de paranteza ondulată de deschidere ({) la declararea funcției.
În următorul exemplu, specificăm tipul return (return type) pentru funcție:
<?php declare(strict_types=1); // cerință strictă
function addNumbers(float $a, float $b) : float {
return $a + $b;
}
echo addNumbers(1.2, 5.2);
?>
Puteți specifica un tip de returnare (return type) diferit de cel al argumentelor, dar asigurați-vă că returnarea este cea corectă:
<?php declare(strict_types=1); // cerință strictă
function addNumbers(float $a, float $b) : int {
return (int)($a + $b);
}
echo addNumbers(1.2, 5.2);
?>
PHP OOP - Proprietăți statice
PHP OOP - Proprietăți statice
PHP - Proprietăți statice
Proprietățile statice (static properties) pot fi apelate direct - fără a crea o instanță a unei clase.
Proprietățile statice (static properties) sunt declarate cu ajutorul cuvântului cheie static (static keyword):
Sintaxă
<?php
class ClassName {
public static $staticProp = "lectii-virtuale";
}
?>
Pentru a accesa o proprietate statică, folosiți numele clasei (class name), două puncte duble (::) și numele proprietății (property name):
Sintaxă
ClassName::staticProp;
Să ne uităm la un exemplu:
<?php
class pi {
public static $value = 3.14159;
}
// Obțineți proprietăți statice (static property)
echo pi::$value;
?>
Exemplu explicat
Aici, declarăm o proprietate statică (static property): $value. Apoi, facem echo valoarea proprietății statice folosind numele clasei (class name), două puncte duble (::) și numele proprietății (property name): (fără a crea mai întâi o clasă).
PHP - Mai multe despre proprietățile statice
O clasă poate avea atât proprietăți statice, cât și nestatice (static and non-static properties). O proprietate statică (static property) poate fi accesată dintr-o metodă din aceeași clasă folosind cuvântul cheie self (self keyword) și două puncte duble (::):
<?php
class pi {
public static $value=3.14159;
public function staticValue() {
return self::$value;
}
}
$pi = new pi();
echo $pi->staticValue();
?>
Pentru a apela o proprietate statică (static property) dintr-o clasă copil (child class), utilizați cuvântul cheie părinte (parent keyword) din cadrul clasei copil (child class):
<?php
class pi {
public static $value=3.14159;
}
class x extends pi {
public function xStatic() {
return parent::$value;
}
}
// Obțineți valoarea proprietății statice (static property ) direct prin intermediul clasei copil (child class)
echo x::$value;
// sau obțineți valoarea proprietății statice (static property) prin metoda xStatic() (xStatic() method)
$x = new x();
echo $x->xStatic();
?>
