Tạo khung độc đáo chứa code trong Blogger

Thông thường, khi giới thiệu code , chúng ta hay đặt chúng ngay trên bài viết. Vì cùng nằm trên một nền nên nhiều khi trông rất lộn xộn . Vậy phải làm sao để phần giới thiệu ở nền blog chính thức , còn đoạn code ở trong một khung có nền tùy chỉnh ? Tại weblog www.vnpressnet.com thủ thuật này được phattrien@so áp dụng thủ thuật Blockquote, tuy nhiên còn một cách khác được giới thiệu bời boyprodx mà bạn sẽ biết sau khi đọc xong bài viết sau đây !

Thủ thuật về Post – Comment:

>> Hướng dẫn cách tạo phong cách báo chí trong bài viết của Blogspot

>> Tạo 'Read More' (đọc tiếp) một cách tự động - Hỗ trợ ảnh thumbnail

>> Thủ thuật blog: Làm nổi bật nhận xét của bạn – Highlight Author Comment.

Đầu tiên, các bạn hãy vào Trình bày (Layout) và chọn tab Chỉnh sửa HTML mà không cần bật Mở rộng mẫu tiện ích . Sau đó , hãy thêm đoạn code dưới đây ngay trên thẻ ]]></b:skin>

.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9 url(http://i259.photobucket.com/albums/hh283/boy_proDX/framecode.gif) no-repeat right bottom;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
font-size : 13px;
line-height : 24px;
font-family : "Courier New", "MS Sans Serif", sans-serif, serif;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}

Ghi chú : Bạn có thể thay đổi phần chữ màu đỏ theo ý thích

Vậy là các bạn đã tạo xong thuộc tính đặt code trong một khung độc đáo rồi đấy .
Từ giờ , bạn có thể thêm code vào bất cứ đâu trên bài viết với thẻ <div> sau

<div class="codeview">
Điền code vào đây
</div>

Bạn có thể xem bài viết gốc và demo thủ thuật này tại: http://boyprodx.blogspot.com Tags: Breakingnews, Khoi tao Blog, Post