• Trang chủ
  • Hướng dẫn
  • Module
  • Đại lý
  • FAQ
  • Blog
    • Tin tức
    • Thông báo phát hành
  • Đăng nhập
  • Đăng ký miễn phí
  • Trang chủ
  • Hướng dẫn
  • Module
  • Đại lý
  • FAQ
  • Blog
    • Tin tức
    • Thông báo phát hành
  • Đăng nhập
  • Đăng ký miễn phí
Trang chủ/Hướng dẫn/Tuỳ chỉnh và Nâng cao/Làm thế nào để tuỳ chỉnh CSS màu sắc hiển thị Module ?

Làm thế nào để tuỳ chỉnh CSS màu sắc hiển thị Module ?

99 lượt truy cập 0

Hướng dẫn sau đây cho phép bạn tuỳ chỉnh màu sắc cho từng Module hiển thị bên ngoài Trang chủ ứng dụng.

Đi tới Tuỳ chỉnh CSS nâng cao tại TAB Màu sắc, nhập đoạn code sau:

.homepage .layout li:nth-child(1) { 
    background-color: #0099C7; 
} 
.homepage .layout li:nth-child(2) { 
    background-color: #ffd64b; 
} 
.homepage .layout li:nth-child(3) { 
    background-color: #ff3a2e; 
} 
.homepage .layout li:nth-child(4) { 
    background-color: #9d5cad; 
}
.homepage .layout li:nth-child(5) { 
    background-color: #40b733; 
} 
.homepage .layout li:nth-child(6) { 
    background-color: #ddef3b; 
}

Hãy xem sự thay đổi Trước – Sau khi tuỳ chỉnh.

 

 

Để thêm cho các Module khác (nếu nhiều Module) bạn chỉ cần thêm tiếp đoạn mã sau:

.homepage .layout li:nth-child(X) { 
    background-color: #XXXXXX; 
} 

X   là các ký tự bạn có thể thay đổi cho màu sắc của bạn.

Y   là số thứ tự các Module.

Ví dụ:

.homepage .layout li:nth-child(Y) { 
    background-color: red; 
}

Hãy chú ý tới số thứ tự của các Module.

Bạn đã hoàn tất.

 

Bài viết này có giúp ích gì cho bạn không ?

Có  Không
Cùng chuyên mục
  • Module trong ứng dụng AppTeng là gì ?
  • Tuỳ chỉnh nút Menu cho các giao diện.
  • Tuỳ chỉnh chiều cao tuỳ chọn Hình ảnh trong Module Tuỳ chỉnh
  • Tuỳ chỉnh hộp trong Menu Module Âm thanh
  • Xoá bỏ nút điều hướng trong các mẫu giao diện số 3 – số 4 – số 5
  • Tuỳ chỉnh giao diện cho Mẫu số 18
Có thể bạn quan tâm
  • Hướng dẫn các bước Xuất bản ứng dụng Android
  • Module Thương mại điện tử
  • Tạo Chứng chỉ Phân phối iOS (iOS Distribution Certificate)
  • Làm thế nào để thay đổi icon hình ảnh của Module
  • Quảng cáo AdMob sẽ xuất hiện trong ứng dụng của tôi như thế nào ?
Danh mục hướng dẫn
  • Bắt đầu 7
  • Các bước tạo ứng dụng di động 6
  • Giao diện ứng dụng 12
    • Tuỳ chỉnh giao diện với CSS 22
  • Các Module ứng dụng 60
  • Xuất bản ứng dụng Android 4
  • Xuất bản ứng dụng iOS 13
  • Tuỳ chỉnh và Nâng cao 26
    • Sử dụng HTML trong ứng dụng 13
  • Kiếm tiền với AdMob 5
  • Ứng dụng Android và các vấn đề đã biết 1
  • Ứng dụng iOS và các vấn đề đã biết 1
  • Gỡ lỗi 2
  • Dành cho Nhà phát triển 4
    • Tài liệu API 1
  • Các vấn đề khác 4
  • Chính sách bảo mật
  • Điều khoản sử dụng
  • © 2017 - 2020 AppTeng - phát triển và Vận hành.