Two
diamond shapes, simple created with a single DIV tag and CSS properties.
Code:
<style type="text/css">
#diamond {
width: 0;
height: 0;
border: 50px solid transparent;
border-bottom: 20px solid #05ed08;
position: relative;
top: -50px;
}
#diamond:after {
content: "";
position: absolute;
left: -50px;
top: 20px;
width: 0;
height: 0;
border: 50px solid transparent;
border-top: 70px solid #05ed08;
}
</style>
<div id="diamond"></div>
Demo:
Diamond shield
Diamond 2
Code:
<style type="text/css">
#diamond {
border-style: solid;
border-color: transparent transparent #0809fe transparent;
border-width: 0 25px 25px 25px;
height: 0;
width: 50px;
position: relative;
margin: 10px 0;
}
#diamond:after {
content: "";
position: absolute;
top: 25px;
left: -25px;
width: 0;
height: 0;
border-style: solid;
border-color: #0809fe transparent transparent transparent;
border-width: 70px 50px 0 50px;
}
</style>
<div id="diamond"></div>
Demo:
Daily Test with Code Example
HTML
CSS
JavaScript
PHP-MySQL
Which tag is used to add lists into <ul> and <ol> elements?
<dt> <dd> <li><ul>
<li>http://coursesweb.net/html/</li>
<li>http://coursesweb.net/css/</li>
</ul>
Which value of the "display" property creates a block box for the content and ads a bullet marker?
block list-item inline-block.some_class {
display: list-item;
}Which instruction converts a JavaScript object into a JSON string.
JSON.parse() JSON.stringify eval()var obj = {
"courses": ["php", "javascript", "ajax"]
};
var jsonstr = JSON.stringify(obj);
alert(jsonstr); // {"courses":["php","javascript","ajax"]}Indicate the PHP class used to work with HTML and XML content 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.net