•
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
Clic pe tag-ul care creaza o lista ordonata numeric
<ul> <tr> <ol><ol>
<li>List-1</li>
<li>List-2</li>
</ol>
Care selector reprezinta ID-ul unui element in CSS
.nume #nume nume#id {
color: #0110fb;
}
Ce cod creaza un obiect in JavaScript?
{} [] new Date()var obj = {"site": "CoursesWeb.net", "pr": 5};
alert(obj.site);
Indicati instructiunea prin care se verifica daca o conditie este True sau False
else if() switch()$var = 8;
if($var == 8) echo $var;
Indicati timpul Prezent pentru verbul "to be" (a fi).
be were isNow, it is here.
- Acum este aici.
Care este conjugarea la timpul prezent al verbului "divertirse" (a se distra) la forma "yo"?
te diviertas me divierto se diviertaYo me divierto.
- Eu ma distrez.