Khi bắt tay vào làm viết Blog, với một người không chuyên mình rất khó khăn và loai hoai khi triển khai bài viết không nỗi bật hoặc không đúng ý. Mình đã tìm tòi những chia sẽ trên mạng và cũng tìm được những chia sẻ hay, đáp ứng được những nhu cầu của bài viết. Với mục đích tạo ra một nơi tập trung lưu giữ những đoạn code này (khi nào quên thì còn có chổ tra cứu lại cho nhanh 😀) và đồng thời cũng chia sẻ lại với các bạn blogger khác. Mình sẽ viết một loại bài về vấn đề này, trước tiên mình sẽ chia sẽ những đoạn code đã sưu tầm được và sẽ có bài bổ sung khi tìm được được những đoạn code hay khác.

Phần 1


Với việc chia sẻ những đoạn code thì việc hiển thị nó trên bài viết sao cho tiện lợi cho copy là cần thiết. Vì thế, đầu tiên mình sẽ chia sẻ đoạn code hiển thị code trên bài viết.

Mẫu 1:

Đây là 1 đoạn code HTML, bạn có thể chuyển qua chế độ soạn thảo HTML để chèn đoạn code này vào.

<pre style="border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; border: 1px solid rgb(153, 153, 153); margin: 15px 30px 10px; overflow: auto; padding: 2px 10px; word-wrap: break-word;">
CODE Ở ĐÂY
</pre>



.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #FFFBCC ;
border-top : 1px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
max-height: 250px;
overflow: auto;
font-size : 13px;
line-height : 24px;
font-family : Courier New, MS Sans Serif, sans-serif, serif;
color : #b45f06;
font-weight : normal;
margin : 0;
padding : 10px;
}