Tạo một Khu vực Text Customized Trong Blogger Sử dụng CSS đơn giản

Tạo một Khu vực Text Customized Trong Blogger Sử dụng CSS đơn giản

Tóm tắt và bài viết chính xác là luôn luôn đánh giá cao cả du khách và công cụ tìm kiếm. Diện tích văn bản hoặc các hộp văn bản thực sự là một cách dễ dàng để chia sẻ số lượng lớn các mã lớn với độc giả của bạn. Blogger viết hướng dẫn trong thiết kế hoặc lĩnh vực phát triển, thường xuyên chia sẻ CSS, HTML, XML và các mã JavaScript bên trong một Blockquote.Phương pháp này chắc chắn có thể được thông qua nhưng chỉ để hiển thị mã số ngắn hay viết văn bản nhưng nếu bạn muốn chia sẻ mã thực sự dài và cồng kềnh thì cách duy nhất để giữ cho trang web của bạn thời gian tải thấp và chia sẻ mã số dài như vậy là sử dụng cáckhu vực văn bản.
Làm thế nào là một vùng văn bản mặc định trông giống như





Xem một ví dụ về một vùng văn bản dưới đây để có được một ý tưởng về những gì nó thực sự là.
Có gì mới?
Tôi chắc chắn bạn không thích giao diện xám của hộp ở trên và muốn thêm một số màu sắc và hiệu ứng cho nó. Bây giờ nhìn thấy bản demo -> Customized Text Area
Cho phép hiện nay tìm hiểu làm thế nào để thêm hiệu ứng này mát mẻ đến các khu vực văn bản của chúng tôi. Thực hiện theo các bước dưới đây để thêm một vùng văn bản được cách điệu và tùy chỉnh trong blog của bạn,
Bước 1.
Paste đoạn code dưới đây ngay phía trên
  • Blogger> Layout> Edit HTML

  • Tìm kiếm
     </ B: skin> 

  • Dán mã tiếp theo trên nó.

 . Mbt-textarea {



padding: 0;



margin: 0;



chiều rộng: 400px;



chiều cao: 40px;



: # 0080ff;



font: 12px arial;



: # fff;



biên giới: 1px chấm # 289728;}



Mbt-textarea: hover {



màu: # 289728;



biên giới: 2px rắn # 666;}



. Mbt {



padding-top: 3px;



margin: 0;



màu: # 289728;



font-size: 9px;



font-family: sans-serif, Verdana;



}

Bây giờ nhấn Save Template và bạn đã làm xong !
Làm thế nào để sử dụng nó trong các bài viết của bạn
Bây giờ khi đã bao giờ bạn viết một bài viết sử dụng mã HTML bên dưới để hiển thị một vùng văn bản,
 <textarea class="mbt-textarea" readonly="readonly"> VIẾT-TEXT-TẠI ĐÂY </ textarea>

<p class="mbt"> <u> Bấm "Ctrl + A" để chọn và "Ctrl + C để sao chép </ u> </ p>

Bạn chỉ cần thay thế VIẾT TEXT-TẠI ĐÂY với mã văn bản cồng kềnh hoặc . Các văn bản in đậm màu đen xuất hiện bên dưới vùng văn bản của bạn và hướng dẫn độc giả của bạn làm thế nào để dễ dàng lựa chọn và sao chép mã của bạn. Nếu bạn không muốn văn bản xuất hiện dưới hộp văn bản sau đó chỉ cần xóa mã màu xanh và màu đen
Làm thế nào để Customize Khu vực Tiêu đề
Tôi viết lại các mã CSS ở trên với lời giải thích của mỗi phần,
 . Mbt-textarea {

padding: 0;



margin: 0;



chiều rộng: 400px;

chiều cao: 40px;



: # 0080ff;



font: 12px arial;



: # fff;



biên giới: 1px chấm # 289728;}



Mbt-textarea: hover {

màu: # 289728;

biên giới: 2px rắn # 666;}



. Mbt {

padding-top: 3px;



margin: 0;



màu: # 289728;



font-size: 9px;



font-family: sans-serif, Verdana;



}

1) Nếu bạn muốn giảm hoặc tăng chiều cao hoặc chiều rộng của vùng văn bản, chỉ cần chỉnh sửa
chiều rộng: 400px; 
chiều cao: 40px;
2) Để thay đổi màu sắc của văn bản trong sự thay đổi chế độ hoạt động mã sáu chữ số trong mã này,
màu: # 0080ff; (Sử dụng của chúng tôi Sơ đồ màu sử dụng một màu sắc của sự lựa chọn củabạn)
3) Để thay đổi màu của văn bản trong chế độ chuột di chuột, chỉnh sửa,
màu: # 289728;
4) Để thay đổi chiều rộng biên giới, phong cách và màu sắc trong chế độ hoạt động chỉnh sửa mã này,
biên giới: 1px chấm # 289728; 
ở đâu, chiều rộng là 1px, phong cách chấm và màu sắc là # 289728
5) Để thay đổi giao diện biên giới ở chế độ chuột di chuột chỉnh sửa,
biên giới: 2px solid # 666;
6) Để thay đổi kích thước chữ và gia đình, chỉnh sửa này,
font: 12px arial; 
nơi 12px là kích thước và arial là gia đình mặc định mà tôi đã sử dụng.
7) Để thay đổi kích thước màu sắc và phông chữ và gia đình của các văn bản "Báo chí" Ctrl + A "Chọn và" Ctrl + C để sao chép "chỉnh sửa mã này,
. Mbt { 
padding-top: 3px;
margin: 0;
màu: # 289728;
font-size: 9px;
font-family: sans-serif, Verdana;
}

Đó là tất cả!

Tôi hy vọng hướng dẫn này sẽ giúp bạn rất nhiều trong việc kiểm soát và phong cách vùng văn bản của bạn trong một cách tốt hơn. Vui lòng đừng ngần ngại hỏi bất kỳ câu hỏi. Câu hỏi của bạn là hơn một vinh dự cho chúng tôi. Chăm sóc! :>




Thích này? Xin Chia sẻ

Đăng nhận xét

item