Css có ích khi viết bài

Lưu ý đây là demo!

Chào mừng bạn đến với vienduongtech.com

• Vui lòng để lại một comment góp ý.
• Bấm nút +1 nếu bạn thấy thích bài viết này.
• Chúc thành công!.

những đoạn có mũi tên nhưng trên là áp dụng thẻ li còn lại thì cứ ghi như bình thường

bạn áp dụng code sau:

<style type="text/css">
.note{background:#f0fdff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNz7b7o5PNTTR0tuibzAhyphenhyphenDB-gppu8gQ4fdH6JHJwLg9YbM3PZTxgkOEtbanj1pNPnnICaaJmmIihroqJ-ihzHQl-hODoWF67YDy7WKIUjaBa9M_b1W2TwWSqpZ2iK-c_4vzw964p7bw/s1600/notice-bg-namkna-blogspot-com.png) repeat-x 0
0;color:#796100;width:83%;font-weight:normal;padding:13px 15px
0;margin-bottom:2.5em;border:1px solid #306EFF;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;-moz-box-shadow:1px
 1px 2px rgba(0,0,0,.4);-webkit-box-shadow:1px 1px 2px
rgba(0,0,0,.4);box-shadow:1px 1px 2px
rgba(0,0,0,.4);position:relative;left:34px}.note
p{margin-bottom:1.5em}.note p:last-child{margin-bottom:0}.note
ul{margin-left:8px;margin-bottom:1.5em}.note
ul:last-child{margin-bottom:0}.note
li{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCS_hmQDAloxDGbndkXLYdZDIRfF4AAdKvPUBe4owmVopISRmeF5kdQKHF1xWKnNcU04K3J18Y6neFzmeY8IVr1C8YauXAsD0zbfnl_DyURY4fTpv9nqSNtf5D9fyJJR_XPwBYGxsA6Zs/s1600/notice-tabs-namkna-blogspot-002.png) no-repeat 0
-95px;list-style-type:none;padding-left:18px;margin-bottom:.75em}.note
h5{font-size:14px;font-weight:bold;margin:0 0 .65em}.note
span{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCS_hmQDAloxDGbndkXLYdZDIRfF4AAdKvPUBe4owmVopISRmeF5kdQKHF1xWKnNcU04K3J18Y6neFzmeY8IVr1C8YauXAsD0zbfnl_DyURY4fTpv9nqSNtf5D9fyJJR_XPwBYGxsA6Zs/s1600/notice-tabs-namkna-blogspot-002.png) no-repeat 100%
0;width:33px;height:40px;position:absolute;left:-34px;top:9px}
</style>

<div class="note">
<h5>
Lưu ý!</h5>
Chào mừng bạn đến với ...<br />
<ul>
<li>Vui lòng để lại một comment góp ý.</li>
<li>Bấm nút +1 nếu bạn thấy thích bài viết này.</li>
<li>Chúc thành công!.</li>
</ul>
</div>
</div>

đây là code 2

đây là code 2

đây là code 2

đây là code 2

1. Nút

demo

2. Thay đổi ảnh khi rê chuột vào
<a href="URL ADDRESS"><img src="URL OF THE FIRST IMAGE GOES HERE" onmouseover="this.src='URL OF THE SECOND IMAGE GOES HERE'" onmouseout="this.src='URL OF THE FIRST IMAGE GOES HERE'" /></a>