Hướng dẫn html pre là gì
Học HTML cơ bản là việc bạn cần làm khi muốn thiết kế webiste dù là chuyên nghiệp hay nghiệp dư bởi HTML là một trong hai nền tảng quan trọng nhất cho việc xây dựng website, HTML có một vai trò quan trọng giúp bạn hiểu khái quát về một website và bạn có thể tự tùy biến giao diện trong việc thiết kếweb. Trọng serie học HTML cơ bản này tôi sẽ giới thiệu về HTML đến bạn một cách chi tiết nhất và giúp bạn nhanh chóng nắm bắt được nó thông qua các ví dụ cụ thể. Show
NỘI DUNG CHÍNH
HTML là gì?HTML hay còn gọi là ngôn ngữ đánh dấu siêu văn bản được sử dụng để tạo nên website, trên một website sẽ có nhiều trang và mỗi trang sẽ được đánh dấu là 1 tập tin HTML. Một tài liệu hay tập tin HTML được tạo nên bởi các phần tử HTML được quy định bằng các cặp thẻ tag, các cặp thẻ này nằm trong cặp dấu ngoặc nhọn (ví dụ: ) và thường khai báo thành một cặp gồm thẻ mở và thẻ đóng ( Xin chào các bạn ) nhưng một số thẻ lại không có thẻ đóng và dữ liệu được khai báo nằm trong các thuộc tính ( ví du: Nhưng tôi khuyên các bạn không nên sử dụng Notepad sửa tập tin HTML vì dễ bị lỗi hiển thị ký tự tiếng Việt. Các bạn có thể sử dụng rất nhiều các chương trình soạn thảo tương tự khác để soạn thảo tập HTML. Vai trò của HTML trong websiteHTML là ngôn ngữ đánh dấu siêu văn bản nên vai trò của HTML trong website là xây dựng cấu trúc siêu văn bản cho website hoặc khai báo các tập tin hình ảnh, video, nhạc… Điều đó không có nghĩa là HTML có thể tạo nên một website mà nó chỉ đóng vài trò hình thành cấu trúc trên website. Ví dụ webstie acuong.com được hình thành bởi: HTML: Xây dựng cấu trúc và định dạnh siêu văn bản CSS: Định dạng siêu văn bản thô tạo ra từ HTML thành bố cục website có màu sắc, ảnh nền… PHP: Ngôn ngữ lập trình dùng để xử lý và trao đổi dữ liệu giữa máy chủ với trình duyệt My SQL: Hệ quản trị cơ sở dữ liệu truy vấn có cấu trúc Javascript: Tạo ra sự kiện tương tác với hành vi của người dùng Trong serie học HTML cơ bản này, các bạn đã hiểu được HTML là gì, vai trò của HTML và có thể dùng nó để soạn thảo những tài liệu HTML phục vụ việc thiết kế web. Hy vọng bạn sẽ thiết kế được một website như ý. Chúc bạn thành công! Bắt đầu từ phần này, chúng ta sẽ cùng nhau làm việc trong cặp thẻ Trong khuôn khổ bài viết này, mình sẽ giới thiệu chi tiết các thẻ HTML dành cho mục đích định dạng chữ viết và văn bản bên trong website, ví dụ như tiêu đề văn bản, in đậm, in nghiêng,… Tiêu đề và đoạn văn bảnTiêu đề (Headline) và đoạn văn bản (Paragraph) là hai thành phần mà bạn cần phân biệt để sau này sử dụng cho đúng. Bạn hãy hiểu rằng, tiêu đề văn bản nó giống như tên của từng chương trong một quyển sách vậy, nó sẽ được hiển thị to hơn nhằm nổi bật hơn. Trong HTML, các thẻ tiêu đề sẽ được định nghĩa bằng cặp thẻ See the Pen HTML Headline level by Thach Pham (@thachpham92) on CodePen. Bạn thấy không, thẻ Còn đoạn văn bản thì nó sẽ được khai báo bằng cặp thẻ See the Pen RNOzJj by Thach Pham (@thachpham92) on CodePen. Các thẻ định dạng chữ viếtĐôi khi trong văn bản của bạn sẽ cần định dạng lại chữ viết như in đậm, tô nghiêng, gạch chân,…và đây là các thẻ HTML cho từng chức năng đó. Trước hết là hãy soạn một đoạn văn bản HTML như thế này: See the Pen HTML text markup by Thach Pham (@thachpham92) on CodePen. Mình xin giải thích một số thẻ mới như sau:
Thẻ trích dẫnTrích dẫn (Quote) là một thẻ có thể bạn sẽ thường sử dụng nếu thường xuyên viết báo hay phóng sự, mục đích của nó là định dạng một câu nói như một câu trích dẫn và có thể định dạng thêm tên người trích dẫn một cách chuyên nghiệp hơn, thẻ trích dẫn được quy định là See the Pen HTML Quote by Thach Pham (@thachpham92) on CodePen. Lưu ý rằng thẻ Thẻ định dạng sẵnTrong HTML hiện tại nó có một thẻ được gọi là thẻ định dạng sẵn (preformatted), thẻ này sẽ được viết là Thẻ See the Pen HTML preformatted by Thach Pham (@thachpham92) on CodePen. Ngoài ra cũng lưu ý rằng khi viết văn bản trong cặp thẻ Thuộc tính style để định dạng chữ viếtMặc dù việc lên màu sắc trên website là do CSS đảm nhận, nhưng nếu là một văn bản HTML thông thường thì bạn vẫn có thể thêm màu sắc cho chữ viết bằng thuộc tính See the Pen Thuộc tính style của HTML by Thach Pham (@thachpham92) on CodePen. Cấu trúc viết thuộc tính sẽ là Màu chữĐể thiết lập màu chữ, bạn có thể sử dụng thuộc tính [html]chữ màu đỏ[/html] Màu nềnMàu nền có cách thiết lập giống hệt màu chữ, tức là bạn có thể dùng giá trị là tên màu trong tiếng Anh hoặc mã màu HEX. Tên thuộc tính của màu nền là [html]Chữ có nền màu đỏ và màu chữ là trắng[/html] Kích thước chữKích thước chữ bạn có thể sử dụng thuộc tính [html]Chữ có kích thước 32px[/html] Font chữNếu bạn có nhu cầu sử dụng font chữ khác so với font chữ mặc định thì hãy dùng thuộc tính [html]Font chữ Arial[/html] Ngoài ra bạn có thể thêm font chữ dự phòng bằng cách khai báo nhiều tên font chữ khác nhau được ngăn cách bởi dấu phẩy, ví dụ: [html]Font chữ Arial[/html] Có nghĩa là nếu máy người đọc không có font chữ Helvetica thì nó sẽ sử dụng font chữ Arial. Căn lề văn bảnĐể canh lề, chúng ta sử dụng thuộc tính [html]Canh giữa văn bản[/html] Lời kếtCó vẻ bài này chúng ta đã tìm hiểu hơi nhiều về HTML rồi phải không nè? Nhưng những gì mình đề cập ở trên đều rất quan trọng và bạn cần nên tập viết nhiều để làm quen với nó vì về sau nó sẽ giúp ích bạn nhiều trong công việc nói chung và việc làm web nói riêng. Pre trong CSS là gì?Định nghĩa và sử dụng
Tag <pre> định một đoạn văn bản đã được định dạng sẵn. Có bao nhiêu khoảng trắng bên trong thành phần <pre> đều hiển thị hết ra ngoài trình duyệt. Text bên trong thành phần <pre> thường được định dạng sẵn font, thường là Courier. Thường được sử dụng trong văn bản máy tính.
Thẻ pre dụng thẻ làm gì?Thẻ <pre>: Thẻ này dùng để xác định văn bản được định dạng đúng như lúc bạn nhập code. Bạn có thể hiểu như khi bạn code 1 đoạn văn bản, chủ ý của bạn là sử dụng khoảng trắng dài (khoảng tab chẳng hạn) hay xuống dòng (nhấn enter) nhưng khi đưa vào trình duyệt thì trình duyệt chỉ xem đấy như 1 khoảng trắng bình thường.
Học HTML và CSS để làm gì?HTML (HyperText Markup Language) : là một ngôn ngữ đánh dấu được thiết kế ra để tạo nên các trang web, nghĩa là các mẩu thông tin được trình bày trên World Wide Web. CSS (Cascading Style Sheets) : định nghĩa về cách hiển thị của một tài liệu HTML. CSS đặc biệt hữu ích trong việc thiết kế Web.
Code trong HTML là gì?Thẻ code trong HTML (thẻ <code>) được dùng để đánh dấu các dòng code cho đoạn dữ liệu nó chứa. Nội dung bên trong thẻ code sẽ được mặc định sử dụng font chữ monospace của trình duyệt. Thẻ code nằm trong nhóm thẻ giúp định dạng dữ liệu. Cụ thể, nó giúp dữ liệu được hiển thị chính xác với định dạng ban đầu.
|