Thủ thuật tạo khung độc đáo chứa code trong blogspot

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 ? Chúng ta sẽ biết sau khi đọc xong bài viết sau đây !

Đầ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>