• 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

Thêm 1 số mẫu trình bày code đẹp cho blog.

35
18/01/2012

Trước đây thủ thuật blogger đã đưa ra một số mẫu trình bày code khá đẹp và hôm nay mình cũng muốn đóng góp thêm 1 số mẫu trình bày code khác khá bắt mắt.


Bắt đầu vào vấn đề chính đây.

Chèn đoạn code bạn chọn vào trước thẻ ]]></b:skin>
Mẫu 1
.code {
border-radius:20px 0;
max-height:250px;
min-height:50px;
margin : 10px;
padding : 10px;
clear : both;
list-style-type : none;
overflow:auto;
color:#FFF;
text-shadow: 0 -1px 1px #a52676;
border:none;
background:#de45a6;
background: -moz-linear-gradient(top, #e54aac, #f374c5 95%, #d3469f);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e54aac), color-stop(.9, #f374c5), to(#d3469f));
filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#d3469f', EndColorStr='#f374c5'); /* IE6,IE7 only */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#d3469f', EndColorStr='#f374c5')"; /* IE8 only */
box-shadow: inset 5px 5px 5px #9d2a6e, 0 1px 0px #fad1e9;
-webkit-box-shadow: inset 5px 5px 5px #9d2a6e, 0 1px 0px #fad1e9;
-moz-box-shadow: inset 5px 5px 5px #9d2a6e, 0 1px 0px #fad1e9;
}

Mẫu 2
.code {
border-radius:20px 0;
max-height:250px;
min-height:50px;
margin : 10px;
padding : 10px;
clear : both;
list-style-type : none;
overflow:auto;
background: #E6E6E6;
background: -moz-linear-gradient(top, #FFF, #f5f5f5 5%, #e2e2e2 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFF), color-stop(.03, #f5f5f5), to(#e2e2e2));
filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f5f5', EndColorStr='#e2e2e2'); /* IE6,IE7 only */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f5f5', EndColorStr='#e2e2e2')"; /* IE8 only */
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border:1px solid #d0d0d0;
border-bottom:1px solid #b5b5b5;
color:#5e5e5e;
text-shadow: 1px 1px 1px #FFF}

Mẫu 3
.code {
border-radius:20px 0;
max-height:250px;
min-height:50px;
margin : 10px;
padding : 10px;
clear : both;
list-style-type : none;
overflow:auto;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
color:#FFF;
text-shadow: 0 1px 1px #0f739d;
background: #40addb;
background: -moz-linear-gradient(top, #d1edfa, #73cef5 5%, #49acd6);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d1edfa), color-stop(0.03, #73cef5), to(#49acd6));
filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#73cef5', EndColorStr='#49acd6'); /* IE6,IE7 only */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#73cef5', EndColorStr='#49acd6')"; /* IE8 only */
border-bottom:1px solid #2581a8;}

Mẫu 4
.code {
border-radius:20px 0;
max-height:250px;
min-height:50px;
margin : 10px;
padding : 10px;
clear : both;
list-style-type : none;
overflow:auto;
color:#FFF;
text-shadow: 0 -1px 1px #0d3474;
border:none;
background: #3675da;
background: -moz-linear-gradient(top, #4986e8, #76b8fc 95%, #4986e8);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #4986e8), color-stop(.9, #76b8fc), to(#4986e8));
filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#4986e8', EndColorStr='#76b8fc'); /* IE6,IE7 only */
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#4986e8', EndColorStr='#76b8fc')"; /* IE8 only */
box-shadow: inset 0px 2px 5px #1c4c7d, 0 1px 0px #c9d5e8;
-webkit-box-shadow: inset 0px 2px 5px #1c4c7d, 0 1px 0px #c9d5e8;
-moz-box-shadow: inset 0px 2px 5px #1c4c7d, 0 1px 0px #c9d5e8;}

Save Template lại.
Sau này mỗi lần trình bài code thì bạn đặt đoạn code vào như dạng sau:

<div class="code">
Nội dung đoạn code
</div>

{35 bình luậnAdd yours ?}

10:36:00, 18 thg 1, 2012

ối dồi, màu hồng cơ à anh, sao hnay lãng mạn vậy ;))

Reply
12:08:00, 18 thg 1, 2012

Cái này sơ cấp, em nghĩ anh nên tổng hợp một bài tương tự rồi đưa ra các style khác nhau để hoàn chỉnh 1 bài

Reply
12:18:00, 18 thg 1, 2012

Mình đóng góp một chút nhé? Tại sao không dùng chức năng quote trong phần viết bài của Blogger nhỉ, như vậy chỉ cần chỉnh css dạng blockquote{...} và mỗi khi chèn code thì chỉ cần vài click là được :1)

Reply
12:47:00, 18 thg 1, 2012

@Nguyen DucÝ hay, mình sẽ update thêm 1 số mẫu rùi edit bài này lại luôn.

Reply
12:58:00, 18 thg 1, 2012

@Nguyễn Việt PhươngMuốn sử dụng như blockquote thì bạn chỉ việc thay .code trong bước 1 bằng .post-body blockquote sau này viết bài cứ đặt code trong blockquote là được

Reply
18:23:00, 18 thg 1, 2012

@Nguyễn Việt Phương Có thể tạo ra nhiều mẫu khác nhau để ta dễ phân loại nội dung mà ví dụ như "blockquote" để phân mục ghi chú, còn "code" để phân mục code, như thế cho người đăng có nhiều lựa chọn làm cho bài viết thêm phong phú mà

Reply
19:37:00, 18 thg 1, 2012

Theo cá nhân thì bài này cũng không cần thiết lắm , chỉ cần 1 bài tổng quát về cách thức sử dụng DIV , CLASS ... còn tuỳ biến màu sắc , kích thước thì do người dùng .

Reply
21:01:00, 18 thg 1, 2012

Thủ thuật này khá hay, nhưng em có tin này mới toanh nè, con ông giời vừa mới bị đày xuống trần gian...

http://tranhung09.blogspot.com/2012/01/moi-cac-ban-qua-nha-minh-choi-hay-en-ma.html

Reply
20:19:00, 22 thg 1, 2012

Chúc mừng 5 mới nhá

Reply
08:01:00, 23 thg 1, 2012

Bước qua năm mới, chúc anh Hà có 1 năm vạn sự như ý và tràn ngập niềm vui :D) :D) :D)

Reply
21:19:00, 23 thg 1, 2012

He he,nam moi nhieu thanh cong nha

Reply
00:51:00, 24 thg 1, 2012

2012 roi, Mung them 1 tuoi !

Reply
22:02:00, 29 thg 1, 2012

Cung chúc tân xuân
Vạn sự như ý :D

Reply
14:03:00, 9 thg 2, 2012

Admin có thể chỉ mình cách chèn 1 đọan thông báo và công cụ [chèn link], [chữ đậm], [chữ nghiêng] ... trước khi nhập nhận xét cho Blog không?
Cảm ơn nhiều

Reply
20:01:00, 16 thg 2, 2012

@ Hien Nguyen: Khiêm tốn chút đi bạn ơi :9)

Reply
21:46:00, 17 thg 2, 2012

@Hien Nguyen Bạn thật là Pro đó

Reply
23:16:00, 17 thg 2, 2012

@Hien Nguyen Vậy thì bạn thuộc dạng pro rồi . Mốt nghĩ ra ý tưởng gì mình "phác họa" còn bạn coding nhé !
CÒn nếu mà cảm thấy chỉ có việc copy và paste code của những coders thì tốt nhất là nên im lặng mà dùng thôi bạn ạ .
Phán 1 câu mà bốc mùi ko chịu dc .
Nhìn blog bạn là cũng hiểu dc bạn ntn !
P/s : các bác cho em chém tí vì mấy aci1 thể loại này em chúa ghét !

Reply
13:06:00, 10 thg 3, 2012

@ Vatinam+
Chán quá, sao anh cứ vắng nhà hoài vậy nhỉ?

Reply
16:41:00, 15 thg 3, 2012

Anh ơi, em biết hỏi câu này hơi lơ ngơ nhưng thấy anh chuyên nghiệp quá nên với anh chắc sẽ dễ dàng thôi. Vấn đề comment trong bolg của em nhiều thủ tục quá, anh có cách nào để cho người xem chỉ cẩn để lại emial và tên là có thể comment được không? và cả mấy vụ hỏi mật mã nữa (nhìn mấy chữ uốn éo rồi gõ ra đó), với những bạn có gmail muốn comment thì phải tạo 1 bolg, còn mấy bạn yahoo thì phải tạo lại gmail. Anh giúp em với, bolg của em toàn "ẩn danh" comment k, em chẳng biết ai là cả. Cầu xin sự giúp đỡ của anh vạn lần và cũng muốn cám ơn anh nhiều nhiều.
(Viết nhiều lời cảm ơn quá em sợ spam) ^^
Chờ hồi đáp của anh

Reply
16:44:00, 15 thg 3, 2012

Anh ơi, em biết hỏi câu này hơi lơ ngơ nhưng thấy anh chuyên nghiệp quá nên với anh chắc sẽ dễ dàng thôi. Vấn đề comment trong bolg của em nhiều thủ tục quá, anh có cách nào để cho người xem chỉ cẩn để lại emial và tên là có thể comment được không? và cả mấy vụ hỏi mật mã nữa (nhìn mấy chữ uốn éo rồi gõ ra đó), với những bạn có gmail muốn comment thì phải tạo 1 bolg, còn mấy bạn yahoo thì phải tạo lại gmail. Anh giúp em với, bolg của em toàn "ẩn danh" comment k, em chẳng biết ai là cả. Cầu xin sự giúp đỡ của anh vạn lần và cũng muốn cám ơn anh nhiều nhiều.
(Viết nhiều lời cảm ơn quá em sợ spam) ^^
Chờ hồi đáp của anh

Reply
11:54:00, 27 thg 3, 2012

Sao lâu rồi không thấy anh Hà xuất hiện nhỉ?

Reply
20:55:00, 6 thg 4, 2012

Trang này giờ bỏ đi rồi afh bạn admin

Reply
21:14:00, 8 thg 4, 2012

Blog của chú (Nhật hà) không hiển thị tốt trên internet explorer 6 đâu, lo mà khắc phục đi nhé, chuối củ quá.....

Reply
14:12:00, 7 thg 5, 2012

giúp mình chèn Banner flash vào trên cùng của Blog với..mình không biết làm

http://360vnteam.blogspot.com/

Reply
10:17:00, 18 thg 6, 2012

thủ thuật hay, tks!

Reply
11:36:00, 10 thg 5, 2013

Hay quá.
Đã áp dụng cho site mình
tin shock

Reply
16:30:00, 16 thg 12, 2014

Dịch vụ nạp tiền điện thoại online nhanh chóng tiện lợi chiết khấu cao.
Key: Viettel khuyến mãi | Viettel khuyen mai thang 9 | cách nạp tiền viettel

Reply
15:20:00, 25 thg 3, 2015

chào anh. cho em hỏi nếu em muốn gắn một khung chat trực tuyến vào blogspot giống như trang uhchat.net thì e phải gắn code vào template như thế nào. hay gắn ở đâu?? em chèn code vào mà nó ko hiện gì cả. anh có thể viết bài thủ thuật về nó ko??? cảm ơn anh

Reply
01:14:00, 28 thg 11, 2016

đâu có sai đâu

du lịch

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