•
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 tag se foloseste pentru a adauga liste in elemente <ul> si <ol>?
<dt> <dd> <li><ul>
<li>http://coursesweb.net/html/</li>
<li>http://www.marplo.net/html/</li>
</ul>
Care valoare a proprietatii "display" seteaza elementul ca tip bloc si afiseaza un punct in fata?
block list-item inline-block.some_class {
display: list-item;
}Care instructiune JavaScript transforma un obiect in sir JSON.
JSON.parse() JSON.stringify eval()var obj = {
"courses": ["php", "javascript", "ajax"]
};
var jsonstr = JSON.stringify(obj);
alert(jsonstr); // {"courses":["php","javascript","ajax"]}Indicati clasa PHP folosita pentru a lucra cu elemente HTML si XML in PHP.
stdClass PDO DOMDocument$strhtml = '<body><div id="dv1">CoursesWeb.net</div></body>';
$dochtml = new DOMDocument();
$dochtml->loadHTML($strhtml);
$elm = $dochtml->getElementById("dv1");
echo $elm->nodeValue; // CoursesWeb.netIndicati forma de Prezent Continuu a verbului "to live" (a trai /a locui)
lived living liveingI`m living here.
- Traiesc /Locuiesc aici.
Care este forma de Gerunziu (sau Participiu Prezent) a verbului "vivir" (a trai /a locui)?
vivió vivido viviendoEstoy viviendo aquí.
- Traiesc /Locuiesc aici.