Cascading Style Sheets (CSS) là một cách tiêu chuẩn công nghiệp để tạo kiểu trang web. Nội dung của một trang được hiển thị bằng HTML và giao diện của trang được xác định bởi các tệp CSS. Bạn có thể tải lên tệp văn bản CSS hoặc chỉ cần nhập biểu định kiểu và áp dụng tệp đó vào một không gian hoặc thậm chí toàn bộ trang Confluence Ghi chú. Theo mặc định, chỉ quản trị viên hệ thống mới có thể chỉnh sửa CSS cho một không gian hoặc cho trang web. Để cho phép bất kỳ người dùng nào có quyền Quản trị viên không gian chỉnh sửa CSS cho không gian, hãy chuyển đến Tạo các kiểu CSS hoạt động trơn tru trên các trình duyệt khác nhau là một nhiệm vụ phức tạp đối với các trang web cơ bản và khá khó khăn khi tùy chỉnh các ứng dụng web như Confluence. Điều quan trọng là phải kiểm tra từng thay đổi mà bạn thực hiện và đảm bảo nó hoạt động như mong đợi trong tất cả các khu vực của Confluence – ví dụ: trên bảng điều khiển Confluence cũng như trên các trang thông thường Để giúp bạn bắt đầu, chúng tôi đã biên soạn phần giới thiệu này, hướng dẫn tạo kiểu cơ bản Trên trang này trang liên quan
Cân nhắc khi sử dụng CSS tùy chỉnhKiến thức CSS là bắt buộcNếu bạn chưa quen với CSS, hãy xem các liên kết trong bên dưới. Bạn nên dành chút thời gian để trở nên tự tin với Cascading Style Sheets trước khi bắt đầu chỉnh sửa biểu định kiểu Confluence của mình Bảo vệCSS tùy chỉnh có thể được sử dụng để đưa tập lệnh vào một trang, mở ra nguy cơ tấn công kịch bản chéo trang (XSS). Với tính năng này được bật, quản trị viên không gian có thể tải lên các kiểu đánh cắp thông tin đăng nhập của người dùng khác, lừa trình duyệt của họ thực hiện các hành động trên wiki mà họ không biết hoặc thậm chí có được đặc quyền quản trị toàn cầu. Như vậy, tính năng này bị tắt theo mặc định. Quản trị viên hợp lưu chỉ nên bật CSS tùy chỉnh nếu họ cảm thấy thoải mái với những rủi ro được liệt kê trong đoạn này mở rộng quy môMỗi trang cần chia tỷ lệ. Tùy thuộc vào độ phân giải màn hình của người dùng, nội dung sẽ hiển thị thông minh. Thiết kế của bạn cần xuống cấp một cách duyên dáng. Hãy thử thay đổi kích thước từng trang tồn tại trong Confluence. Có khá nhiều trang trong phần không gian duyệt, như bản nháp, nhãn, phân cấp trang, v.v. Phong cách của bạn phải phù hợp ở mọi nơi, không chỉ trong trang đầu tiên mà bạn tình cờ xem Tính năng không thể bị vô hiệu hóaCó thể dễ dàng tắt một số liên kết, tiêu đề hoặc thậm chí các mục menu bằng cách chỉ cần đặt kiểu của chúng thành 'ẩn'. Điều này có thể giúp bạn triển khai Confluence cho những người dùng có thể chưa hiểu rõ lắm về Wiki. Giao diện người dùng càng đơn giản, họ càng dễ sử dụng. Tuy nhiên, hãy nhớ rằng việc xóa liên kết đến một phần của ứng dụng không có nghĩa là chức năng này không khả dụng. Mọi người dùng vẫn có thể thay đổi phong cách của họ từ trong trình duyệt của họ hoặc truy cập trực tiếp vào URL. Đừng dựa vào CSS để vô hiệu hóa các phần của Confluence Các tính năng không nên bị vô hiệu hóaNgười dùng quen thuộc với Confluence sẽ mong muốn tìm thấy các điều khiển tương tự mà họ đã quen thuộc. Không nên xóa các nút hoặc điều khiển khỏi giao diện vì nó có thể khiến người dùng của bạn thất vọng và khiến họ phá vỡ thiết kế của bạn bằng cách sử dụng quyền truy cập URL trực tiếp, như đã đề cập ở trên CSS tùy chỉnh không áp dụng cho màn hình Quản trị viênMọi kiểu CSS được áp dụng cho trang web của bạn sẽ không được áp dụng cho Bảng điều khiển quản trị. Điều này nhằm đảm bảo các thay đổi đối với CSS không ngăn quản trị viên truy cập các chức năng của Quản trị viên trong tương lai. Khả năng tương thích của phiên bản ConfluenceLưu ý về mọi kế hoạch nâng cấp phiên bản Confluence của bạn. Các phiên bản tương lai của Confluence có thể không tương thích với CSS tùy chỉnh của bạn — điều này có thể khiến CSS của bạn bị hỏng, yêu cầu bảo trì khi Confluence được nâng cấp. Hỏi quản trị viên Confluence của bạn để biết thêm thông tin Thử nghiệm trên các trình duyệt web khác nhauTheo quy định, bạn nên kiểm tra các sửa đổi của mình trên các trình duyệt web khác nhau được Confluence hỗ trợ. Tùy chỉnh CSS không được hỗ trợVì việc tạo CSS tùy chỉnh có khả năng vô hạn nên Atlassian sẽ không hỗ trợ các sự cố gây ra bởi hoặc liên quan đến việc tùy chỉnh CSS Đôi khi các nhà phát triển phải làm việc với các mã cũ và đó là khi họ gặp phải một số vấn đề lớn, đặc biệt là kiểu nội tuyến không thể ghi đè Để ngăn chặn vấn đề đó, bạn nên hiểu hai khái niệm - khái niệm Thứ tự và Kế thừa Thuật ngữ “xếp tầng” có nghĩa là thứ tự phân cấp trong đó các loại biểu định kiểu khác nhau tương tác khi hai kiểu xung đột. Xung đột xảy ra khi hai kiểu khác nhau được áp dụng cho cùng một phần tử Đối với những trường hợp này, tồn tại một thứ tự cho các biểu định kiểu theo mức độ ưu tiên của chúng (4 có mức độ ưu tiên cao nhất)
Vì vậy, điều đó có nghĩa là khi xung đột nảy sinh giữa hai phong cách, phong cách cuối cùng được sử dụng sẽ được ưu tiên. Để rõ ràng hơn, bạn nên nhớ hai quy tắc này
Bạn có thể tìm thấy các ví dụ về các loại biểu định kiểu khác nhau tại đây HTML sử dụng mối quan hệ cha-con. Một phần tử con thường sẽ kế thừa các đặc điểm của phần tử cha trừ khi được định nghĩa khác. Ví dụ, nhìn vào đoạn mã sau Kể từ khi thẻ, là phần tử con của chúng ta, nằm bên trong thẻ, là phần tử cha, nó sẽ lấy tất cả các kiểu được cung cấp cho thẻ ngay cả khi nó không được cung cấp bất kỳ kiểu nào của riêng nó. Nhưng nếu bạn muốn đoạn văn áp dụng một số quy tắc của phần thân bài chứ không phải các quy tắc khác, bạn có thể ghi đè các quy tắc mà bạn không muốn. Đây là một ví dụ cho bạn Bây giờ hãy xem danh sách các ưu tiên bên trong (1 có ưu tiên cao nhất) Bạn có thể tìm thông tin chi tiết về id và lớp CSS tại đây Để hiểu rõ hơn, hãy ghi nhớ cấu trúc sau  Điều đó có nghĩa là nếu bạn có một phần tử có bộ chọn lớp và ID với các kiểu khác nhau, thì kiểu ID sẽ được ưu tiên. Ví dụ, hãy xem mã này Như chúng ta thấy, Class được đặt sau ID nhưng ID vẫn được ưu tiên hơn. Nó chỉ áp dụng nếu cả ID và Class được sử dụng trong cùng một phần tử Bây giờ, hãy xem một ví dụ, trong đó ID và Class được sử dụng trong hai phần tử khác nhau Ở đây, bộ chọn Lớp ghi đè bộ chọn ID vì nó là bộ chọn được sử dụng lần cuối. Bộ chọn ID chỉ được ưu tiên hơn bộ chọn Lớp nếu cả hai đều được sử dụng trong cùng một phần tử Bây giờ chúng ta hãy xem làm thế nào chúng ta có thể làm cho một lớp ghi đè lên một lớp khác. Nếu lớp đó có màu nền là xanh dương và bạn muốn thay vào đó, để có nền màu đỏ, hãy thử thay đổi màu từ xanh lam sang đỏ trong chính lớp đó. Bạn cũng có thể tạo một lớp CSS mới xác định thuộc tính màu nền với giá trị màu đỏ và để tham khảo lớp đó MỘT. Khai báo quan trọng là một cách tuyệt vời để ghi đè các kiểu bạn muốn. Khi một quy tắc quan trọng được sử dụng trên khai báo kiểu, khai báo này sẽ ghi đè mọi khai báo khác. Khi hai tuyên bố xung đột với. các quy tắc quan trọng được áp dụng cho cùng một phần tử, khai báo có tính đặc hiệu cao hơn sẽ được áp dụng Hãy xem cách bạn có thể sử dụng. khai báo quan trọng để ghi đè kiểu nội tuyến. Bạn có thể đặt các kiểu riêng lẻ trong tệp CSS chung của mình dưới dạng. quan trọng ghi đè các kiểu nội tuyến được đặt trực tiếp trên các phần tử Tuy nhiên, bạn nên tránh sử dụng. quan trọng, bởi vì nó làm cho việc gỡ lỗi trở nên khó khăn hơn bằng cách phá vỡ tầng tự nhiên trong biểu định kiểu của bạn |
