Questions and Answers
Thẻ nào được sử dụng để định nghĩa tiêu đề của một trang HTML?
Thẻ nào sau đây không phải là thẻ thường gặp trong HTML?
Tại sao CSS lại quan trọng trong việc thiết kế web?
Cách nào dưới đây không phải là một phương pháp để bao gồm CSS trong HTML?
Signup and view all the answers
Khi sử dụng Media Queries trong CSS, cái gì thường được điều chỉnh?
Signup and view all the answers
Thì nào sau đây cho phép định dạng văn bản trong CSS?
Signup and view all the answers
Phương thức nào được sử dụng để chỉ định các thuộc tính vị trí của một phần tử?
Signup and view all the answers
Thẻ nào được sử dụng để định nghĩa một danh sách không có thứ tự trong HTML?
Signup and view all the answers
Study Notes
HTML Structure
-
HTML Definition: HyperText Markup Language, used for creating web pages.
-
Basic Structure:
-
<!DOCTYPE html>
: Declares the document type. -
<html>
: Root element of an HTML page. -
<head>
: Contains metadata and links to resources (e.g.,<title>
,<link>
,<meta>
). -
<body>
: Contains the content of the web page (e.g., text, images, links).
-
-
Common HTML Elements:
- Headings:
<h1>
to<h6>
for titles and subtitles. - Paragraphs:
<p>
for text blocks. - Links:
<a href="URL">
for hyperlinks. - Lists:
- Ordered:
<ol>
for numbered lists. - Unordered:
<ul>
for bullet lists.
- Ordered:
- Images:
<img src="URL" alt="description">
for displaying images. - Divisions:
<div>
for grouping content. - Forms:
<form>
for user input; includes<input>
,<textarea>
,<button>
, etc.
- Headings:
-
Semantic HTML: Use of HTML5 elements that provide meaning to the content.
- Examples:
<header>
,<footer>
,<article>
,<section>
,<nav>
.
- Examples:
CSS Styling Techniques
-
CSS Definition: Cascading Style Sheets, used for styling HTML elements.
-
CSS Syntax:
- Selector: Targets HTML elements (e.g., tags, classes, IDs).
- Declaration Block: Contains property-value pairs (e.g.,
color: red;
).
-
Ways to Include CSS:
- Inline:
<element style="property: value;">
for individual elements. - Internal:
<style>
tag within the<head>
for styling a single document. - External: Linking to a separate
.css
file using<link rel="stylesheet" href="styles.css">
.
- Inline:
-
Selectors:
- Type Selector: Targets all instances of a tag (e.g.,
p {}
). - Class Selector: Targets elements with a specific class (
.classname {}
). - ID Selector: Targets a specific element with an ID (
#idname {}
). - Attribute Selector: Targets elements with a specific attribute (e.g.,
[type="text"]
).
- Type Selector: Targets all instances of a tag (e.g.,
-
Common CSS Properties:
- Colors:
color
,background-color
. - Box Model:
margin
,padding
,border
,width
,height
. - Fonts:
font-family
,font-size
,font-weight
. - Layout:
display
,position
,flex
,grid
.
- Colors:
-
Responsive Design:
- Media Queries: Using
@media
to apply styles based on device characteristics (e.g., screen size). - Flexible Units:
%, em, rem
for scalable layouts.
- Media Queries: Using
Cấu trúc HTML
- Định nghĩa HTML: Ngôn ngữ đánh dấu siêu văn bản (HyperText Markup Language), dùng để tạo trang web.
-
Cấu trúc cơ bản:
-
<!DOCTYPE html>
: Khai báo loại tài liệu. -
<html>
: Phần tử gốc của một trang HTML. -
<head>
: Chứa thông tin siêu dữ liệu và liên kết đến các tài nguyên khác (như<title>
,<link>
,<meta>
). -
<body>
: Chứa nội dung chính của trang web (ví dụ: văn bản, hình ảnh, liên kết).
-
-
Các phần tử HTML phổ biến:
- Tiêu đề: Các thẻ từ
<h1>
đến<h6>
dùng cho tiêu đề và tiêu đề phụ. - Đoạn văn: Thẻ
<p>
dùng để tạo các khối văn bản. - Liên kết: Thẻ
<a>
dùng để tạo liên kết siêu văn bản. - Danh sách:
- Danh sách có thứ tự: Thẻ
<ol>
dùng cho danh sách có số thứ tự. - Danh sách không có thứ tự: Thẻ
<ul>
dùng cho danh sách không có số thứ tự.
- Danh sách có thứ tự: Thẻ
- Hình ảnh: Thẻ
<img>
dùng để hiển thị hình ảnh. - Khối nội dung: Thẻ
<div>
dùng để nhóm nội dung. - Biểu mẫu: Thẻ
<form>
dùng để nhập liệu từ người dùng; bao gồm<input>
,<button>
,<select>
, v.v.
- Tiêu đề: Các thẻ từ
- HTML ngữ nghĩa: Sử dụng các phần tử HTML5 để cung cấp ý nghĩa cho nội dung.
-
Ví dụ ngữ nghĩa: Các phần tử như
<article>
,<section>
,<header>
,<footer>
,<nav>
.
Kỹ thuật định dạng CSS
- Định nghĩa CSS: Tài liệu kiểu xếp chồng (Cascading Style Sheets), dùng để định dạng các phần tử HTML.
-
Cú pháp CSS:
- Bộ chọn (Selector): Nhắm đến các phần tử HTML (ví dụ: thẻ, lớp, ID).
- Khối khai báo (Declaration Block): Chứa các cặp giá trị thuộc tính (ví dụ:
color: red;
).
-
Cách đưa CSS vào trang:
- Nội tuyến: Sử dụng thuộc tính
style
trên các phần tử riêng lẻ. - Nội bộ: Sử dụng thẻ
<style>
bên trong thẻ<head>
cho một tài liệu cụ thể. - Ngoại vi: Liên kết đến một tệp
.css
riêng bằng thẻ<link>
.
- Nội tuyến: Sử dụng thuộc tính
-
Các bộ chọn:
- Bộ chọn loại: Nhắm đến tất cả các trường hợp của một thẻ (ví dụ:
p {}
). - Bộ chọn lớp: Nhắm đến các phần tử có một lớp cụ thể (
.classname {}
). - Bộ chọn ID: Nhắm đến một phần tử cụ thể với ID (
#idname {}
). - Bộ chọn thuộc tính: Nhắm đến các phần tử có thuộc tính cụ thể (ví dụ:
[type="text"]
).
- Bộ chọn loại: Nhắm đến tất cả các trường hợp của một thẻ (ví dụ:
-
Các thuộc tính CSS phổ biến:
- Màu sắc:
color
,background-color
. - Mô hình hộp:
margin
,padding
,border
,width
,height
. - Phông chữ:
font-family
,font-size
,font-weight
. - Bố cục:
display
,position
,flex
,grid
.
- Màu sắc:
-
Thiết kế đáp ứng:
- Truy vấn phương tiện: Sử dụng
@media
để áp dụng kiểu tùy thuộc vào đặc điểm thiết bị (ví dụ: kích thước màn hình). - Đơn vị linh hoạt: Sử dụng
%, em, rem
cho các bố cục có thể mở rộng.
- Truy vấn phương tiện: Sử dụng
Studying That Suits You
Use AI to generate personalized quizzes and flashcards to suit your learning preferences.
Description
Khám phá các thành phần chính trong cấu trúc HTML. Quiz này giúp bạn hiểu rõ hơn về các phần tử HTML như thẻ tiêu đề, đoạn văn, và danh sách cũng như cách sử dụng chúng. Hãy thử sức với các câu hỏi để kiểm tra kiến thức của bạn về HTML!