Gắn thẻ đoạn văn mới. Làm cách nào tôi có thể thêm thụt lề dòng đầu tiên cho mỗi đoạn văn? Tạo danh sách html
Thẻ xác định đoạn văn, dấu cách, khối HTML và đoạn văn
Chúng ta hãy nhìn vào nó một cách chi tiết Khối và đoạn HTML như các thành phần của một trang web.
- Đoạn HTMLđược xác định bởi các thẻ.
- đoạn văn HTML thường chứa văn bản, thẻ định dạng và hình ảnh.
- Đoạn HTML không thể chứa các phần tử khối như tiêu đề
- , khối
và các đoạn khác. - khối HTMLđược xác định bởi thẻ .
- khối HTML có thể chứa bất kỳ phần tử nào của trang web, với số lượng bất kỳ.
- khối HTML Tuyệt vời cho các trang web và dễ dàng thao tác.
Hãy xem xét đoạn mã dưới đây:
Kết quả:
Chúng tôi có thể thấy điều đó đoạn văn HTML có vết lõm dọc - đây là một tính năng của thẻ. khối HTML
Thẻ không thể chứa khác hoặc
Về nguyên tắc, thẻ và . về nguyên tắc là giống nhau, nhưng tập đoàn W3C khuyến nghị sử dụng chữ cái nhỏ. Trong phiên bản mới của HTML, cũng như trong XHTML hiện đại, việc sử dụng chữ in hoa khi viết thẻ đều bị cấm.
Khối
Không gian HTML từ bảng ký tự đặc biệt
Không gian HTML cho phép bạn tăng khoảng cách giữa các từ và ký tự.
Đối với khoảng cách giữa các từ, cho dù Notepad có bao nhiêu thì trong mã nguồn cũng chỉ có một khoảng cách được hiển thị trên trang web. Nếu bạn cần tăng khoảng cách, hãy sử dụng ký tự khoảng trắng từ bảng ký hiệu. Bạn có thể hỏi: Tại sao lại cần những ý nghĩa được mã hóa của các ký tự thông thường này? - Tôi sẽ trả lời: Chúng cần thiết để hiển thị, ví dụ như các dấu ngoặc như vậy< >. Nói cách khác, để hiển thị các thẻ trên màn hình, trong trình soạn thảo của tôi, tôi viết: . Thẻ , như chúng ta nhớ, chuyển đổi văn bản thành dấu cách đơn (đánh máy).
Các cách hiển thị một đoạn HTML
Ví dụ về đầu ra đoạn văn.
Để tạo cho nó một phong cách cụ thể, bạn cần đặt văn bản vào vùng chứa thích hợp.
Tất cả các thẻ định dạng có thể được chia thành ba nhóm:
1. Thẻ tiêu đề ( h1-h6).
2. Thẻ thiết kế nội dung văn bản (
,
,
,
,
vân vân.).
3. Nhóm các thẻ (
,
,
)
Thẻ tiêu đề
Họ biến văn bản thông thường thành một tiêu đề ở một cấp độ nhất định. Nhãn
tạo tiêu đề cấp một - lớn nhất và quan trọng nhất (thường là tiêu đề của bài viết trên trang),
chịu trách nhiệm về tiêu đề cấp thứ sáu - nhỏ nhất và khó thấy nhất. Các thẻ này quan trọng đối với cả người dùng và công cụ tìm kiếm - cả hai đều yêu thích các tiêu đề có tiêu đề phụ. Thứ bậc của các cấp độ phải được tuân thủ, nghĩa là,
phải đi
, chứ không phải ngược lại.
Để hiểu cách thức hoạt động của nó, hãy nhập đoạn mã sau vào tệp html:
Tiêu đề cấp một
Tiêu đề cấp hai
Tiêu đề cấp ba
Tiêu đề cấp bốn
Tiêu đề cấp 5
Tiêu đề cấp sáu
Nó sẽ trông như thế này trong trình duyệt:
Thẻ thiết kế văn bản nội dung
Cho phép định dạng ở cấp độ ký tự. Hãy xem bạn có thể làm gì với chúng.
Kiểu chữ in đậm
Cần tập trung sự chú ý vào văn bản. Nó cũng quan trọng đối với các công cụ tìm kiếm; chúng có thể làm nổi bật các từ khóa.
Chịu trách nhiệm về các thẻ phong cách in đậm Và .
Chỉ số trên và chỉ số dưới
Chúng có thể được sử dụng trong các công thức, phương trình và chỉ định số lượng nhất định.
Thẻ có nhiệm vụ tạo chỉ mục , đối với những cái trên cùng, thẻ được sử dụng .
X 1=32 m 2
Giảm kích thước
Nếu bạn cần làm cho văn bản nhỏ hơn một giá trị đã đặt trên toàn trang thì bạn cần sử dụng thẻ
Văn bản thô. Giảm văn bản.
gạch dưới
Kiểu đánh dấu này có thể được sử dụng để biểu thị những thay đổi được thực hiện đối với tài liệu hoặc đơn giản là để thu hút sự chú ý đến văn bản.
Văn bản thô. Văn bản được gạch chân.
Gạch ngang
Bạn có thể gạch bỏ thông tin nếu nó đã mất đi sự liên quan. Đây là thẻ cho việc này
.
Chữ in nghiêng
Cần tập trung sự chú ý vào văn bản và có thể được tạo bằng thẻ hoặc .
Nhập văn bản máy tính
Sẽ xảy ra trường hợp bạn cần thêm mã nguồn của chương trình và kết quả hoạt động của chương trình đó vào một trang web. Để dễ dàng phân biệt trực quan các phần khác nhau của văn bản với nhau, các nhà phát triển HTML đã giới thiệu các thẻ thuộc nhóm này.
Vào thùng chứa
chứa mã chương trình và các biến của nó được đánh dấu bằng thẻ
và kết quả thực hiện là
. Thùng đựng hàng
chứa văn bản mà người dùng phải nhập từ bàn phím khi làm việc với chương trình và mọi thứ được đặt trong thẻ
, giữ nguyên định dạng ban đầu, bao gồm cả dấu cách thừa và ngắt dòng.
Như vậy a, b, c, Đây kết quả thực hiện chương trình , và đây là người dùng đã nhập văn bản hiển thị một cái gì đó như thế này
.
Trích dẫn và định nghĩa
Mã chương trình sẽ trông giống như
Như vậy
, các biến được chỉ định như sau:
a, b, c
, Đây
kết quả thực hiện chương trình
, và đây là
người dùng đã nhập văn bản
. Giữ nguyên định dạng ban đầu
hiển thị một cái gì đó như thế này
.
Trích dẫn trong thẻ blockquote.Trích dẫn bên trong cite container.
Trích dẫn ngắn được gắn thẻ q.
Ví dụ chung
Để hiểu rõ hơn mỗi thẻ chịu trách nhiệm gì và cách thức hoạt động của nó, hãy xem đoạn mã sau và kết quả thực thi của nó.
Béo văn bản có thể được tạo thành thẻ mạnh Và b. Phía sau chữ in nghiêng trả lời em Và Tôi.
Thẻ phụ Và hỗ trợđược sử dụng để tạo thấp hơn(x 1…x N) Và phía trên (42=16) chỉ mục. Del gạch bỏ, trong - nhấn mạnh.
Thẻ mã số, kbd, var Và mẫu hiếm khi được sử dụng và cần thiết để hiển thị danh sách chương trình
chữ viết tắt cần chỉ ra các chữ viết tắt ( HTML). Các thẻ blockquote, cite và q được sử dụng để định dạng dấu ngoặc kép ( Bầu trời đã thở vào mùa thu
)
Thẻ trước giữ nguyên định dạng văn bản gốc mà không xóa dấu cách hoặc ngắt dòng.
Trình duyệt diễn giải mã này như sau:
Nhóm thẻ
Điều cần thiết là văn bản không chảy thành một dòng liên tục mà được chia thành các thành phần logic.
- Bên trong thẻ là một đoạn văn.
Đoạn đầu tiên
Đoạn thứ hai
- Nhãn
di chuyển đến dòng tiếp theo trong một đoạn văn (sẽ không có thụt lề trước dòng).
cho phép bạn vẽ một đường ngang. Bạn có thể sử dụng nó để phân tách văn bản rõ ràng hơn. Thuộc tính chiều rộng, kích cỡ, màu sắc, căn chỉnh Và không có bóng râmđặt chiều rộng, độ dày, màu sắc, căn chỉnh và thiếu hiệu ứng 3D của đường tương ứng.
Dòng trên dòng.
Dòng dưới dòng.
Vì vậy, hãy trực tiếp tiến hành học ngôn ngữ HTML. Cuối cùng, có thêm một vài từ ngoài chủ đề.
Trong quá trình trình bày tài liệu, nhiều ví dụ sẽ được đưa ra, tôi khuyên bạn nên tự làm. Sau khi nhập văn bản ví dụ, hãy nhớ xem những gì bạn nhận được (tôi nghĩ chính bạn sẽ quan tâm). Nếu bạn sử dụng trình soạn thảo HTML chuyên dụng, thì theo quy định, chương trình đó có trình duyệt tích hợp riêng để bạn có thể xem kết quả công việc của mình.
Nếu mọi thứ thực sự khó khăn và bạn đang sử dụng một sổ ghi chú thông thường, thì để xem nó, bạn cần lưu văn bản nguồn có phần mở rộng .htm hoặc .html, sau đó xem tệp đã lưu trong trình duyệt. Nếu bạn có Windows thì trình duyệt Internet Explorer sẽ được tích hợp tự động khi cài đặt hệ thống.
Chà, có vẻ như vậy là hết rồi.
Hãy bắt tay vào công việc.
Thẻ bắt buộc (thẻ)
Có một số thẻ HTML cơ bản phải có trong văn bản của bất kỳ trang Web nào. Mỗi trang Web phải có một thẻ (tag) , nằm ngay đầu. Thẻ (thẻ) này mô tả tài liệu của bạn dưới dạng một trang Web ở định dạng HTML. Ngay phía sau tay cầm thường theo sau là thẻ (tag) , cho biết sự hiện diện của văn bản chứa tên trang và thông tin bổ sung về trang đó.
Phần HEAD thường chứa một thẻ (tag)
Trình soạn thảo HTML thông thường đã có sẵn một bộ thẻ (thẻ) trên khi tạo trang mới. Cần phải nói rằng việc lựa chọn tên cho các trang Web cần phải hết sức nghiêm túc, bởi vì chúng được các công cụ tìm kiếm sử dụng để tạo danh mục các trang Web. Công cụ tìm kiếm là một trang web giúp người dùng nhanh chóng tìm thấy những thông tin mà họ quan tâm. Trang của bạn có nhiều khả năng được tìm thấy bởi công cụ tìm kiếm được cung cấp một bộ từ khóa tìm kiếm cụ thể nếu những từ đó xuất hiện trong tiêu đề trang. Trong số các công cụ tìm kiếm phổ biến nhất là Yandex, Google, Aport, Yahoo, Rambler.
Tạo đoạn văn, ký tự khoảng trắng, tiêu đề
Các trình duyệt web thường không tính đến các ký tự dòng mới được người dùng nhập vào văn bản ở giai đoạn hình thành. Để bắt đầu một đoạn văn mới, hãy sử dụng thẻ (tag)
.
Sau khi mở một trang trong cửa sổ trình duyệt Web, tất cả các đoạn văn bản của nó được đánh dấu bằng thẻ (thẻ)
, được phân tách bằng các dòng trống, giúp cải thiện bố cục và hình thức của nó.
Theo mặc định, trình duyệt thường định dạng các đoạn văn được căn lề trái. Để buộc căn chỉnh, hãy sử dụng thuộc tính căn chỉnh. Với sự trợ giúp của nó, các đoạn văn có thể được căn trái, phải, giữa và căn đều.
Ví dụ:
|
Mã HTML: đoạn văn được căn trái... đoạn văn được căn chỉnh sang bên phải... đoạn văn được căn giữa... đoạn văn là hợp lý... |
Hiển thị trình duyệt: đoạn canh lề trái đoạn canh lề trái đoạn canh lề trái đoạn canh lề trái đoạn canh lề trái đoạn canh lề trái đoạn canh lề trái đoạn canh lề trái đoạn canh lề trái đoạn canh lề trái đoạn canh lề trái đoạn văn được căn chỉnh theo đúng đoạn văn được căn chỉnh theo đúng đoạn văn được căn chỉnh theo đúng đoạn văn được căn chỉnh theo đúng đoạn văn được căn chỉnh theo đúng đoạn văn được căn chỉnh theo đúng đoạn văn được căn chỉnh theo đúng đoạn văn được căn chỉnh theo bên phải đoạn văn được căn chỉnh vào giữa đoạn văn được căn chỉnh vào giữa đoạn văn được căn chỉnh vào giữa đoạn văn được căn chỉnh vào giữa đoạn văn được căn chỉnh vào giữa đoạn văn được căn chỉnh vào giữa đoạn văn được căn chỉnh vào giữa đoạn văn được căn chỉnh vào giữa đoạn văn được căn chỉnh vào giữa đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý đoạn hợp lý |
Trình duyệt web tự động ngắt văn bản trong các đoạn văn thành một dòng mới. Nếu nhiệm vụ là đặt bất kỳ tổ hợp từ nào vào một dòng thì thẻ sẽ được sử dụng cho mục đích này.
Để sang dòng mới sử dụng thẻ (tag)
. Nó yêu cầu trình duyệt ngừng đặt văn bản và các thành phần trang khác trong dòng hiện tại và chuyển sang dòng mới. Thẻ (thẻ) này không có đối tác gạch chéo của nó, được gọi là thẻ đóng (thẻ).
Công dụng chính của (các) thẻ này là buộc các thành phần nội tuyến được đặt tại một vị trí cụ thể trên trang. Nó cũng thuận tiện trong trường hợp cần tăng khoảng trống giữa các thành phần trang riêng lẻ.
– trong quá trình tạo một trang web, chúng ta phải làm việc rất nhiều với các khối văn bản, hay cụm từ văn bản. Một ngày nọ, tôi cần thêm một cụm từ văn bản sao cho trước cụm từ văn bản này có một số thụt lề văn bản từ cạnh html khối trong đó văn bản này đã được thêm vào.
Vì vậy, phương pháp đầu tiên là tự nhiên và đơn giản nhất. Để thụt lề văn bản, hãy thêm mã khoảng trắng html trước văn bản - Bạn có thể thêm mã khoảng trắng html trong bất kỳ trình soạn thảo html nào.
Dưới đây là ví dụ về mã hoạt động để đặt thụt lề cho văn bản bằng mã khoảng trắng:
HTML thụt lề văn bản bên trái, sử dụng mã không gian
Trong ví dụ này, trước văn bản chúng ta đã chọn, mã khoảng trắng là được thêm bốn lần, kết quả là chúng ta có được thụt lề mà chúng ta cần.
Chúng tôi biết rằng mã không gian được xử lý bởi bất kỳ trình duyệt nào. Do đó, bằng cách thêm số khoảng trắng cần thiết trước văn bản, bạn có thể nhận được mức thụt lề cần thiết cho văn bản.
Phương pháp này tốt vì nó được đảm bảo có thể được xử lý bởi bất kỳ trình duyệt nào.
Nhưng phương pháp này có một nhược điểm đáng kể. Để thụt lề văn bản đủ lâu trong mã html, bạn sẽ phải thêm một số lượng lớn ký tự khoảng trắng trước văn bản, trông có thể không đẹp, rườm rà và thiếu chuyên nghiệp.
Một giải pháp cho vấn đề này là phương pháp thiết lập thụt lề sau đây.
Thụt lề văn bản HTML, phương pháp hai - phương pháp này dựa trên các thuộc tính của thẻ blockquote. Thẻ này đặt mức thụt lề khoảng 40 pixel ở bên trái và bên phải cho văn bản được đặt trong đó. Ngoài ra, vết lõm được chỉ định ở trên cùng và dưới cùng. Một ví dụ về mã html để sử dụng phương pháp này được đưa ra dưới đây:
ở bên trái, sử dụng thẻ trích dẫn khối
Như bạn có thể thấy, phương pháp thiết lập thụt lề cho văn bản này rất dễ sử dụng, nhưng phương pháp này cũng có một nhược điểm đáng kể. Thụt lề mà thẻ đặt trích dẫn khốiđược cố định và luôn bằng cùng một giá trị – 40px.
Để khắc phục tình trạng này và khi thêm thụt lề html va cho chữđể có thể đặt bất kỳ giá trị nào, chúng ta sẽ sử dụng phương pháp thứ ba.
Thụt lề văn bản HTML, phương pháp thứ ba.
Ở đây chúng ta sẽ sử dụng thuộc tính thụt lề văn bản của CSS Cascading Style Sheets.
Nếu chúng ta mở sách tham khảo CSS, trên trang có mô tả các thuộc tính của thụt lề văn bản, chúng ta sẽ thấy rằng bằng cách thụt lề văn bản, chúng ta có thể đặt giá trị thụt lề của dòng đầu tiên hoặc đoạn đầu tiên hoặc bất kỳ khối văn bản nào .
Chúng tôi đang xem xét một ví dụ với một khối văn bản ngắn, vì vậy thuộc tính thụt lề văn bản khá phù hợp với trường hợp của chúng tôi.
Dưới đây là mã html thụt lề văn bản bằng cách thụt lề văn bản. Ví dụ cho thấy rằng bằng cách đặt thụt lề văn bản thành các giá trị đối số khác nhau, chúng ta có thể thay đổi mức độ thụt lề văn bản:
HTMLvết lõmchữ, Kiểu CSS hoạt động - thụt lề văn bản
Theo tôi, phương pháp thụt lề cho văn bản này là tối ưu nhất, tuy nhiên, hãy xem xét một cách khác để thụt lề bằng hình ảnh.
Thụt lề văn bản HTML, phương pháp thứ tư - ở đây chúng ta sẽ sử dụng hình ảnh để thụt lề.
Để làm ví dụ hoạt động, hãy xem ngay mã html minh họa cách hoạt động của phương thức này:
ở bên trái, sử dụng hình ảnh
Từ ví dụ trên có thể thấy rõ rằng bằng cách thay đổi độ rộng của hình ảnh, chúng ta có thể thay đổi vị trí của văn bản, tức là đặt mức thụt lề mong muốn cho văn bản.
Là một hình ảnh, bạn có thể sử dụng hình ảnh có chiều rộng và chiều cao bằng một pixel. Để ngăn hình ảnh chúng tôi đang sử dụng hiển thị trên trang, chúng tôi sẽ đặt màu của nó giống hệt với nền của trang web.
Theo tôi, các phương pháp thụt lề cho văn bản ở trên là khá đủ để sắp xếp mức thụt lề mà bạn cần trong mọi tình huống khi thêm nội dung vào trang trên trang web của bạn.
Bất kỳ văn bản nào cũng có cấu trúc độc đáo riêng: sách được chia thành các phần, phần và chương, báo và tạp chí có các tiêu đề và tiêu đề phụ riêng biệt, lần lượt bao gồm các đoạn văn bản cũng có cấu trúc riêng: đoạn văn, thụt lề, v.v.
Văn bản đăng trên các trang web cũng không ngoại lệ, nó cũng phải có cấu trúc logic, dễ hiểu đối với mọi người dùng. Rốt cuộc, điều này phụ thuộc rất nhiều vào mức độ cảm nhận của văn bản trên trang một cách thuận tiện và đơn giản: trước hết, khách truy cập sẽ có ấn tượng gì về trang web của bạn.
Để tạo các đơn vị văn bản có cấu trúc như đoạn văn, tài liệu HTML sử dụng thẻ
, phân tách các đoạn văn bản bằng dấu thụt lề dọc (một dòng trống được thêm vào trước và sau đoạn văn).
Lưu ý: mặc định khoảng cách giữa các đoạn văn là 1em (em là đơn vị đo bằng chiều cao của phông chữ), tức là khoảng cách giữa các đoạn văn trực tiếp phụ thuộc vào cỡ chữ.
Để thay đổi lề giữa các đoạn văn mà không thay đổi cỡ chữ, bạn có thể sử dụng thuộc tính CSS lề.
Đừng quên thẻ đóng
Hầu hết các trình duyệt sẽ hiển thị tài liệu HTML một cách chính xác ngay cả khi bạn quên thẻ đóng.
Đoạn văn
Một đoạn khác
Mã này sẽ hoạt động trên hầu hết các trình duyệt, nhưng đừng dựa vào nó. Thẻ đóng bị quên có thể dẫn đến kết quả hoặc lỗi không mong muốn.
vạch kẻ màu đỏ
Đường màu đỏ là gì? Theo định nghĩa, đây là dòng bắt đầu của một đoạn văn, thường được đánh dấu bằng màu đỏ (do đó có tên). Trước khi phát minh ra kỹ thuật in ấn, sách được viết bằng tay - một chương hoặc một phần văn bản, từ hoặc chữ cái đầu tiên được viết bằng sơn đỏ. Đây là cách mà khái niệm “viết từ vạch đỏ” xuất hiện - điều này có nghĩa là sự khởi đầu của một suy nghĩ, chương hoặc phần mới.
Tuy nhiên, khi tạo trang web, thiết kế đường màu đỏ hiếm khi được sử dụng, mặc dù thực tế là nó giúp việc cảm nhận văn bản một cách trực quan thuận tiện hơn nhiều, điều này khá quan trọng đối với người đọc truyền thống - không phải ai cũng cảm thấy thoải mái khi đọc phiên bản điện tử của nó. văn bản.
Để thêm dòng màu đỏ vào đoạn văn, bạn cần sử dụng thuộc tính CSS thụt lề văn bản, cho phép bạn thụt lề câu đầu tiên:
Thử "
Trong ví dụ trên, dòng đầu tiên của mỗi đoạn trên trang sẽ bắt đầu bằng mức thụt lề 25px. Ví dụ bên dưới minh họa cách bạn chỉ có thể đặt đường màu đỏ cho một đoạn cụ thể trên một trang.
Như trong bất kỳ nghệ thuật thực sự nào, không có chuyện vặt vãnh trong những văn bản hay, trong đó một số có thêm đường màu đỏ, vì tin rằng việc sử dụng nó không quá quan trọng. Tuy nhiên, chúng ta phải hiểu rằng bất kỳ dấu phẩy nào cũng mang cả tải trọng thẩm mỹ và ngữ nghĩa, và không chỉ thể hiện các quy tắc ngữ pháp - điều này còn áp dụng cho định dạng.
Thử "Lưu ý: không cần thiết phải đặt mức thụt lề thành 25px, bạn có thể tự chọn kích thước thụt lề tối ưu và sử dụng thuộc tính thụt lề văn bản, có thể tạo một dòng nhô ra phía trên phần còn lại của văn bản; để làm được điều này, bạn cần đặt giá trị âm cho thuộc tính (ví dụ: -30px).
