การใช้ Border Code ในภาษา HTML
ลักษณะความกว้าง ของ Border
Produces ThisCODE
HELLO ITOPPLUS
style="border: 1px solid #000;"
<div style="border: 1px solid #000;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="border-left: 2px solid #000;"
<div style="border-left: 2px solid #000;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="border-right: 3px solid #000;"
<div style="border-right: 3px solid #000;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="border-top: 4px solid #000;"
<div style="border-top: 4px solid #000;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="border-bottom: 10px solid #f00;"
<div style="border-bottom: 10px solid #f00;">HELLO ITOPPLUS</div>


ปรับแต่ง Border
Produces ThisCODE
HELLO ITOPPLUS
style="border: 2px dotted #000;"
<div style="border: 2px dotted #000;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="2px dashed #000"
<div style="border: 2px dashed #000;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="border: 2px solid #000;width: 50%;"
<div style="border: 2px solid #000;width: 50%;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="border: 5px solid #f00;"
<div style="border: 5px solid #f00;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="border: 2px solid #f00;
box-shadow: 3px 3px 3px 0px #00000069;"
<div style="border: 2px solid #f00;box-shadow: 3px 3px 3px 0px #00000069;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="border: 5px solid #6cda4c;
border-radius: 10px 20px 30px 40px;"
<div style="border: 5px solid #6cda4c;border-radius: 10px 20px 30px 40px;">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="border: 5px solid #6cda4c;
background-image: url('...');
<div style="border: 5px solid #6cda4c;background-image: url(http://itp1.itopfile.com/ImageServer/707dbe7f91af7ddb/0/0/1z-z166476456825.jpg);">HELLO ITOPPLUS</div>
HELLO ITOPPLUS
style="background:linear-gradient(to right, red, purple);padding:5px;"
style="background:#222;padding:10px;color:#fff;"
<div style="background: linear-gradient(to right, red, purple);padding:5px;">
<div style="background: #222;padding:10px;color: #fff;">HELLO ITOPPLUS</div></div>