• Tư vấn điều trị
      bệnh khàn tiếng


    www.trikhantieng.com

    Liên hệ + 0913163316

BlogList111

Việt Nam Gia Phả, nơi lưu trữ Gia Phả của người Việt Nam  Kiến thức Blogspot Ngonluanho: Nhung cau chuyen thap lua-Tin-Cay-Men Vngreenzone Là một nơi chia sẻ kinh nghiệm làm blogger - Nơi tôn vinh tâm hồn blogger Việt

Trang trí khung hiển thị code trên Blogger

1
14/10/2010

Đôi khi bạn cũng muốn trang trí khung hiển thị các đoạn mã (code) cho đẹp mắt. Để thực hiện điều này, bạn cần phải tạo một class riêng cho đoạn mã, có thể đặt tên là "codeview" và đặt đoạn mã vào trong thẻ div, theo như bên dưới:

<div class="codeview">
{dán code đơn giản hoặc code đã mã hóa vào đây}
</div>

Phần trên sẽ được đặt vào trong bài viết tại vị trí muốn hiển thị code.
Để đăng được bài viết có hiển thị code thì phải tiến hành chèn một đoạn mã vào phần CSS của Template.

Vào Thiết kế (Design) - Chỉnh sửa HTML (Edit HTML) rồi chèn code của các kiểu bên dưới lên trên dòng code ]]></b:skin> trong Template.

Dưới đây là các kiểu định dạng CSS cho codeview.
1. Kiểu 1:

.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9 url(http://farm4.static.flickr.com/3415/3555944482_d0433d99fe_o.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;
}

2. Kiểu 2:
.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 20px solid #CECECE;
}

3. Kiểu 3:
.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #f9f9f9 url(http://farm4.static.flickr.com/3575/3555191103_7ce001f502_o.gif) no-repeat right top;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}

Chú ý: Nên tải các file hình ảnh qua đường link đánh dấu màu xanh về và upload lên webhost của riêng bạn để tránh hạn chế băng thông.

Tham khảo theo Fandung.com

{1 bình luậnAdd yours ?}

nguyen_libra
16:09:00, 23 thg 12, 2010

Hjhj, em thích cái này ghê luôn anh Hà ơi, nó hiện ra đẹp lắm! Thanks u very much.

Reply
Nội quy! Đóng lại Khi bạn viết bình luận, cần tuân thủ một số quy tắc sau:
» Bình luận phải nghiêm túc và không chứa các liên kết quảng cáo.
» Có thể sử dụng các thẻ <b> … </b>,<i> … </i>, <a href="URL..."> ... </a>.
» Yêu cầu thủ thuật tại mục Yêu cầu thủ thuật hoặc hỏi tại mục Hỏi và Đáp.
More →
Chữ đậm Chữ nghiêng Chữ nghiêng 2 Chèn Link Chèn Link Mã hóa code Help ?Nhấn vào biểu tượng hoặc kiểu chữ hoặc chèn link sau đó nhấn nút Chọn rồi copy (Ctrl + C) để paste (Ctrl + V) vào khung viết bình luận. Mã hóa code nếu bạn muốn đưa code vào bình luận.

Chọn Xóa

Next post: Bài đăng Mới hơn

Previous post: Bài đăng Cũ hơn