Trapezoid shape with a DIV tag and CSS properties. The trapezoid shape is created by borders.
Code:
<style type="text/css">
#trapezoid {
height: 0;
width: 120px;
border-bottom: 80px solid #05ed08;
border-left: 45px solid transparent;
border-right: 45px solid transparent;
padding: 0 8px 0 0;
}
</style>
<div id="trapezoid"><br/>CSS Course:<br/>
CoursesWeb.net</div>
Demo:
CSS Course:
CoursesWeb.net
Rectangular Trapezoid
Code:
<style type="text/css">
#rtrapezoid {
height: 0;
width: 120px;
border-bottom: 100px solid #05ed08;
border-left: 15px solid #05ed08;
border-right: 45px solid transparent;
padding-right: 20px;
}
</style>
<div id="rtrapezoid"><br/>CSS Course:<br/>
CoursesWeb.net</div>
Demo:
CSS Course:
CoursesWeb.net
Daily Test with Code Example
HTML
CSS
JavaScript
PHP-MySQL
What attribute makes a radio button or checkbox input selected?
checked="checked" selected="selected" disabled="disabled"<input type="checkbox" name="a_name" value="value" checked="checked" />
What CSS value scales the background image to the largest size contained within the element?
repeat-x contain linear-gradient#id {
background:url("path_to_image.png");
background-size:contain;
background-repeat:no-repeat;
}What operator is used to determine the rest of the division of two numbers?
% * /var rest8_7 = 8 % 7;
alert(rest8_7);
Indicate the PHP function that rounds a number up to the next highest integer.
floor() ceil() abs()$nr = ceil(3.5);
echo $nr; // 4