Please enable JavaScript.

Coggle requires JavaScript to display documents.

HTML - CSS - Coggle Diagram

- - - - Sidebar
      - Main Content
      - Footer
      - Header
    - - là thuật ngữ chúng ta sử dụng để nói về các phần tử trực quan được sắp xếp trong một trang web
    - - là một thuật ngữ thiết kế đồ họa liên quan đến cách người dùng tương tác với composition của trang
    - - thuật ngữ liên quan đến khoảng chống
    - - Sans Serif
        
        Không chân
      - Serif
        
        Có chân
  - - - Thẻ chứa tất cả các thẻ khác
    - - gồm thông tin quan trọng để trang hoạt động nhưng không phải là thông tin hiển thị.
    - - chứa những gì hiển thị trên trình duyệt
    - - chứ đoạn văn bản
    - - dùng cho liên kết
    - - ảnh
    - - danh sách thường
    - - danh sách có thứ tự
    - - danh sách mô tả
    - - để hiển thị một trang trong một trang web
      - Sử dụng border:none; để xóa đường viền xung quanh iframe
    - - <b>- Chữ in đậm
      - <strong>- Văn bản quan trọng
      - <i>- Văn bản in nghiêng
      - <em>- Đoạn văn bản được nhấn mạnh
      - <mark>- Văn bản được đánh dấu
      - <small>- Văn bản nhỏ hơn
      - <del>- Văn bản đã xóa
      - <ins>- Đã chèn văn bản
      - <sub>- Văn bản chỉ số
      - <sup>- Văn bản siêu cấp
- - - - <article>
      - <aside>
      - <details>
      - <figcaption>
      - <figure>
      - <footer>
      - <header>
      - <main>
      - <mark>
      - <nav>
      - <section>
      - <summary>
      - <time>
  - - - text-overflow
      - word-wrap
      - word-break
      - writing-mode
    - - transition-delay
      - transition-duration
      - transition-property
      - transition-timing-function
        
        ease- chỉ định hiệu ứng chuyển tiếp với bắt đầu chậm, sau đó nhanh, sau đó kết thúc chậm (đây là mặc định)
        
        linear- chỉ định một hiệu ứng chuyển tiếp với cùng tốc độ từ đầu đến cuối
        
        ease-in- chỉ định hiệu ứng chuyển tiếp với khởi động chậm
        
        ease-out- chỉ định hiệu ứng chuyển tiếp với kết thúc chậm
        
        ease-in-out- chỉ định hiệu ứng chuyển tiếp với bắt đầu và kết thúc chậm
        
        cubic-bezier(n,n,n,n)- cho phép bạn xác định các giá trị của riêng mình trong một hàm bậc ba
    - - @ keyframes
      - animation-name
      - animation-duration
      - animation-delay
      - animation-iteration-count
      - animation
      - animation-direction
        
        normal- Hoạt ảnh được phát như bình thường (chuyển tiếp). Đây là mặc định
        
        reverse- Hoạt ảnh được phát theo hướng ngược lại (ngược)
        
        alternate - Hoạt ảnh được phát về phía trước, sau đó được phát ngược lại
        
        alternate-reverse- Hoạt ảnh được phát ngược trước, sau đó chuyển tiếp
      - animation-timing-function
        
        ease- Chỉ định một hoạt ảnh có bắt đầu chậm, sau đó nhanh, sau đó kết thúc chậm (đây là mặc định)
        
        linear- Chỉ định một hoạt ảnh có cùng tốc độ từ đầu đến cuối
        
        ease-in- Chỉ định một hoạt ảnh có khởi động chậm
        
        ease-out- Chỉ định một hoạt ảnh có kết thúc chậm
        
        ease-in-out- Chỉ định một hoạt ảnh có bắt đầu và kết thúc chậm
        
        cubic-bezier(n,n,n,n)- Cho phép bạn xác định các giá trị của riêng mình trong một hàm bậc ba
      - animation-fill-mode
        
        none- Giá trị mặc định. Hoạt ảnh sẽ không áp dụng bất kỳ kiểu nào cho phần tử trước hoặc sau khi phần tử đang thực thi
        
        forwards- Phần tử sẽ giữ lại các giá trị kiểu được đặt bởi khung hình chính cuối cùng (phụ thuộc vào hướng hoạt ảnh và số lần lặp lại hoạt ảnh)
        
        backwards- Phần tử sẽ nhận các giá trị kiểu được đặt bởi khung hình chính đầu tiên (phụ thuộc vào hướng hoạt ảnh) và giữ lại giá trị này trong khoảng thời gian trễ hoạt ảnh
        
        both- Hoạt ảnh sẽ tuân theo các quy tắc cho cả tiến và lùi, mở rộng các thuộc tính hoạt ảnh theo cả hai hướng
- - - - ngôn ngữ sử dụng để tạo kiểu cho một trang Web
      - mô tả cách các phần tử HTML được hiển thị trên màn hình
    - - bao gồm một bộ chọn và một khối khai báo.
    - - background-color
      - background-image
      - background-repeat
      - background-attachment
      - background-position
      - opacity
    - - color
    - - font-family
    - - External CSS
      - Internal CSS
      - Inline CSS
    - - a:link- một liên kết bình thường, không được kiểm tra
      - a:visited- một liên kết mà người dùng đã truy cập
      - a:hover- một liên kết khi người dùng di chuột qua nó
      - a:active- một liên kết ngay khi nó được nhấp vào
      - text-decoration- xóa gạch chân khỏi các liên kết
    - - list-style-type
      - list-style-image
      - list-style-position
      - list-style-type:none
      - list-style
    - - border
      - border-collapse
    - - display: inline
      - display: inline-block
      - display: block
    - - Content - Nội dung của hộp, nơi văn bản và hình ảnh xuất hiện
      - Padding - Xóa một khu vực xung quanh nội dung. Lớp đệm trong suốt
      - Border - Đường viền bao quanh phần đệm và nội dung
      - Margin - Xóa một khu vực bên ngoài biên giới. Lợi nhuận là minh bạch
    - - outline-color
      - outline-width
      - outline-offset
      - outline-style
        
        dotted- Xác định một dàn bài có dấu chấm
        
        dashed- Xác định đường viền đứt nét
        
        solid- Xác định một phác thảo vững chắc
        
        double- Xác định một dàn bài kép
        
        groove- Xác định một đường viền 3D có rãnh
        
        ridge- Xác định một đường viền 3D
        
        inset- Xác định phác thảo nội dung 3D
        
        outset- Xác định phác thảo ban đầu 3D
        
        none- Không xác định đường viền
        
        hidden- Xác định một đường viền ẩn
    - - margin-top
      - margin-right
      - margin-bottom
      - margin-left
    - - padding-top
      - padding-right
      - padding-bottom
      - padding-left
    - - left- Phần tử nổi ở bên trái vùng chứa của nó
      - right- Phần tử nổi ở bên phải vùng chứa của nó
      - none- Phần tử không trôi nổi (sẽ được hiển thị ngay tại nơi nó xuất hiện trong văn bản). Đây là mặc định
      - inherit- Phần tử kế thừa giá trị float của phần tử cha của nó
    - - static
      - relative
      - fixed
      - absolute
      - sticky