Hiển thị các bài đăng có nhãn bloger. Hiển thị tất cả bài đăng
Hiển thị các bài đăng có nhãn bloger. Hiển thị tất cả bài đăng

Thứ Ba, 23 tháng 7, 2013

Thêm codeview vào bài viết





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 15px 15px 15px;
 padding : 10px;
 clear : both;
 list-style-type : none;
background : #f9f9f9 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0ZPPBSUEdjFcq5cCYdfmkoQPgzwl-7Jo-wxTRmuG0oHq1C7vFKA0FJl9H-WGO0zmzKKBX7wOYtkcXUNhDAG5bengeEWGVKiG8G6xWkNkGRN-cuYrOhAWCHkBVfW89k0j0ov0hwOhUkA/s1600/codeviewhtshop.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; }




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ẻ sau

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


st internet