•
Pentagon
•
Hexagon
•
Octogon
Cateva
forme de poligoane, create doar cu un singur tag DIV si proprietati CSS.
Paralelogram
- Continutul din paralelogram e distorsionat in functie de forma paralelogramului.
Cod:
<style type="text/css">
#parallelogram{
margin:5px 0 5px 20px;
width: 150px;
height: 100px;
-webkit-transform: skew(20deg);
-moz-transform: skew(20deg);
-o-transform: skew(20deg);
background: #abcdef;
}
</style>
<div id="parallelogram">Cursuri Jocuri Anime<br/>MarPlo.net</div>
Rezultat:
Cursuri Jocuri Anime
MarPlo.net
Pentagon
Cod:
<style type="text/css">
#pentagon {
margin:70px 0 5px 20px;
position: relative;
width: 110px;
border-width: 100px 36px 0;
border-style: solid;
border-color: #abefcd transparent;
}
#pentagon:before {
content: "";
position: absolute;
height: 0;
width: 0;
top: -170px;
left: -36px;
border-width: 0 90px 70px;
border-style: solid;
border-color: transparent transparent #abefcd;
}
/* Content in pentagon */
#pentagon div{
position:absolute;
top:-50px;
}
</style>
<div id="pentagon"><div>MarPlo.net</div></div>
Rezultat:
Hexagon
Cod:
<style type="text/css">
#hexagon {
width: 100px;
height: 55px;
background: #cdabef;
position: relative;
}
#hexagon:before {
content: "";
position: absolute;
top: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 25px solid #cdabef;
}
#hexagon:after {
content: "";
position: absolute;
bottom: -25px; left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 25px solid #cdabef;
}
</style>
<div id="hexagon">MarPlo.net</div>
Rezultat:
Octogon
Cod:
<style type="text/css">
#octagon {
width: 100px;
height: 100px;
background: #a0e8a1;
position: relative;
}
#octagon:before {
content: "";
position: absolute;
top: 0;
left: 0;
border-bottom: 29px solid #a0e8a1;
border-left: 29px solid #eee;
border-right: 29px solid #eee;
width: 42px;
height: 0;
}
#octagon:after {
content: "";
position: absolute;
bottom: 0;
left: 0;
border-top: 29px solid #a0e8a1;
border-left: 29px solid #eee;
border-right: 29px solid #eee;
width: 42px;
height: 0;
}
</style>
<div id="octagon"></div>
Rezultat:
Un Test simplu in fiecare zi
HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce atribut indica faptul ca un camp de formular trebuie completat?
required="required" autofocus="autofocus" placeholder="text"<input type="text" name="name1" required="required" />
Ce metoda CSS misoreaza sau mareste dimensiunile unui element (inclusiv continutul)?
translate() scale() skew()#some_id:hover {
transform: scale(2, 1.5);
-ms-transform: scale(2, 1.5); /* IE 9 */
-moz-transform: scale(2, 1.5); /* Firefox */
}Click pe metoda obiectului Date care returneaza ziua din luna.
setDate() getMonth() getDate()var rightnow = new Date();
var day = rightnow.getDate();
alert(day);
Ce functie este folosita pentru a incarca un fisier pe server?
is_file() move_uploaded_file() fopen()if(move_uploaded_file($_FILES["field_name"]["tmp_name"], "dir/file_name")) {
echo "Fisierul a fost incarcat";
}Cum se spune in engleza expresia: "Ploua cu galeata"?
rain cats and dogs rain buckets quiet rainIn Bucharest it`s raining cats and dogs.
- In Bucuresti ploua cu galeata.
Cum se spune in spaniola expresia: "Ploua cu galeata"?
llover cubo llover a cántaros lluvia tranquilaEn Madrid está lloviendo a cántaros.
- In Madrid ploua cu galeata.