• Trang chủ
  • Sản phẩm – Dịch vụ
    • Tạo ứng dụng di động
      • AppTeng Go
    • Smart ERP Go
      • Lite Smart ERP Go
      • Medium Smart ERP Go
    • Tạo QR Code
      • QR Code Go Free
  • Bảng giá
  • Bảng điều khiển
    • Đăng nhập
      • Tạo ứng dụng di động
      • Smart ERP Go
        • Lite ERP Go
        • Medium ERP Go
      • Tạo QR Code
        • QR Code Go Free
        • QR Code Pos – Res
        • QR Pos – Pro
      • Smart CRM / ERP
        • Smart CRM / ERP Go
      • Giáo dục
        • Edu Go Free
      • Giám sát
        • Monitor
    • Đăng ký
      • Tạo ứng dụng di động
      • Smart ERP Go
        • Lite Smart ERP Go
        • Medium ERP Go
      • Tạo QR Code
        • QR Code Go Free
        • QR Pos – Res
        • QR Pos – Pro
      • Smart CRM / ERP Go
        • Lite CRM / ERP Go
      • Giáo dục
        • Edo Go Free
      • Giám sát
        • Monitor
  • Kiến thức chung
  • Trang chủ
  • Sản phẩm – Dịch vụ
    • Tạo ứng dụng di động
      • AppTeng Go
    • Smart ERP Go
      • Lite Smart ERP Go
      • Medium Smart ERP Go
    • Tạo QR Code
      • QR Code Go Free
  • Bảng giá
  • Bảng điều khiển
    • Đăng nhập
      • Tạo ứng dụng di động
      • Smart ERP Go
        • Lite ERP Go
        • Medium ERP Go
      • Tạo QR Code
        • QR Code Go Free
        • QR Code Pos – Res
        • QR Pos – Pro
      • Smart CRM / ERP
        • Smart CRM / ERP Go
      • Giáo dục
        • Edu Go Free
      • Giám sát
        • Monitor
    • Đăng ký
      • Tạo ứng dụng di động
      • Smart ERP Go
        • Lite Smart ERP Go
        • Medium ERP Go
      • Tạo QR Code
        • QR Code Go Free
        • QR Pos – Res
        • QR Pos – Pro
      • Smart CRM / ERP Go
        • Lite CRM / ERP Go
      • Giáo dục
        • Edo Go Free
      • Giám sát
        • Monitor
  • Kiến thức chung
Trang chủ/Hướng dẫn/Nền tảng Tạo ứng dụng di động/Tuỳ chỉnh và Nâng cao/Sử dụng HTML trong ứng dụng/Hướng dẫn 6: Thuộc tính (Attributes)

Hướng dẫn 6: Thuộc tính (Attributes)

775 lượt truy cập 0

Bạn có thể thêm thuộc tính vào một số phần tử.

Thuộc tính là gì?

Nếu bạn còn nhớ, những phần tử tạo nên cấu trúc trang HTML và khai báo với trình duyệt bạn muốn website sẽ được trình bày như thế nào (ví dụ <br /> là thẻ khai báo cho trình duyệt khi muốn xuống dòng trong một đoạn chữ). Ở một vài phần tử bạn có thể thêm thông tin vào. Loại thông tin được thêm vào này được gọi là thuộc tính (attribute)

Ví dụ 1:

  1. <h2 style=“background-color:#ff0000;“>AppTeng – tạo ứng dụng di động</h2>

Bạn sẽ thấy hiển thị trong ứng dụng di động của bạn như sau:

Thuộc tính luôn được đặt trong thẻ mở và theo sau là dấu = cùng chi tiết nằm giữa cặp ngoặc kép, dấu chấm phẩy sẽ dùng để tách các nội dung thuộc tính, chúng ta sẽ nói về điều này sau.

Tìm hiểu rõ hơn về thuộc tính:

Có rất nhiều thuộc tính. Cái đầu tiên chúng tôi hướng dẫn bạn sẽ là style (kiểu dáng, định dạng), bằng cách sử dụng style bạn có thể tạo kiểu cho Module Mã nguồn của mình. Ví dụ như background colour: (màu nền )

Ví dụ 2:

  1. <html>
  2. <head>
  3. </head>
  4. <body style=“background-color:#ff0000;“>
  5. </body>
  6. </html>

Bạn sẽ thấy hiển thị trong ứng dụng di động của bạn như sau:

 

Đoạn code trên đã thêm màu đỏ vào nền Module mã nguồn của bạn, hiển thị trong ứng dụng di động – bạn hãy thử và sẽ thấy. Chúng tôi sẽ giải thích chi tiết hệ thống màu hoạt động như thế nào chí trong chốc lát nữa.

Chú ý rằng một số thẻ sử dụng tiếng Anh của Hoa Kỳ, do đó color sẽ được dùng thay vì colour. Điều này bạn nên cẩn thận, vì nếu viết sai ứng dụng sẽ không hiểu code bạn viết. Một lưu ý khác cũng rất quan trọng, bạn phải luôn dùng dấu ngoặc kép để đóng lại thuộc tính.

Làm thể nào tạo màu đỏ cho nền ứng dụng?

Như ví dụ bạn vừa xem, để tạo màu đỏ chúng tôi dùng đoạn code “#ff0000”. Đây là mã của màu đỏ được tính theo hệ thập lục phân  – hexadecimal numbers (HEX). Mỗi màu sẽ có một mã riêng theo hệ thập lục phân, đây là một số mã màu thường được dùng:

White: #ffffff – Trắng
Black: #000000 (zeros) – Đen
Red: #ff0000 – Đỏ
Blue: #0000ff –  Xanh da trời
Green: #00ff00 – Xanh lá cây
Yellow: #ffff00 – Vàng

Một màu thập lục phân (viết tắt là HEX) bao gồm dấu # và sáu chữ hoặc số theo sau. Có hơn 1000 mã màu HEX và rất khó hình dung mã số nào sẽ là màu gì. Để dễ dàng hơn, bạn có thể tham khảo bảng 216 màu thường được sử dụng của bảng màu tại đây.

Bạn cũng có thể dùng tên màu chuẩn theo tiếng Anh như (white, black, red, blue, green and yellow).

Ví dụ 3:

  1. <body style=“background-color: red;“></body>

Bạn sẽ thấy hiển thị trong ứng dụng di động của bạn như sau:

Bạn đã có khái niệm vừa đủ về màu. Bây giờ chúng ta sẽ quay lại với thuộc tính.

Những phần tử nào có thể sử dụng thuộc tính?

Có rất nhiều thuộc tính khác nhau có thể áp dụng lên đa số các phần tử.

Bạn sẽ thường xuyên sử dụng thuộc tính đối với một số thẻ như <body> và chẳng khi nào áp dụng thuộc tính lên thẻ như <br />, bởi vì  sự ngắt dòng hầu như không cần có thêm bất cứ tham số nào để điều chỉnh.

Cũng như các phần tử, có rất nhiều thuộc tính khác nhau. Một số thuộc tính được tạo ra để đáp ứng riêng cho chính các phần tử đó, một số khác có thể sử dụng đại trà đối với nhiều phần tử khác nhau. Ngược lại một số phần tử chỉ có thể chứa một loại thuộc tính và số khác phần tử có thể chứa nhiều thuộc tính khác nhau.

Bạn sẽ có một chút khó hiểu ở đây, nhưng một khi đã làm quen với những thuộc tính khác nhau, bạn sẽ thấy nó thật sự rất logic và bạn cũng sẽ nhận ra sử dụng chúng rất dễ dàng cùng với các khả năng được cung cấp bởi chúng nhiều như thế nào.

Ví dụ dưới đây sẽ cho bạn thấy những thuộc tính quan trọng nhất.

Chính xác là có bao nhiêu thành phần trong một phần tử?

Nói tổng quát, một phần tử bao gồm: một thẻ mở có chứa hoặc không chứa một hay nhiều thuộc tính, một số nội dung và thẻ đóng. Hãy xem hình minh họa dưới.

Phân tích một phần tử

Phân tích chi tiết 2 loại phần tử 1- Phần tử thông thường luôn có 1 cặp thẻ mở và đóng 2 – Phần tử đơn chỉ có 1 thẻ duy nhất.

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

Có  1 Không
Cùng chuyên mục
  • Cách ẩn link Youtube Video trong ứng dụng
  • Hướng dẫn 1: Bắt đầu với HTML trong Module Mã nguồn
  • Hướng dẫn 2: HTML là gì?
  • Hướng dẫn 3: Phần tử và thẻ (elements, tags)
  • Hướng dẫn 4: Module Mã nguồn – lần đầu làm chuyện “ấy”
  • Hướng dẫn 5: Một số phần tử cần biết
Có thể bạn quan tâm
  • Tạo Chứng chỉ Phân phối iOS (iOS Distribution Certificate)
  • Hướng dẫn các bước Xuất bản ứng dụng Android
  • Module Thương mại điện tử
  • Làm thế nào để thay đổi icon hình ảnh của Module
  • Làm thế nào để tạo File .IPA cho ứng dụng iOS ?
Danh mục hướng dẫn
  • Nền tảng Edu Go (Miễn phí cho Trường học – Cơ sở giáo dục 5
    • Thiết lập hệ thống Trường học 2
    • Câu hỏi thường gặp 1
    • Bắt đầu 1
    • Các vấn đề khác 1
  • Nền tảng Tạo ứng dụng di động 7
    • Làm thế nào ? 3
    • Bắt đầu 7
    • Các bước tạo ứng dụng di động 6
    • Giao diện ứng dụng 13
      • Tuỳ chỉnh giao diện với CSS 22
    • Các Module ứng dụng 61
    • Xuất bản ứng dụng Android 4
    • Xuất bản ứng dụng iOS 17
    • Tuỳ chỉnh và Nâng cao 28
      • Sử dụng HTML trong ứng dụng 14
    • 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 2
    • 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 9
  • Chương trình Đại lý AppTeng 18
    • Bắt đầu 14
    • Hướng dẫn thực hiện 3
    • Câu hỏi thường gặp của Chương trình đại lý 10
  • Kiến thức chung 3
  • Nền tảng Email Go (Email Marketing 23
    • Khái Niệm, Thuật Ngữ 10
    • Thiết lập Hệ thống Email Marketing trên nền tảng Email Go của bạn 5
    • Tạo tài nguyên Hệ thống 2
    • Chiến Dịch Email Marketing 2
    • API KEY 1
    • Phí Dịch vụ 1
    • Các vấn đề chung 2
  • Nền tảng File Go 2
    • Bắt đầu 2
  • Lite Marketing 5
    • Thực hiện 1
    • Khái niệm, Thuật ngữ 3
    • Bắt đầu 1
  • Nền tảng Ad BioLink 1
    • Khái niệm, Thuật ngữ 1
  • Nền tảng QR Pos – Res 2
    • Bắt đầu 1
    • Thực hiện 1
  • Nền tảng Tạo Website Cửa hàng – Comment – Chat Bot tự động trên Facebook – Instagram 19
    • Khái niệm, Thuật ngữ 6
    • Cửa hàng Thương mại điện tử 12
    • Bắt đầu 1
  • Nền tảng Quản trị Nhân sự HRM Go 1
    • Bắt đầu 1
  • Nền tảng GetFund – Góp vốn đầu tư 1
  • Nền tảng Thương mại điện tử – Shop 4
    • Bắt đầu 1
    • Kinh doanh bán hàng 3
  • Nền tảng WebPro – Tạo nhanh Website 3
    • Bắt đầu 2
    • Các bước tạo Website 1
  • Email dành cho Doanh nghiệp 5

  Hướng dẫn 5: Một số phần tử cần biết

Hướng dẫn 7: Liên kết – Link  

AppTeng Việt Nam
Giới thiệu
Danh sách phát hành
Tin tức
Chính sách Cộng tác viên
Chính sách Đại lý
Chính sách bảo mật
Điều khoản sử dụng
Chính sách và Quy tắc hoàn lại tiền
  • Chính sách bảo mật
  • Điều khoản sử dụng
  • © 2014 - 2022 AppTeng - phát triển và Vận hành.