• Downloading from our site will require you to have a paid membership. Upgrade to a Premium Membership from 10$ a month today!

    Dont forget read our Rules! Also anyone caught Sharing this content will be banned. By using this site you are agreeing to our rules so read them. Saying I did not know is simply not an excuse! You have been warned.

Cách chỉnh sửa trong CSS vbb

congtust24

Well-Known Member
Vip
Chèn ảnh nền vào phần nhập nội dung bài viết:
Vào Style & Templates/ Manager Style/ Main CSS

Tại phần Soạn thảo WYSIWYG ta thay phần màu nền background thành

#F5F5FF url(images/misc/anhnen_text_box.gif) no-repeat center

Trong đó tên "anhnen_text_box.gif" là tên ảnh mà bạn muốn chèn đặt tại thư mục images/misc/
Thế thui.

-------------------------

Làm viền cho nút

Ta tới phần Nút (Button)

Thay vào giá trị màu nền là: #E4E7F5

Thêm vào ô thuộc tính CSS đặc biệt (phía bên phải của ô màu nền ấy):

BORDER-RIGHT: #5182c2 1px dotted; BORDER-TOP: #5182c2 1px dotted; BORDER-LEFT: #5182c2 1px dotted; BORDER-BOTTOM: #5182c2 1px dotted;

Sau đó bạn có thể thay các thuộc tính như:

màu sắc viền (#5182c2)
Độ dày viền : 1px dotted

---------------------------------

Chèn ảnh nền vào thẻ Body của trang chủ. Cái này nếu biết cách sử dụng thì sẽ rất hữu ích

Tại phần Trang nền (Background page) ngay bên dưới phần Body đó ta nhập thuộc tính vào ô màu nền như sau:

#FFFFFF url(images/misc/dot.gif)

Trong đó tên ảnh là "dot.gif" đặt trong thư mục "images/misc/"

-----------------------------------

Category Strips
'Category Strips' được dùng với hai mục đích. Nó được dùng để chỉ ra một 'Chuyên mục' diễn đàn, và nó cũng được sử dụng như một kiểu giao diện cho nội dung thanh tiêu đề của hầu hết các bảng.

Nếu ta muốn chèn ảnh vào phần thanh tiêu đề của "Chuyên mục" thì ta nhập vào ô màu nền như sau:

#FFFFFF url(images/misc/table_header_bg.gif) repeat-x top left

Trong đó #FFFFFF (màu trắng) là màu nền còn ảnh nền thì các bạn cũng đã hiểu với phần trên.
Lưu ý rằng các bạn phải chú trọng cả đến màu ảnh nền và màu Font. Để cho 2 cái có độ tương phản cho dễ đọc.

-----------------------------------

Màu đầu tiên (First color) và màu thứ hai (Second color)

Mô tả:
Hầu hết các bảng trong diễn đàn dùng màu đầu tiên hoặc thứ hai cho màu nền. Đặt thuộc tính để sử dụng 'Màu đầu tiên' tại đây.

Màu đầu tiên là màu nền của phần nội dung bài viết khi bạn xem chủ đề
Màu thứ hai là màu nền của phần có chứa tên sử dụng, Avatar, danh hiệu... của người viết bài

Các bạn nên sửa cho phù hợp với tông màu của màu nền diễn đàn một cách hài hoà.



Sau đây là thiết lập giao diện của tôi đã thực hiện. Tôi cho rằng giao diện này sửa thêm một vài chi tiết nữa thì chẳng kém giao diện của anh Admin bên này. Chú ý rằng giao diện đẹp thì phải đi đôi với bộ nút đẹp. Các bạn nên sắm cho mình một bộ nút ăn ý với giao diện. Còn bây giờ đây là phần giao diện của tôi:
------------------------
Body
Giữ nguyên thiết lập gốc
----------
Trang nền (Background page)
Màu nền: #FFFFFF url(images/misc/dot.gif)
Màu Font: #000000

------------------------------
<td>, <th>, <p>, <li>
Giữ nguyên thiết lập gốc

-------------------------

Viền bảng
Giữ nguyên thiết lập gốc
-------------------------------

Category Strips
Màu nền: #FFFFFF url(images/misc/tm.gif) no-repeat center
Màu Font: #003366

Liên kết CSS bình thường
Màu nền: transparent
Màu Font: #003366
Text decoration: None

Liên kết CSS đã vào:
Màu nền: transparent
Màu Font: #666666
Text decoration: None

Liên kết CSS Hover
Màu nền: transparent
Màu Font: #006699
Text decoration: underline

----------------------------------------------------

Table Header

Màu nền: #FFFFFF url(images/misc/table_header_bg.gif) repeat-x top left
Màu Font: #003366

Liên kết CSS bình thường
Màu nền: transparent
Màu Font: #003366
Text decoration: None

Liên kết CSS đã vào:
Màu nền: transparent
Màu Font: #666666
Text decoration: None

Liên kết CSS Hover
Màu nền: transparent
Màu Font: #006699
Text decoration: underline
-----------------------------------------------

Table Footer

Màu nền: #FFFFFF
Màu Font: #003366

Liên kết CSS bình thường
Màu nền: transparent
Màu Font: #003366
Text decoration: None

Liên kết CSS đã vào:
Màu nền: transparent
Màu Font: #666666
Text decoration: None

Liên kết CSS Hover
Màu nền: transparent
Màu Font: #006699
Text decoration: underline

------------------------------------------

Màu đầu tiên Màu thứ hai

Màu nền: #FFFFFF
Màu Font: #003366

Thuộc tính CSS đặc biệt:

border: 1px solid #E5E5E5;

-------------------------------------------
Soạn thảo WYSIWYG

Màu nền: #F5F5FF url(images/misc/anhnen_text_box.gif) no-repeat center
Màu Font: #003366

Thuộc tính CSS đặc biệt:

BORDER-RIGHT: #5182c2 1px dotted; BORDER-TOP: #5182c2 1px dotted; BORDER-LEFT: #5182c2 1px dotted; BORDER-BOTTOM: #5182c2 1px dotted;

-------------------------

Ô nhập liệu

Thuộc tính CSS đặc biệt:

BORDER-RIGHT: #5182c2 1px dotted; BORDER-TOP: #5182c2 1px dotted; BORDER-LEFT: #5182c2 1px dotted; BORDER-BOTTOM: #5182c2 1px dotted;

----------------------------------

Nút (Button)

Màu nền: #E4E7F5

Thuộc tính CSS đặc biệt:

BORDER-RIGHT: #5182c2 1px dotted; BORDER-TOP: #5182c2 1px dotted; BORDER-LEFT: #5182c2 1px dotted; BORDER-BOTTOM: #5182c2 1px dotted;

------------------------------------

Menus
Small Font
Time Color

Được giữ nguyên thiết lập gốc
-------------------------------------

Navbar Text

Màu nền: #FFFFFF
Màu Font: #003366

-------------------------------------

Highlighted Font

Màu nền: #FFFFFF
Màu Font: #FF0000

------------------------------------

Panel Surround

Màu nền: #D5D8E5 url(images/gradients/gradient_panelsurround.gif) repeat-x top left
Màu font: #000000
---------------------------------

Panel (Forms)

Màu nền: #E4E7F5 url(images/gradients/gradient_panel.gif) repeat-x top left
Màu font: #000000

--------------------------------

<legend>
Giữ nguyên

----------------------------------

Điều khiển menu Popup

Màu nền: #FFFFFF
Màu Font: #003366

Thuộc tính CSS đặc biệt:

padding: 3px 6px 3px 6px;
white-space: nowrap;

Liên kết CSS bình thường
Màu nền: #FFFFFF
Màu Font: #003366
Text decoration: None

Liên kết CSS đã vào:
Màu nền: #FFFFFF
Màu Font: #666666
Text decoration: None

Liên kết CSS Hover
Màu nền: #FFFFFF
Màu Font: #006699
Text decoration: underline

-------------------------------

Popup Menu Body

Giữ nguyên

--------------------------------

Tùy chọn dòng cho Menu Popup

Màu nền: #FFFFFF
Màu Font: #000000

Thuộc tính CSS đặc biệt

white-space: nowrap;
cursor: pointer;

Liên kết CSS bình thường
Màu nền: #FFFFFF
Màu Font: #22229C
Text decoration: None

Liên kết CSS đã vào:
Màu nền: #FFFFFF
Màu Font: #22229C
Text decoration: None

Liên kết CSS Hover
Màu nền: #FFFFFF
Màu Font: #FFFFFF
Text decoration: None

---------------------------------

Menu chuyển nhanh

Item selected

Màu nền:#FFFFFF
Màu Font: #003366
Thấy hay thanks nhiệt tình vào nhá.

----------> Bổ sung bài viết lúc 14:17 <----------> Bài viết trước lúc 14:16 <----------

Bổ sung luôn cái bảng mã màu nè:

mamauquocte
 
Chi tiết như thế rồi mờ k hiểu, kêu admin ra đây chém vài phát mới được!
 

Facebook Comments

Similar threads
Thread starter Title Forum Replies Date
Admin Hướng dẫn cách xác định vị trí file php.ini chính xác để chỉnh sửa VPS & Dedicated Server 0
Admin UltraISO Premium Edition 9.5.3 Build 2900 - Công cụ chỉnh sửa file iso theo cách chuyên nghiệp Phần mềm 0
carot_ls Vài cách chỉnh sửa ảnh đơn giản mà đẹp Phần mềm 0
C Hỏi Cách chỉnh cho hình ảnh bự ra khi đọc bằng điện thoại Vbulletin 0
Yeukodamnoi Hỏi Sử dụng google tùy chỉnh như thế này nhỉ, [you] hướng dẫn cách Hosting / Domain 21
Admin 6 cách tùy chỉnh màn hình Start Screen trong Windows 8 Sử dụng, chia sẻ, hỏi đáp 0
A Hỏi Cách chỉnh sữa tin nhắn tự động Johncms 3
A Help Cách chỉnh thời gian lập top khi đưa chủ đề mới ra ngoài trang chủ. Johncms 1
C Hỏi Cách chỉnh lại size ảnh trong forum Johncms 6
K Xin Cách Chỉnh TopX 6.1 Thùng rác dọn dẹp thường xuyên 0
katy Android Có MFY MobiFone – Tết không khoảng cách, Gắn kết tình thân Điện thoại di động 12
T Cách thêm avatar vào khung ảnh cực kỳ đơn giản trên myFrame.vn Thảo luận chung 0
T Cách Thêm File robots.xtx cho web xtgem Thảo luận chung 1
katy Android Thăng hạng đặc cách cho KH MobiFone nhân dịp 30 năm thành lập Điện thoại di động 24
vinhdlp Hướng dẫn Hướng dẫn cách ứng tiền mạng Viettel đơn giản cho thuê bao Mạng internet 0
Admin Cách tạo logo Thiết kế đồ họa 0
cuongpro9x Cách đăng kí 4G free 3 tháng của viettel Trò chuyện linh tinh 0
cuongpro9x Cách mở tài khoản số đẹp VPBank miễn phí chỉ trong 5 phút trên điện thoại Trò chuyện linh tinh 0
katy Android Cách nhận quà khi giới thiệu bạn bè sử dụng app Vietlott SMS Tin tức, giới thiệu về ĐTDĐ 10
katy Android Cách thanh toán cước trả sau trên ví điện tử MobiFone Pay nhận chiết khấu 7% Thông tin các mạng di động 12
tunglamed Các cách đổi esim MobiFone và cảnh báo lừa đảo chiếm đoạt sim thông qua đổi esim Thông tin các mạng di động 0
minhquang02 Wi-Fi 6 trang bị cho laptop và cách sự hiệu quả nhất Tin tức, sự kiện thường ngày 0
V Help Cách khắc phục tài khoản bị tạm ngưng do phá vỡ hệ thống Blogger 3
tmarketingvnn Hướng dẫn Cách Tạo Tài Khoản Trên Sàn Exness Nhanh Chóng Kiến thức lập trình 0
tunglamed MobiFone tặng miễn phí 50 phút thoại cho các tỉnh giãn cách theo Chỉ thị 16 Điện thoại di động 7
lancan Chia sẻ cách tải video tiktok không có logo Thảo luận chung 0
Admin Share cách kiếm 50$ mỗi ngày Tut, tool, mmo 1
Admin Cách kiếm tiền trên Youtube - How to get money in Youtube Tut, tool, mmo 5
Admin Hướng dẫn cách tạo mail edu miễn phí - How to get edu mail for free Tut, tool, mmo 0
Admin Cách kiếm 1000$ / tháng từ Google Adsense - AdSense Major - From ZERO to $1K Monthly Tut, tool, mmo 14
Admin Hướng dẫn xóa khoảng cách các sản phẩm trên trang chủ Woocommerce Wordpress 0
Admin Hướng dẫn tự động phân cách phần nghìn khi nhập số C# giống tiền C# / C++ 0
haopro Nonstop Bay phòng 2020 Sét Nhạc Đi Cảnh AE Đừng Lại Gần Tôi Chúng Ta Cách Ly Thôi Âm nhạc 0
T Hiểu một cách Microservices là gì Tin tức CNTT 0
cuongpro9x Hướng dẫn Cách bật Microsoft Translator trên Edge Chromium Thủ thuật máy tính 0
cuongpro9x Hướng dẫn Cách chặn quảng cáo, tắt quảng cáo Youtube trên iPhone Android, iOS 1
T Một số cách học lập trình bạn hãy tham khảo Tin tức CNTT 0
T Đây là cách DeFi đột phá trong tài chính Tin tức CNTT 0
N Cách tính điểm đổi thưởng cho thuê bao không phải là Hội viên Kết nối dài lâu Thông tin các mạng di động 12
dichvumobifone Cách thay đổi ảnh bìa trên trang cá nhân và Fanpage Facebook bằng Video Blogger 1
T Game trên nền tảng Blockchain – Cuộc cách mạng của Dapp Tin tức CNTT 0
D Cách chà ron gạch - Chít keo mạch gạch Thảo luận chung 0
Admin Cách tăng RPM bền vững trong Facebook Ad Breaks Tut, tool, mmo 0
T Cách vận hành doanh nghiệp truyền thống bằng Blockchain Tin tức CNTT 0
dammechiase Hướng Dẫn Chi Tiết Cách Kiếm Tiền Từ Trang Upload Kiếm Tiền Hấp Dẫn Vipshare 2.5$/1000 lượt dowload Trò chơi 0
dammechiase Hướng dẫn Cách Kiếm Tiền Rút Gọn Link Kiếm Tiền Với ******* - 3$/1000 lượt click Uy Tín Nhất Việt Nam Trò chơi 0
D Thảo luận Cách làm cầu thang gỗ chi tiết Thảo luận SEO 0
L Share Trình làng kiểu cách mới Tủ Bếp Đẹp cổ điển lại 1 giành riêng cho nhà nhỏ Sử dụng, chia sẻ, hỏi đáp 0
N Black Friday – MobiFone bất ngờ thăng hạng đặc cách cho Hội viên Kết nối dài lâu Thông tin các mạng di động 2
L PCI chia sẻ Cách sử dụng pin và sạc laptop hợp lý, đúng cách, lâu bị chai Máy tính 0

Similar threads

New posts New threads New resources

Back
Top