Văn bản và hình ảnh

Chỉ có hình ảnh và video

Chỉ có văn bản

Văn bản, hình ảnh, âm thanh, video và các liên kết

CSS

JavaScript

HTML

Python

Tạo các trang web

Hiển thị các trang web

Lưu trữ các trang web

Quản lý các trang web

.txt

.doc

.html

.css

Vì nó có thể hiển thị các văn bản rất dài

Vì nó cho phép tạo các liên kết đến các tài liệu khác

Vì nó có thể thay đổi kích thước của văn bản

Vì nó chỉ có thể sử dụng để tạo văn bản

Để làm cho mã đẹp hơn

Để tự động tạo ra các thẻ HTML

Để kiểm tra lỗi cú pháp và hỗ trợ viết mã hiệu quả

Để chuyển đổi mã HTML thành các ngôn ngữ khác

Thẻ mở không có nội dung, thẻ đóng có nội dung

Thẻ mở đánh dấu bắt đầu của một phần tử, thẻ đóng đánh dấu kết thúc

Thẻ mở chỉ dùng cho hình ảnh, thẻ đóng dùng cho văn bản

Không có sự khác biệt giữa thẻ mở và thẻ đóng

<div>

<p>

<h1>

<span>

Trong cửa sổ hiện tại

Trong cửa sổ mới

Trong một tab mới của cửa sổ hiện tại

Trong cửa sổ nhỏ hơn

Thẻ <h1> có kích thước lớn hơn thẻ <h6>

Thẻ <h6> có kích thước lớn hơn thẻ <h1>

Không có sự khác biệt về kích thước

Thẻ <h1> không được hỗ trợ trong HTML5

<ol>

<ul>

<li>

<dl>

Liên kết sẽ được mở trong cửa sổ hiện tại

Địa chỉ mà liên kết sẽ chuyển đến

Nội dung của liên kết

Cách thức mở liên kết

• <ul> và <li>

1. <ol> và <li>

<dl> và <dt>

• <ul> và <ol>

<iframe src="https://example.com" target="_self"></iframe>

<iframe src="https://example.com" target="_blank"></iframe>

<iframe src="https://example.com" target="newwindow"></iframe>

<table><tr><td>Row 1, Column 1</td><td>Row 1, Column 2</td></tr><tr><td>Row 2, Column 1</td><td>Row 2, Column 2</td></tr><tr><td>Row 3, Column 1</td><td>Row 3, Column 2</td></tr></table>

<table><tr><th>Row 1, Column 1</th><th>Row 1, Column 2</th></tr><tr><th>Row 2, Column 1</th><th>Row 2, Column 2</th></tr><tr><th>Row 3, Column 1</th><th>Row 3, Column 2</th></tr></table>

<table><tr><th>Header 1</th><th>Header 2</th></tr><tr><td>Data 1</td><td>Data 2</td></tr></table>

<table><td>Row 1, Column 1</td><td>Row 1, Column 2</td></table>

Thẻ <li> được sử dụng để tạo một mục trong danh sách.

Thẻ <table> được sử dụng để tạo một bảng.

Thẻ <font> vẫn được hỗ trợ trong HTML5 để định dạng phông chữ.

Thẻ <ul> được sử dụng để tạo một danh sách có thứ tự.

<img>

<video>

<audio>

<picture>

alt

src

width

height

Có

Không

Tùy trường hợp

Chỉ trong HTML5

<img>

<video>

<audio>

<source>

alt

src

controls

width và height

Phát video tự động khi tải trang

Tắt âm thanh của video

Lặp lại video

Chỉ hiển thị video khi được nhấp vào

Hiển thị hình ảnh

Phát âm thanh

Nhúng video

Tạo bảng

Tắt âm thanh

Cung cấp giao diện điều khiển (play, pause, volume, etc.)

Phát tự động

Thay đổi kích thước

Hình ảnh

Video

Trang web hoặc tài liệu khác

Âm thanh

autoplay

muted

controls

src

Thẻ <img> được sử dụng để thêm tệp ảnh vào trang web

Thẻ <img> có cả thẻ mở và thẻ đóng

Thuộc tính src của thẻ <img> được sử dụng để chỉ định đường dẫn của tệp ảnh

Thuộc tính alt trong thẻ <img> dùng để mô tả hình ảnh cho các công cụ tìm kiếm và trợ giúp tiếp cận

Thẻ <video> và <audio> có thể sử dụng thuộc tính autoplay để tự động phát nội dung

Thuộc tính controls trong thẻ <video> và <audio> cung cấp giao diện điều khiển cho người dùng

Thuộc tính muted trong thẻ <video> dùng để tắt âm thanh của video

Thẻ <audio> không hỗ trợ phát video

Ô văn bản, nút chọn, hộp kiểm, nút lệnh

Văn bản, nút chọn, hộp kiểm

Ô văn bản, hộp kiểm

Nút chọn, danh sách, bảng biểu

<form>

<img>

<label> 

<input>

<input type="text" name=“Tên_điều_khiển” value=“Giá trị”>

<input type="lable" name=“Tên_điều_khiển” value=“Giá trị”>

<input type="audio" name=“Tên_điều_khiển” value=“Giá trị”>

<input type="checkbox" name=“Tên_điều_khiển” value=“Giá trị”>

Trình duyệt sẽ tải lại trang

Biểu mẫu sẽ tự động lưu vào máy tính của người dùng

Dữ liệu trong biểu mẫu sẽ được gửi đến máy chủ web để xử lý

Không có gì xảy ra

Một loại hình ảnh động

Một phần tử HTML để thu thập dữ liệu từ người dùng

Một đoạn mã JavaScript

Một loại tệp tin hình ảnh

Hiển thị dòng có nhãn Matkhau và ô Password để người dùng nhập mật khẩu

Hiển thị dòng có nhãn Password và ô Mật khẩu để người dùng nhập mật khẩu

Hiển thị dòng có nhãn Mật khẩu và ô Password để người dùng nhập mật khẩu

Hiển thị dòng có nhãn Password và ô Matkhau để người dùng nhập mật khẩu

<input type="submit" name="subdangki" > Đăng kí

<input type="radio" name="subdangki" value="Đăng kí">

<input type="checkbox" name="subdangki" value="Đăng kí">

<input type="submit" name="subdangki" value="Đăng kí">

<input type= "checkbox" name="bongban"> Bóng bàn 

<input type= "checkbox" name="caulong"> Cầu lông 

<input type= "checkbox" name="covua"> Cờ vua 

<p> <input type= "checkbox" name="bongban"> Bóng bàn </p>

<p> <input type= "checkbox" name="caulong"> Cầu lông </p>

<p> <input type= "checkbox" name="covua"> Cờ vua <p>

<p>  <input type= "checkbox" name="bongban"> Bóng bàn 

<input type= "checkbox" name="caulong"> Cầu lông 

<input type= "checkbox" name="covua"> Cờ vua <p>

<p> <input type= "radio" name="bongban"> Bóng bàn </p>

<p> <input type= " radio " name="caulong"> Cầu lông </p>

<p> <input type= " radio" name="covua"> Cờ vua <p>

Trong định nghĩa phần tử form dùng phương thức GET, POST để xác định phương thức gửi dữ liệu

Phương thức GET không bị hạn chế về dung lượng

Phương thức POST bị hạn chế về dung lượng

Nếu không khai báo method trong phần tử form thì phương thức mặc định là GET

Trong điều khiển nhập xâu kí tự có sử dụng thuộc tính name và value để khai báo phần tử input

Thuộc tính value nếu có thì Giá trị được gán là giá trị mặc định của ô text trên màn hình duyệt web

Phần tử label giúp tạo ô nhập đoạn văn bản

HTML cho phép tạo nút lệnh để gửi dữ liệu, thường được gọi là nút submit

Hypertext Markup Language

Hypertext Media Language

Hypertext Multi-language

Hyperlink and Text Markup Language

Tạo trang web

Tạo bảng tính

Xử lý dữ liệu

Lập trình ứng dụng

Chỉ thị kiểu chữ

Bắt đầu thẻ

Đánh dấu phần tử bị lỗi

Kết thúc thẻ

Không phân biệt

Có phân biệt

 Phân biệt trong các phiên bản khác nhau

Chỉ phân biệt trong các trình duyệt khác nhau

Phần chân

Phần đầu

Phần thân

Phần meta

Nội dung của trang web

Siêu dữ liệu

Tiêu đề của trang web

Doctype

.docx

.txt

.xml

.html

<body>

<head>

<footer>

<header>

<meta>

<title>

<footer>

<header>

 Gửi tệp qua email

Mở tệp bằng trình duyệt web

Chạy tệp trên máy chủ

Mở tệp bằng trình soạn thảo văn bản

Mở tệp tin bằng trình soạn thảo văn bản

Nhấp đúp vào tệp tin cài đặt

Giải nén tệp tin cài đặt

Chạy chương trình từ trang web

 Phát ngẫu nhiên

Phát theo một vòng lặp liên tục

Không phát

Tự động phát khi trang web được tải

span và extent

width và height

size và dimension

length và breadth

 Tạo một đoạn văn bản

Tạo một phần riêng biệt của tài liệu

Tạo một liên kết

Tạo tiêu đề

3

4

5

6

Tạo các bảng

Tạo các siêu liên kết

Tạo các tiêu đề

Tạo các đoạn văn bản

Không thể điều khiển được.

Chỉ có thể điều khiển một phần.

Phụ thuộc vào cấu hình của trang web được nhúng.

Có, hoàn toàn có thể điều khiển.

<a>

<p>

<h1>

<div>

<footed>

<title>

<thead>

<header>

<head>

<title>

<header>

<h1>

<spam>

<p>

<div>

 <br>

Tô màu đỏ nội dung

In đậm nội dung

Tô màu vàng nội dung

 In nghiêng nội dung

Tạo một liên kết

Tạo một dòng mới

Tạo một đoạn văn mới

Tạo một hình ảnh

id

class

src

href

u

strong

em

Tất cả đều có cùng kích thước và kiểu chữ

Kích thước chữ tăng dần từ <h1> đến <h6> và kiểu chữ in nghiêng

Kích thước chữ không thay đổi và kiểu chữ khác nhau tùy thuộc vào trình duyệt

Kích thước chữ giảm dần từ <h1> đến <h6> và kiểu chữ in đậm

Tìm kiếm trên Internet

Chuyển hướng đến trang mặc định

Hiển thị lỗi

Mở trang chủ của tên miền đó

<td>

<caption>

<th>

<tr>

 <grid>

<btable>

<tab>

<table>

<li>

<ol>

<ul>

<table>

<table>

<ol>

<li>

<li>

<li>

<table>

<ul>

<ol>

<li>

<ol>

<item>

<list>

 <tr>

<row>

<th>

<td>

<tr>

<td>

<header>

<th>

Tạo một danh sách có thứ tự

Định nghĩa một thuật ngữ

Tạo một danh sách không thứ tự

Định nghĩa một định nghĩa

note

description

header

caption

 start

list

type

 order

Định nghĩa các hàng dữ liệu

Định nghĩa các tiêu đề cột.

Định nghĩa tiêu đề cột

Định nghĩa phần chân bảng

<table>

<ol>

 <li>

<ul>

padding

border

color

margin

<picture>

<img>

<image>

<figure>

 alt

 width

height

src

Xác định định dạng của ảnh

Xác định kích thước chiều cao của ảnh

Cung cấp nội dung thay thế khi hình ảnh không hiển thị được

 Xác định kích thước chiều rộng của ảnh

BMP, TIFF, PSD

JPG, PNG, GIF

PDF, DOCX, XLSX

RAW, SVG, AI

<audio>

 soundtrack

<music>

<sound>

Xác định định dạng của tệp âm thanh

Tự động phát âm thanh khi trang web được tải

Hiển thị các nút điều khiển âm thanh như phát, dừng, tăng giảm âm lượng

Điều chỉnh tốc độ phát lại âm thanh

 src

url

href

link

cm (centimeter)

px (pixel)

em

% (phần trăm)

 alt

title

src

link

Phát ngẫu nhiên

Phát theo một vòng lặp liên tục

Không phát

Tự động phát khi trang web được tải

Xác định tên của iframe

Xác định tên trang web được nhúng

Xác định tài nguyên web được nhúng

Xác định tiêu đề của trang web được nhúng

Có

Không

Tùy thuộc vào thẻ HTML

 Tùy thuộc vào cách viết của các giá trị này.

 <-Đây là chú thích CSS->

//Đây là chú thích CSS

/*Đây là chú thích CSS*/

{Đây là chú thích CSS}

1

2

3

4

Một phần tử duy nhất trong trang web

Tất cả các phần tử cùng loại trong trang web.

Tất cả các phần tử của tệp HTML không phân biệt kiểu

Tất cả các phần tử nằm trong bộ chọn của mẫu định dạng được quy định áp dụng mẫu định dạng này

<h1 style="color: red; font-size: 20px;">Tiêu đề</h1>

<h1 css="color: red; font-size: 20px;">Tiêu đề</h1>

<h1 color: red; font-size: 20px;>Tiêu đề</h1>

<h1 style='color; red font-size 20px;'>Tiêu đề</h1>

Trong thẻ <body>

Trong thẻ <style> nằm trong <head>

Trong một tệp .css riêng biệt

Trong thẻ <link>

<link type="stylesheet" href="styles.css">

 <link rel="stylesheet" href="styles.css">

<style href="styles.css"></style>

<css link="styles.css"></css>

<style> @import "styles.css";</style>

<link href="styles.css"></link>

<css>@import "styles.css"</css>

<head>@import "styles.css"</head>

 Chỉ áp dụng cho các phần từ h3

Chỉ áp dụng cho các phần tử h1

Áp dụng đồng thời h1, h2, h3 với điều kiện tất cả các phần tử này phải có mặt trong tệp HTML

Áp dụng đồng thời h1, h2, h3 không phụ thuộc vào điều kiện tất cả các phần tử này phải có mặt hay không trong tệp HTML

Sao chép nội dung tệp .css vào phần <head>…</head> của tệp HTML

Tạo liên kết đến tệp .css bằng lệnh @import đặt trong thẻ style bên trong <head>…</head> của tệp HTML

Sao chép nội dung tệp .css vào trong thẻ style rồi đặt trong <head>…</head> của tệp HTML

Sao chép vùng mô tả của tệp .css vào bên trong các phần từ tương ứng của bộ chọn trong mỗi phần tử tương ứng của trang web

Cần thiết lập mẫu định dạng CSS trước khi thiết lập tệp HTML

Cần thiết lập tệp HTML trước, sau đó mới thiết lập các mẫu định dạng CSS

Cần thiết lập đồng thời mẫu định dạng CSS và tệp HTML

Việc thiết lập mẫu định dạng CSS có thể độc lập hoàn toàn với việc thiết lập HTML

Creative Style Sheets

Computer Style Sheets

Cascading Style Sheets

Colorful Style Sheets

font-family

font-weight

font-style

font-size

Thiết lập các phần tử p có cỡ chữ gấp 2 lần mặc định của trình duyệt

Thiết lập các phần tử p có cỡ chữ bằng 200% so với phần tử cha của mình

Thiết lập các phần tử có cỡ chữ bằng 2 pixel

Thiết lập các phần tử p có cỡ chữ gấp hai lần phần tử gốc

Có cỡ chữ bằng cỡ chữ mặc định của trình duyệt

Có cỡ chữ bằng 50% của cỡ chữ mặc định của trình duyệt

 Có cỡ chữ bằng  200% của cỡ chữ mặc định của trình duyệt

Có cỡ chữ bằng 100% của phần tử gốc của văn bản

color

background-color

border-color

padding

Tạo khoảng cách giữa nội dung và viền khung

Tạo khoảng cách giữa phần tử và các phần tử xung quanh

Thay đổi độ rộng của khung

Đặt màu nền cho phần tử

Tạo khoảng cách giữa viền và các phần tử xung quanh.

Tạo khoảng cách giữa nội dung và viền của phần tử.

Đặt màu nền cho phần tử.

 Thay đổi kích thước văn bản.

Đường viền liền nét, màu xanh dương, dày 2 pixel

Đường viền đứt nét, màu xanh dương, dày 2 pixel

Đường viền kép, màu xanh dương, dày 2 pixel

Đường viền chấm bi, màu xanh dương, dày 2 pixel

margin: 10px 20px;

 margin: 10px 15px 20px 25px;

margin: top 10px; bottom 15px; left 20px; right 25px;

margin: all-sides 10px;

h1 {background-color:blue;}

h1{ background-color: “blue”;

 all.h1 {background-color:blue;}

h1.* {background-color:blue;}

p{text-left:10px; font-weight:italic;}

p{text-indent:10px; font-style:italic;}

 p{ text-indent:10px; font-style: “italic”;}

p.*{text-left:10px; font-weight: “italic”;}

.page-detail {color: red; line-height: 1.2em;}

page-detail { background-color:red; font-weight:bold;}

#page-detail {color: red; text-align: center;}

* .page-detail { background-color:red; padding:5px;}

 <p class= “text-red”>Gió đưa cành trúc la đà</p>

<span id= “text-red”>Gió đưa cành trúc la đà</span>

 <div class= “text-blue”>Gió đưa cành trúc la đà</div>

<div class= “text-red”>Gió đưa cành trúc la đà</div>

.text-red {color:red;}

 #text-red {color:red;}

li>text-red {color:red;}

ul>li>text-red {color:red;}

Các thẻ có cùng tên thẻ.

Các phần tử có thuộc tính id="class-name".

Các phần tử có thuộc tính class="class-name".

Các phần tử có thuộc tính #.

 Phần tử có thuộc tính class="id-name".

Phần tử có thuộc tính id="id-name".

Tất cả các phần tử trên trang.

Phần tử có tên thẻ là id-name.

*liet-ket-noi-bat

 lien-ket-noi-bat

#lien-ket-noi-bat

.lien-ket-noi-bat

*lien-ket

lien-ket

#lien-ket

.lien-ket

class

id

tag