[Bloger-TT] Cách hiển thị code và khung thông báo

 Hiển thị code trong Blogger thật dễ dàng hơn .


Đầu tiên , kiếm




chèn đoạn code sau vào trước

.post code{font-family:"Courier New",monospace;
line-height:1.3em;border:1px dotted #DDD;background:#ffffff;
margin:10px 0;padding:10px 10px;font-size:13px;display:block}



Có thể tuỳ biến màu nền theo ý thích.Gio bạn chỉ việc vào đăng bài và chèn như sau:

<code>Đoạn nội dung</code>
Như vậy ta đã có thể hiển thị code trong Blogger một cách dễ dàng

======================================================================
Muốn hiển thị khung thông báo thì làm như sau:

<style type="text/css">
.note{background:#FFEA97 url(http://goo.gl/w4a2f)
repeat-x 0 0;color:#796100;width:83%;font-weight:normal;
padding:13px 15px 0;margin-bottom:2.5em;
border:1px solid #E1B500;-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(http://goo.gl/6kexs) 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(http://goo.gl/6kexs) no-repeat 100% 0;width:33px;height:40px;position:absolute;left:-34px;top:9px}
</style>
<div class="note"><h5>Lưu ý!</h5>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua...</p>
<ul>
<li>Vivamus mattis nibh sed purus ullamcorper mollis.</li>
<li>Phasellus egestas nulla lobortis est eleifend dapibus.</li>
<li>Morbi at nisi blandit eros rhoncus gravida et quis leo.</li>
</ul><span></span></div>




Nguồn bài viết từ http://noct-land.blogspot.com