{"id":1522,"date":"2019-10-29T21:42:15","date_gmt":"2019-10-29T14:42:15","guid":{"rendered":"https:\/\/webvocuc.com\/blog\/?p=1522"},"modified":"2021-08-16T10:59:22","modified_gmt":"2021-08-16T03:59:22","slug":"html-la-gi-uu-va-nhuoc-diem-cua-html","status":"publish","type":"post","link":"https:\/\/webvocuc.com\/blog\/html-la-gi-uu-va-nhuoc-diem-cua-html.html","title":{"rendered":"Html l\u00e0 g\u00ec? \u01afu v\u00e0 nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a html"},"content":{"rendered":"

HTML l\u00e0 g\u00ec<\/a>? <\/strong>HTML ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? \u01afu \u0111i\u1ec3m v\u00e0 nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a HTML? T\u00ecm hi\u1ec3u d\u01b0\u1edbi b\u00e0i vi\u1ebft d\u01b0\u1edbi \u0111\u00e2y c\u00f9ng Webvocuc.<\/p>\n

HTML l\u00e0 g\u00ec?<\/h2>\n

\"html<\/p>\n

HTML l\u00e0 ch\u1eef vi\u1ebft t\u1eaft c\u1ee7a Hypertext Markup Language<\/strong>. N\u00f3 gi\u00fap ng\u01b0\u1eddi d\u00f9ng t\u1ea1o v\u00e0 c\u1ea5u tr\u00fac c\u00e1c th\u00e0nh ph\u1ea7n trong trang web ho\u1eb7c \u1ee9ng d\u1ee5ng, ph\u00e2n chia c\u00e1c \u0111o\u1ea1n v\u0103n, heading, links, blockquotes.<\/p>\n

HTML kh\u00f4ng ph\u1ea3i l\u00e0 ng\u00f4n ng\u1eef l\u1eadp tr\u00ecnh, \u0111\u1ed3ng ngh\u0129a v\u1edbi vi\u1ec7c n\u00f3 kh\u00f4ng th\u1ec3 t\u1ea1o ra c\u00e1c ch\u1ee9c n\u0103ng \u201c\u0111\u1ed9ng\u201d \u0111\u01b0\u1ee3c. N\u00f3 ch\u1ec9 gi\u1ed1ng nh\u01b0 Microsoft Word, d\u00f9ng \u0111\u1ec3 b\u1ed1 c\u1ee5c v\u00e0 \u0111\u1ecbnh d\u1ea1ng trang web.<\/p>\n

Khi l\u00e0m vi\u1ec7c v\u1edbi HTML, ch\u00fang ta s\u1ebd s\u1eed d\u1ee5ng c\u1ea5u tr\u00fac code \u0111\u01a1n gi\u1ea3n (tags v\u00e0 attributes) \u0111\u1ec3 \u0111\u00e1nh d\u1ea5u l\u00ean trang web. V\u00ed d\u1ee5, ch\u00fang ta c\u00f3 th\u1ec3 t\u1ea1o m\u1ed9t \u0111o\u1ea1n v\u0103n b\u1eb1ng c\u00e1ch \u0111\u1eb7t v\u0103n b\u1ea3n v\u00e0o trong c\u1eb7p tag m\u1edf v\u00e0 \u0111\u00f3ng v\u0103n b\u1ea3n <p> v\u00e0 <\/p>.<\/p>\n

<p>\u0110\u00e2y l\u00e0 c\u00e1ch b\u1ea1n th\u00eam \u0111o\u1ea1n v\u0103n trong HTML.<\/p><\/p>\n

<p>B\u1ea1n c\u00f3 th\u1ec3 th\u00eam nhi\u1ec1u \u0111o\u1ea1n v\u0103n!<\/p><\/p>\n

T\u1ed5ng quan, HTML l\u00e0 g\u00ec? HTML l\u00e0 ng\u00f4n ng\u1eef markup. N\u00f3 r\u1ea5t tr\u1ef1c ti\u1ebfp d\u1ec5 hi\u1ec3u, d\u1ec5 h\u1ecdc, v\u00e0 t\u1ea5t c\u1ea3 m\u1ecdi ng\u01b0\u1eddi m\u1edbi \u0111\u1ec1u c\u00f3 th\u1ec3 b\u1eaft \u0111\u1ea7u h\u1ecdc n\u00f3 \u0111\u1ec3 x\u00e2y d\u1ef1ng website<\/a>.<\/p>\n

HTML ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o?<\/h2>\n

\"html<\/p>\n

HTML documents l\u00e0 files k\u1ebft th\u00fac v\u1edbi \u0111u\u00f4i .html hay .htm. B\u1ea1n c\u00f3 th\u1ec3 xem ch\u00fang b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng b\u1ea5t k\u1ef3 tr\u00ecnh duy\u1ec7t web n\u00e0o (nh\u01b0 Google Chrome<\/a>, Safari, hay Mozilla Firefox). Tr\u00ecnh duy\u1ec7t \u0111\u1ecdc c\u00e1c files HTML n\u00e0y v\u00e0 xu\u1ea5t b\u1ea3n n\u1ed9i dung l\u00ean internet sao cho ng\u01b0\u1eddi \u0111\u1ecdc c\u00f3 th\u1ec3 xem \u0111\u01b0\u1ee3c n\u00f3.<\/p>\n

Th\u00f4ng th\u01b0\u1eddng, trung b\u00ecnh m\u1ed9t web ch\u1ee9a nhi\u1ec1u trang web HTML. V\u00ed d\u1ee5 nh\u01b0: trang ch\u1ee7, trang about, trang li\u00ean h\u1ec7, t\u1ea5t c\u1ea3 \u0111\u1ec1u c\u1ea7n c\u00e1c trang HTML ri\u00eang.<\/p>\n

M\u1ed7i trang HTML ch\u1ee9a m\u1ed9t b\u1ed9 c\u00e1c tag (c\u0169ng \u0111\u01b0\u1ee3c g\u1ecdi l\u00e0 elements), b\u1ea1n c\u00f3 th\u1ec3 xem nh\u01b0 l\u00e0 vi\u1ec7c x\u00e2y d\u1ef1ng t\u1eebng kh\u1ed1i c\u1ee7a m\u1ed9t trang web. N\u00f3 t\u1ea1o th\u00e0nh c\u1ea5u tr\u00fac c\u00e2y th\u01b0 m\u1ee5c bao g\u1ed3m section, paragraph, heading, v\u00e0 nh\u1eefng kh\u1ed1i n\u1ed9i dung kh\u00e1c.<\/p>\n

H\u1ea7u h\u1ebft c\u00e1c HTML elements \u0111\u1ec1u c\u00f3 tag m\u1edf v\u00e0 tag \u0111\u00f3ng v\u1edbi c\u1ea5u tr\u00fac nh\u01b0 <tag><\/tag>.<\/p>\n

HTML tags c\u00f3 2 lo\u1ea1i ch\u00ednh: block-level v\u00e0 inline tags.<\/p>\n

Block-level<\/h3>\n

Elements Block-level s\u1ebd s\u1eed d\u1ee5ng to\u00e0n kh\u00f4ng gian trang web v\u00e0 lu\u00f4n b\u1eaft \u0111\u1ea7u d\u00f2ng m\u1edbi c\u1ee7a trang web. Headings v\u00e0 paragraph l\u00e0 nh\u1eefng v\u00ed d\u1ee5 ch\u00ednh c\u1ee7a block tags.<\/p>\n

Inline elements ch\u1ec9 chi\u1ebfm ph\u1ea7n nh\u1ecf kh\u00f4ng gian web v\u00e0 kh\u00f4ng b\u1eaft \u0111\u1ea7u d\u00f2ng m\u1edbi c\u1ee7a trang web. Ch\u00fang th\u01b0\u1eddng d\u00f9ng \u0111\u1ec3 \u0111\u1ecbnh d\u1ea1ng n\u1ed9i dung b\u00ean trong c\u1ee7a block level elements, links v\u00e0 nh\u1eefng tag nh\u1ea5n m\u1ea1nh l\u00e0 nh\u1eefng tag inlines ph\u1ed5 bi\u1ebfn.<\/p>\n

C\u00f3 t\u1ea5t c\u1ea3 6 c\u1ea5p \u0111\u1ed9 trong HMTL, tr\u1ea3i d\u00e0i t\u1eeb <h1><\/h1> t\u1edbi <h6><\/h6>. h1 l\u00e0 c\u1ea5p heading cao nh\u1ea5t v\u00e0 h6 l\u00e0 th\u1ea5p nh\u1ea5t. V\u0103n b\u1ea3n \u0111\u01b0\u1ee3c \u0111\u1eb7t trong tag <p><\/p>, nh\u01b0ng blockquotes th\u00ec s\u1eed d\u1ee5ng<blockquote><\/blockquote>.<\/p>\n

Divisions l\u00e0 nh\u1eefng khu v\u1ef1c l\u1edbn, ch\u1ee9a nhi\u1ec1u paragraph, images, blockquotes, v\u00e0 c\u00e1c y\u1ebfu t\u1ed1 kh\u00e1c. Ch\u00fang ta c\u00f3 th\u1ec3 \u0111\u00e1nh d\u1ea5u ch\u00fang b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng <div><\/div>. Div element c\u0169ng c\u00f3 th\u1ec3 ch\u1ee9a div tag kh\u00e1c b\u00ean trong n\u00f3.<\/p>\n

B\u1ea1n c\u0169ng c\u00f3 th\u1ec3 d\u00f9ng tag <ol><\/ol> cho danh s\u00e1ch theo th\u1ee9 t\u1ef1 v\u00e0 <ul><\/ul> cho danh s\u00e1ch kh\u00f4ng theo th\u1ee9 t\u1ef1. Danh s\u00e1ch c\u1ea7n \u0111\u01b0\u1ee3c \u0111\u01b0\u1ee3c \u0111\u1eb7t trong tag <li><\/li>.<\/p>\n

Inline Tags<\/h3>\n

C\u00f3 nhi\u1ec1u inline tags \u0111\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 \u0111\u1ecbnh d\u1ea1ng v\u0103n b\u1ea3n. V\u00ed d\u1ee5 nh\u01b0, tag <strong><\/strong> s\u1ebd \u0111\u1ecbnh d\u1ea1ng ch\u1eef in \u0111\u1eadm, trong khi \u0111\u00f3 tag <em><\/em> s\u1ebd \u0111\u1ecbnh d\u1ea1ng ch\u1eef in nghi\u00eang.<\/p>\n

\u1ea2nh c\u0169ng l\u00e0 element inline. B\u1ea1n c\u00f3 th\u1ec3 th\u00eam \u1ea3nh b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng tag <img> m\u00e0 kh\u00f4ng c\u1ea7n tag \u0111\u00f3ng, nh\u01b0ng b\u1ea1n c\u0169ng c\u1ea7n s\u1eed d\u1ee5ng attribute src \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh ngu\u1ed3n \u1ea3nh.<\/p>\n

N\u1ebfu b\u1ea1n mu\u1ed1n t\u00ecm hi\u1ec3u th\u00eam v\u1ec1 tag HTML, h\u00e3y c\u00e2n nh\u1eafc xem qua cheat sheet HTML c\u1ee7a ch\u00fang t\u00f4i (c\u00f3 th\u1ec3 download \u0111\u01b0\u1ee3c file cheat sheet).<\/p>\n

\u01afu \u0111i\u1ec3m v\u00e0 nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a HTML l\u00e0 g\u00ec?<\/h2>\n

\"html<\/p>\n

\u01afu \u0111i\u1ec3m c\u1ee7a HTML l\u00e0 g\u00ec?<\/h3>\n
    \n
  • Ng\u00f4n ng\u1eef \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng r\u1ed9ng l\u1edbn n\u00e0y c\u00f3 r\u1ea5t nhi\u1ec1u ngu\u1ed3n t\u00e0i nguy\u00ean h\u1ed7 tr\u1ee3 v\u00e0 c\u1ed9ng \u0111\u1ed3ng s\u1eed d\u1ee5ng c\u1ef1c l\u1edbn.<\/li>\n
  • S\u1eed d\u1ee5ng m\u01b0\u1ee3t m\u00e0 tr\u00ean h\u1ea7u h\u1ebft m\u1ecdi tr\u00ecnh duy\u1ec7t.<\/li>\n
  • C\u00f3 qu\u00e1 tr\u00ecnh h\u1ecdc \u0111\u01a1n gi\u1ea3n v\u00e0 tr\u1ef1c ti\u1ebfp.<\/li>\n
  • M\u00e3 ngu\u1ed3n m\u1edf v\u00e0 ho\u00e0n to\u00e0n mi\u1ec5n ph\u00ed.<\/li>\n
  • Markup g\u1ecdn g\u00e0ng v\u00e0 \u0111\u1ed3ng nh\u1ea5t.<\/li>\n
  • Chu\u1ea9n ch\u00ednh c\u1ee7a web \u0111\u01b0\u1ee3c v\u1eadn h\u00e0nh b\u1edfi World Wide Web Consortium (W3C).<\/li>\n
  • D\u1ec5 d\u00e0ng t\u00edch h\u1ee3p v\u1edbi c\u00e1c ng\u00f4n ng\u1eef backend nh\u01b0 PHP v\u00e0 Node.js.<\/li>\n<\/ul>\n

    Khuy\u1ebft \u0111i\u1ec3m c\u1ee7a HTML l\u00e0 g\u00ec?<\/h3>\n
      \n
    • \u0110\u01b0\u1ee3c d\u00f9ng ch\u1ee7 y\u1ebfu cho web t\u0129nh. \u0110\u1ed1i v\u1edbi c\u00e1c t\u00ednh n\u0103ng \u0111\u1ed9ng, b\u1ea1n c\u1ea7n s\u1eed d\u1ee5ng JavaScript ho\u1eb7c ng\u00f4n ng\u1eef backend b\u00ean th\u1ee9 3 nh\u01b0 PHP.<\/li>\n
    • N\u00f3 c\u00f3 th\u1ec3 th\u1ef1c thi m\u1ed9t s\u1ed1 logic nh\u1ea5t \u0111\u1ecbnh cho ng\u01b0\u1eddi d\u00f9ng. V\u00ec v\u1eady, h\u1ea7u h\u1ebft c\u00e1c trang \u0111\u1ec1u c\u1ea7n \u0111\u01b0\u1ee3c t\u1ea1o ri\u00eang bi\u1ec7t, k\u1ec3 c\u1ea3 khi n\u00f3 s\u1eed d\u1ee5ng c\u00f9ng c\u00e1c y\u1ebfu t\u1ed1, nh\u01b0 l\u00e0 headers hay footers.<\/li>\n
    • M\u1ed9t s\u1ed1 tr\u00ecnh duy\u1ec7t ch\u1eadm h\u1ed7 tr\u1ee3 t\u00ednh n\u0103ng m\u1edbi.<\/li>\n
    • Kh\u00f3 ki\u1ec3m so\u00e1t c\u1ea3nh th\u1ef1c thi c\u1ee7a tr\u00ecnh duy\u1ec7t (v\u00ed d\u1ee5: nh\u1eefng tr\u00ecnh duy\u1ec7t c\u0169 kh\u00f4ng render \u0111\u01b0\u1ee3c tag m\u1edbi).<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"

      HTML l\u00e0 g\u00ec? HTML ho\u1ea1t \u0111\u1ed9ng nh\u01b0 th\u1ebf n\u00e0o? \u01afu \u0111i\u1ec3m v\u00e0 nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a HTML? T\u00ecm hi\u1ec3u d\u01b0\u1edbi b\u00e0i vi\u1ebft d\u01b0\u1edbi \u0111\u00e2y c\u00f9ng Webvocuc. HTML l\u00e0 g\u00ec? HTML l\u00e0 ch\u1eef vi\u1ebft t\u1eaft c\u1ee7a Hypertext Markup Language. N\u00f3 gi\u00fap ng\u01b0\u1eddi d\u00f9ng t\u1ea1o v\u00e0 c\u1ea5u tr\u00fac c\u00e1c th\u00e0nh ph\u1ea7n trong trang web ho\u1eb7c \u1ee9ng d\u1ee5ng, ph\u00e2n […]<\/p>\n","protected":false},"author":2,"featured_media":1569,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[8],"tags":[146],"class_list":["post-1522","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-thiet-ke-website","tag-html-la-gi"],"jetpack_featured_media_url":"https:\/\/webvocuc.com\/blog\/wp-content\/uploads\/2020\/10\/html-la-gi-uu-va-nhuoc-diem-cua-html-1_s1yl6w.jpg","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/posts\/1522","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/comments?post=1522"}],"version-history":[{"count":2,"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/posts\/1522\/revisions"}],"predecessor-version":[{"id":3973,"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/posts\/1522\/revisions\/3973"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/media\/1569"}],"wp:attachment":[{"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/media?parent=1522"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/categories?post=1522"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webvocuc.com\/blog\/wp-json\/wp\/v2\/tags?post=1522"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}