[Share]Code Tạo viền trong suốt forum rất đơn giản

Demo: vncoding.forumvi.com
Hiện nay, để làm viền trong suốt, cách dùng phổ biến là dùng ảnh trong suốt. Phương pháp này có ưu điểm là hiển thị tốt trên mọi trình duyệt.
Nhược điểm:
Khó thay đổi: Để làm được ảnh nền này, bạn cần có vốn nho nhỏ về photoshop, tuy nhiên trên mạng thì ảnh nền dạng này cũng không hiếm.
Cố định: Chiều rộng của forum sẽ phải cố định khi dùng ảnh nền này, đối với desktop tỉ lệ 4:3 thì phần cuối trang sẽ mất ảnh nền (Nếu tỷ lệ ảnh không phù hợp).
Hướng dẫn cho punBB:
ACP >> Display >> Templates >> Ganeral >> overall_header:
Bước 1: Tìm:

Code:

<div class="pun">

và thêm vào đằng trước nó một trong 2 code sau:
1 - Viền khung: ( trong suốt toàn bộ viện forum )

Code:

    <div style="border-style: solid; border-color: rgb(137, 137, 137); border-radius: 5px;  border-width: 2px; background-color: rgba(255, 254, 254, 0); box-shadow: 3px 3px 7px 2px; padding: 10px; width: 968px; margin: 10px auto;">

2 - Viền dọc: ( trong suốt 1 bên dọc forum )

Code:

    <div style="border-style: solid; border-color: rgb(137, 137, 137);  border-width: 0pt 2px; background-color: rgba(255, 254, 254, 0); box-shadow: 3px 3px 7px 2px; padding: 0 10px; width: 968px; margin: 0 auto;">

Bước 2: Thêm vào trước:

Code:

</body>

bằng code sau:

Code:

</div>

Code:

width: 968px;

Nếu muốn tăng/giảm độ dày của viền thì thay đổi thuộc tính padding

Code:

padding: 10px;

CNTT-K3