Hướng dẫn ngôn ngữ lập trình HTML. HTML: Khái niệm cơ bản cho người mới bắt đầu

Phần này của trang web hoàn toàn dành cho hai ngôn ngữ để tạo trang web, đó là HTML và CSS. Tại đây bạn có thể học ngôn ngữ từng bước, học mọi thứ từ những điều cơ bản cho đến những thời điểm khó khăn nhất.

Phần này được xây dựng trên nguyên tắc nghiên cứu từng bước Do đó, trước mỗi tiêu đề của bài học về HTML và CSS đều có số tương ứng với số thứ tự của bài học. Điều này là tự nhiên nếu bạn muốn học mọi thứ từ những điều cơ bản nhất và không khiến đầu óc mình trở nên lộn xộn. Nếu bạn đã biết đôi điều về ngôn ngữ HTML và CSS thì bạn cũng có thể tìm thấy ở đây những kiến thức bạn còn thiếu hoặc đào sâu hơn những gì bạn đã học.

TRONG phần này Các bài học về tiêu chuẩn ngôn ngữ HTML5 và CSS3 đã được đăng tương ứng; nếu có bất kỳ phiên bản mới hơn nào của các ngôn ngữ này, chúng cũng sẽ được phản ánh trong các bài học mới trong phần này và bạn chắc chắn sẽ tìm ra.

Có lẽ mỗi người đã từng tạo một trang web ít nhất một lần trong đời chắc chắn đã nghe nói về sự kết hợp như html và css, tôi có thể tự tin nói rằng nếu bạn muốn tự làm trang web thì bạn không thể làm gì nếu không có kiến thức về những điều này. hai điều.

Sau khi bạn đã nhận được Khái niệm chung Rõ ràng có một hình ảnh mơ hồ trong đầu bạn về html là gì và tôi nghĩ điều này không có gì đáng ngạc nhiên. Đã đến lúc chuyển thẳng sang thực hành và tạo tài liệu HTML đầu tiên của bạn.

Giống như ngôn ngữ html, CSS có những đặc điểm, quy tắc và cấu trúc riêng. Trong bài học này tôi sẽ cho bạn biết về các khái niệm cơ bản ngôn ngữ CSS, về cấu trúc, thiết bị của nó và chúng tôi sẽ cùng bạn thực hiện phần đầu tiên bảng CSS style và tìm hiểu cách kết nối biểu định kiểu với tài liệu html.

Bộ chọn trong CSS là nền tảng của ngôn ngữ và việc học cũng như hiểu chúng là rất quan trọng, vì vậy trong bài học này tôi sẽ cho bạn biết thêm về một số loại bộ chọn khác và mô tả khả năng của chúng.

Rất tâm điểm Khi tạo một trang web, bạn cần phải làm việc với văn bản và như bạn hiểu, bạn cũng cần có khả năng làm việc với văn bản trong html và biết những thẻ nào có và cách sử dụng chúng.

Sau khi bạn đã học tất cả các thẻ HTML để làm việc với văn bản, giờ là lúc chuyển thẳng sang CSS làm việc với văn bản, điều này sẽ mở rộng đáng kể kiến thức và khả năng của bạn.

trong CSS số lượng lớn tất cả các loại đặc tính ngoại hình thuận tiện và thay đổi chất lượng và chúng tôi tiếp tục nghiên cứu công việc CSS với văn bản và trong bài học này chúng ta sẽ đi sâu vào chủ đề làm việc với văn bản và xem xét các thuộc tính mới của văn bản.

Làm việc với hình ảnh khi tạo từ một trang web, một trong những những điểm chính, cả khi tạo thiết kế cũng như khi chỉ đơn giản bố trí hoặc viết bất kỳ tài liệu nào cho trang web của bạn.

CSS mở rộng đáng kể khả năng làm việc với bất kỳ đối tượng html, trong bài học này tôi muốn nói chi tiết với các bạn về các thông số có thể áp dụng cho hình ảnh.

Xin chào! Trong bài viết này chúng ta sẽ xem xét những điều cơ bản của ngôn ngữ đánh dấu HTML, hãy làm quen với cấu trúc của một tài liệu HTML và các thẻ chính. Để tạo tài liệu HTML, bạn có thể sử dụng notepad thông thường, lưu tệp có phần mở rộng .html, nhưng tốt hơn là bạn nên làm việc trong một notepad đặc biệt để viết mã Notepad++, bạn có thể tải xuống từ trang web chính thức, nó hoàn toàn miễn phí .

Sau khi tải xuống và cài đặt, hãy mở chương trình và đặt mã hóa thành “UTF-8 (không có bum)”, như trong ảnh chụp màn hình.

Bây giờ chúng ta hãy nhìn vào cấu trúc của tài liệu. Đây là những gì được gọi là bộ xương HTML trông như thế nào.

Tiêu đề của toàn bộ tài liệu

Hãy chú ý đến thứ bậc của các thành phần trong cấu trúc tài liệu. Phần tử gốc được coi là , và tất cả các phần tử tiếp theo đều nằm trong nó và ở cuối tài liệu cho biết phần đóng của nó. Bất kỳ phần tử nào được viết trước hoặc sau thẻ sẽ không được trình duyệt xử lý.

Phần tử này là cha của các phần tử và và chúng lần lượt là phần tử con vì chúng nằm trong thẻ …. Hệ thống phân cấp này sẽ mở rộng đến tất cả các phần tử lồng nhau của tài liệu.

Yếu tố

Thẻ... chứa Thông tin kĩ thuật về trang web: mã hóa, tiêu đề, mô tả, từ khóa, kết nối các biểu định kiểu, phông chữ, v.v. Nội dung trong phần này không được hiển thị trong cửa sổ trình duyệt, nhưng dữ liệu này cho trình duyệt biết chính xác cách hiển thị trang.

Thẻ bắt buộc có trong ... là ... . Đây là tiêu đề của toàn bộ tài liệu và được hiển thị trên tab mở trình duyệt và trong kết quả của công cụ tìm kiếm, trong cái gọi là đoạn mã và kích thước của nó không được vượt quá 60 ký tự. Thẻ rất quan trọng để quảng bá SEO của một trang web.

Tiêu đề của toàn bộ tài liệu

Thẻ được coi là thành phần phần tùy chọn nhưng hầu như luôn được sử dụng. Thẻ này là thẻ đơn và không yêu cầu đóng, chẳng hạn như .... Với sự trợ giúp của nó, siêu dữ liệu của trang được đề cập ở trên, tất cả các loại phần tử đánh dấu, chặn lập chỉ mục, v.v. đều được chỉ định.

Mô tả trang được chỉ định bằng cách sử dụng thuộc tính tên và giá trị của nó là mô tả. Mô tả cũng rất quan trọng để quảng bá trang web trong công cụ tìm kiếm.

Có rất nhiều tranh luận về ý nghĩa của từ khóa; nhiều quản trị viên web tin rằng từ khóa đó công cụ tìm kiếm Họ đã không được chú ý trong một thời gian dài và do đó không được kê đơn nào cả, trong khi những người khác lại khẳng định điều ngược lại.

Thuộc tính bộ ký tự chỉ định mã hóa của tài liệu sẽ được sử dụng. khoảnh khắc này có giá UTF-8.

Thẻ là duy nhất và được sử dụng để xác định mối quan hệ giữa tài liệu hiện tại và các tệp khác hoặc nói một cách đơn giản hơn là kết nối nội dung tập tin của bên thứ ba vào trang của chúng tôi, có thể có một số kết nối như vậy. Nó cũng có thể chỉ ra tính chuẩn của tài liệu.

Yếu tố

Phần tử là phần chính của tài liệu được hiển thị trong cửa sổ trình duyệt, tức là những gì có trong thẻ ... sẽ được hiển thị cho người dùng khi mở tài liệu HTML. Phần này mô tả thẻ khác nhau và thuộc tính của chúng với những nghĩa khác nhau, điều này đơn giản là không thể thảo luận trong một bài viết, vì vậy tôi khuyên bạn nên sử dụng trang web htmlbook.ru. Trên trang này bạn sẽ tìm thấy tất cả các thẻ HTML và CSS cùng với các ví dụ về cách sử dụng và miêu tả cụ thể mọi người. Tôi cũng khuyên bạn nên xem các khóa học nhỏ miễn phí về xây dựng trang web. Các khóa học này bao gồm các bài học video và cho phép bạn làm quen hơn với việc viết mã.

HTML là ngôn ngữ đánh dấu siêu văn bản đã tạo nên Internet mà chúng ta biết và yêu thích. Nhờ công cụ tuyệt vời này mà các trang web trông đẹp và hiện đại, đồng thời đảm bảo tính dễ sử dụng. HTML chỉ đơn giản là sắp xếp các thành phần của trang web thành định dạng thân thiện với người dùng. Công việc của nó có thể so sánh với những gì mọi người như MS Word hay OpenOffice làm. Họ biến một khối chữ cái vô danh thành một tài liệu chứa các đoạn văn, hình nhỏ, chữ nghiêng, bảng và thậm chí cả hình ảnh. Ngôn ngữ HTML thực hiện điều tương tự, với điểm khác biệt duy nhất là tài liệu của nó được hiển thị trong trình duyệt và khả năng của công cụ này rộng hơn nhiều so với khả năng của trình soạn thảo văn bản. Thẻ được sử dụng để đánh dấu - đội đặc biệt, mô tả cấu trúc của một trang web. Chúng được đặt trong dấu ngoặc nhọn - để trình duyệt có thể phân biệt chúng với phần lớn văn bản. Tiếp theo, chúng tôi sẽ đề cập đến những điều cơ bản về HTML cho người mới bắt đầu.

Trình chỉnh sửa trực quan

Những người mới bắt đầu bước vào con đường học HTML thường bắt đầu công việc của mình với các chương trình cho phép bạn tạo trang web mà không cần bất kỳ kiến thức nào. Trong đó, bạn có thể chỉ cần sắp xếp các thành phần trên màn hình theo cách chúng sẽ được hiển thị trong trình duyệt. Có vẻ như đây là nguồn ân sủng vĩnh cửu cho phép bạn loại bỏ phần lớn các nhà phát triển web. Nhưng không phải mọi thứ đều đơn giản như vậy, vì các trình soạn thảo trực quan có rất nhiều thiếu sót khiến chúng không thể được sử dụng trong các dự án nghiêm túc.

Tất cả các chương trình này tạo ra rất nhiều thẻ không cần thiết khiến trang cuối cùng trở nên khó sử dụng và kém tối ưu. Tất nhiên, ở thời đại chúng ta Internet tốc độ caoĐiều này ít quan trọng hơn trước đây, nhưng có một số lý do tại sao một trang web ngắn gọn và được viết tốt lại thực tế hơn so với trang web được tạo bằng trình chỉnh sửa trực quan. Một trang web được tạo bằng chương trình như vậy sẽ không được xử lý tốt robot tìm kiếm, vì mỗi kilobyte mã đều quan trọng đối với họ, và những mã rườm rà và phi logic với một đống khó có thể phù hợp với sở thích của họ. Ngoài ra, các biên tập viên thường tụt hậu so với thời đại, trở nên không phù hợp và việc dành nguồn lực cho sự phát triển của họ là không thực tế vì không có chuyên gia nào sử dụng các sản phẩm này. Vì vậy, bất kỳ ai muốn làm việc trong ngành phát triển trang web đều phải biết những điều cơ bản về HTML.

Thẻ

Như đã đề cập ở trên, thẻ mô tả cấu trúc của trang web đối với trình duyệt. Hầu hết chúng đều có thẻ mở và đóng, nhưng không phải tất cả. Ví dụ: ..., trong đó thay vì dấu chấm là nội dung. Cái đầu tiên hiển thị nơi thẻ bắt đầu và cái thứ hai đóng nó lại. Có thể có các phần tử đánh dấu trang khác bên trong; chúng có thể được lồng vào nhau giống như một con búp bê lồng vào nhau. Điều quan trọng là phải đóng thẻ kịp thời để trang được hiển thị chính xác.

Ngoài ra còn có các thẻ đơn không cần phải đóng. Trong đó, nội dung được đặt bên trong, giống như nó có thể được viết cho hầu hết các thẻ HTML và đặt các thuộc tính của phần tử. Nó được biểu thị trong thẻ mở và trông giống như thế này: thuộc tính="...", trong đó thay vì dấu chấm có giá trị thuộc tính. Biết thẻ là điều đầu tiên và quan trọng nhất bước quan trọngđể làm chủ HTML. Những điều cơ bản của nghệ thuật này cũng liên quan đến việc hiểu cấu trúc của một trang web.

Cấu trúc tài liệu

Mỗi tài liệu HTML đều có phần mở rộng tương ứng, ví dụ Index.html. Bằng cách này, trình duyệt có thể hiểu nó đang xử lý vấn đề gì và hiển thị trang một cách chính xác. Bạn nên lưu trữ tất cả các tệp được sử dụng để tạo trang web trong một thư mục, điều này sẽ giúp cuộc sống của bạn sau này dễ dàng hơn nhiều. Kiến thức cơ bản về ngôn ngữ đánh dấu siêu văn bản HTML đòi hỏi sự hiểu biết rõ ràng về cấu trúc tài liệu. Nó bắt đầu bằng một thẻ cho trình duyệt biết phiên bản HTML đang được sử dụng trong tài liệu này. Hiện tại, phiên bản thứ năm của ngôn ngữ này có liên quan nên không cần phải phát minh ra bất cứ thứ gì, bạn có thể chèn thẻ trên vào đầu bất kỳ trang nào một cách an toàn.

Sau đó là các cấu trúc được ghép nối chính tạo nên “bộ khung” của trang web. Thẻ đầu tiên, trong đó tất cả các thẻ khác được lồng vào nhau, là .... Bất cứ thứ gì bên ngoài nó đều không được trình duyệt nhận dạng là một trang web, vì vậy nó sẽ mở tài liệu và đóng nó lại. Thẻ này là bắt buộc đối với bất kỳ tài liệu nào. Nó cũng chứa một số thẻ bắt buộc khác, sẽ được thảo luận bên dưới.

Cái đầu

Bên trong thẻ ... chứa thông tin có tính chất kỹ thuật sẽ không được hiển thị trên trang, tuy nhiên phần quan trọng Tài liệu HTML. Nền tảng của trang web được đặt ở nơi này; ở đây mã hóa được chọn và tên trang được nhập. Nó được chứa bên trong thẻ bắt buộc.... Tiêu đề được hiển thị ở đầu trình duyệt, nơi bạn cũng có thể đặt một biểu tượng nhỏ mô tả nội dung của trang. Nên chỉ ra ngay mã hóa của tài liệu để hiển thị chính xác. Điều này có thể được thực hiện bằng cách sử dụng thẻ. Thẻ meta cung cấp thông tin về cấu trúc của trang và thường nằm bên trong phần đầu trang.

liên kết

Biết những điều cơ bản về HTML cũng liên quan đến việc sử dụng kiểu xếp tầng hoặc css. Họ đặt thuộc tính của các thành phần sẽ được hiển thị trên trang. Cách tiếp cận hiện đại nhiệm vụ này liên quan đến việc bao gồm các đặc điểm như màu sắc, chiều cao và vị trí của phần tử, trong tập tin bên ngoàiđể thuận tiện hơn. Để bao gồm tệp css, hãy sử dụng thẻ. Ở dạng hoàn thiện, nó trông giống như thế này: trong đó href cho biết vị trí của tệp và type cho biết loại của nó.

Thân hình

Phần hiển thị của trang được tạo trong phần này của tài liệu HTML. Mọi thứ được thực hiện bên trong "nội dung" sẽ được trình duyệt hiển thị. Một lượng lớn được sử dụng Thẻ HTML. Những điều cơ bản là định dạng văn bản, làm việc với các liên kết và các công cụ cơ bản để cấu trúc một trang web. Để bắt đầu làm việc với HTML, bạn chỉ cần biết các thẻ cơ bản và có thể sử dụng chúng. Dưới đây là những cái phổ biến nhất: