{"id":84,"date":"2025-08-16T11:21:30","date_gmt":"2025-08-16T04:21:30","guid":{"rendered":"https:\/\/solio.online\/blog\/?p=84"},"modified":"2025-11-20T14:39:38","modified_gmt":"2025-11-20T07:39:38","slug":"cac-diem-moi-trong-html5-va-css3","status":"publish","type":"post","link":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/","title":{"rendered":"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>1. Gi\u1edbi thi\u1ec7u<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">HTML5 v\u00e0 CSS3 l\u00e0 b\u01b0\u1edbc ti\u1ebfn quan tr\u1ecdng trong c\u00f4ng ngh\u1ec7 web, mang l\u1ea1i nhi\u1ec1u t\u00ednh n\u0103ng m\u1edbi gi\u00fap website <strong>nhanh h\u01a1n, nh\u1eb9 h\u01a1n, t\u01b0\u01a1ng t\u00e1c t\u1ed1t h\u01a1n<\/strong> v\u00e0 <strong>t\u01b0\u01a1ng th\u00edch \u0111a n\u1ec1n t\u1ea3ng<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">HTML5 t\u1eadp trung v\u00e0o c\u1ea5u tr\u00fac v\u00e0 ng\u1eef ngh\u0129a n\u1ed9i dung, trong khi CSS3 m\u1edf r\u1ed9ng kh\u1ea3 n\u0103ng tr\u00ecnh b\u00e0y v\u00e0 hi\u1ec7u \u1ee9ng tr\u1ef1c quan.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>2. C\u00e1c \u0111i\u1ec3m m\u1edbi trong HTML5<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>2.1. Th\u1ebb ng\u1eef ngh\u0129a m\u1edbi (Semantic Elements)<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">HTML5 gi\u1edbi thi\u1ec7u nhi\u1ec1u th\u1ebb m\u1edbi gi\u00fap n\u1ed9i dung d\u1ec5 hi\u1ec3u h\u01a1n cho c\u1ea3 ng\u01b0\u1eddi v\u00e0 m\u00e1y t\u00ecm ki\u1ebfm:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 &lt;header&gt; \u2013 Ph\u1ea7n \u0111\u1ea7u trang ho\u1eb7c kh\u1ed1i n\u1ed9i dung.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 &lt;nav&gt; \u2013 Khu v\u1ef1c ch\u1ee9a menu \u0111i\u1ec1u h\u01b0\u1edbng.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 &lt;section&gt; \u2013 M\u1ed9t ph\u1ea7n n\u1ed9i dung ri\u00eang bi\u1ec7t.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 &lt;article&gt; \u2013 N\u1ed9i dung \u0111\u1ed9c l\u1eadp, c\u00f3 th\u1ec3 t\u00e1i s\u1eed d\u1ee5ng.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 &lt;aside&gt; \u2013 N\u1ed9i dung li\u00ean quan ho\u1eb7c qu\u1ea3ng c\u00e1o b\u00ean l\u1ec1.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 &lt;footer&gt; \u2013 Ch\u00e2n trang ho\u1eb7c ph\u1ea7n k\u1ebft th\u00fac n\u1ed9i dung.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\ud83d\udca1 <strong>L\u1ee3i \u00edch:<\/strong> Gi\u00fap SEO t\u1ed1t h\u01a1n, m\u00e3 HTML g\u1ecdn g\u00e0ng v\u00e0 d\u1ec5 b\u1ea3o tr\u00ec.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>2.2. H\u1ed7 tr\u1ee3 \u0111a ph\u01b0\u01a1ng ti\u1ec7n (Multimedia Support)<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">HTML5 h\u1ed7 tr\u1ee3 nh\u00fang \u00e2m thanh v\u00e0 video m\u00e0 kh\u00f4ng c\u1ea7n plugin:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 &lt;audio&gt; \u2013 Ph\u00e1t nh\u1ea1c ho\u1eb7c \u00e2m thanh.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 &lt;video&gt; \u2013 Ph\u00e1t video tr\u1ef1c ti\u1ebfp.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 H\u1ed7 tr\u1ee3 nhi\u1ec1u \u0111\u1ecbnh d\u1ea1ng nh\u01b0 MP4, WebM, Ogg.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">V\u00ed d\u1ee5:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">&lt;video controls&gt;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">&nbsp; &lt;source src=&#8221;video.mp4&#8243; type=&#8221;video\/mp4&#8243;&gt;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">&lt;\/video&gt;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>2.3. Form n\u00e2ng cao<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">HTML5 b\u1ed5 sung nhi\u1ec1u lo\u1ea1i input m\u1edbi:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 email, tel, url \u2013 T\u1ef1 \u0111\u1ed9ng ki\u1ec3m tra \u0111\u1ecbnh d\u1ea1ng.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 date, time, month, week \u2013 Ch\u1ecdn ng\u00e0y\/gi\u1edd.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 range \u2013 Thanh k\u00e9o ch\u1ecdn gi\u00e1 tr\u1ecb.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 color \u2013 Ch\u1ecdn m\u00e0u.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 Thu\u1ed9c t\u00ednh m\u1edbi: placeholder, required, pattern.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>2.4. API m\u1edbi v\u00e0 c\u1ea3i ti\u1ebfn<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Canvas API<\/strong>: V\u1ebd \u0111\u1ed3 h\u1ecda 2D, game, bi\u1ec3u \u0111\u1ed3.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>SVG<\/strong>: H\u1ed7 tr\u1ee3 \u0111\u1ed3 h\u1ecda vector.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Geolocation API<\/strong>: X\u00e1c \u0111\u1ecbnh v\u1ecb tr\u00ed ng\u01b0\u1eddi d\u00f9ng.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>LocalStorage &amp; SessionStorage<\/strong>: L\u01b0u tr\u1eef d\u1eef li\u1ec7u tr\u00ean tr\u00ecnh duy\u1ec7t kh\u00f4ng c\u1ea7n cookie.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Drag and Drop API<\/strong>: K\u00e9o th\u1ea3 ph\u1ea7n t\u1eed d\u1ec5 d\u00e0ng.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3. C\u00e1c \u0111i\u1ec3m m\u1edbi trong CSS3<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3.1. Chia module v\u00e0 t\u00ednh n\u0103ng m\u1edbi<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">CSS3 \u0111\u01b0\u1ee3c chia th\u00e0nh nhi\u1ec1u module, m\u1ed7i module ph\u00e1t tri\u1ec3n \u0111\u1ed9c l\u1eadp, v\u00ed d\u1ee5:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 Selectors<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 Backgrounds &amp; Borders<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 Transforms<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 Animations<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 Flexbox, Grid<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3.2. Hi\u1ec7u \u1ee9ng n\u1ec1n v\u00e0 vi\u1ec1n<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Multiple backgrounds<\/strong>: D\u00f9ng nhi\u1ec1u \u1ea3nh n\u1ec1n c\u00f9ng l\u00fac.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Border-radius<\/strong>: Bo tr\u00f2n g\u00f3c.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Box-shadow &amp; text-shadow<\/strong>: \u0110\u1ed5 b\u00f3ng cho h\u1ed9p v\u00e0 ch\u1eef.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Border-image<\/strong>: S\u1eed d\u1ee5ng \u1ea3nh l\u00e0m vi\u1ec1n.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3.3. Font v\u00e0 ch\u1eef<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>@font-face<\/strong>: S\u1eed d\u1ee5ng font t\u00f9y ch\u1ec9nh m\u00e0 kh\u00f4ng ph\u1ee5 thu\u1ed9c font c\u00e0i s\u1eb5n.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 H\u1ed7 tr\u1ee3 nhi\u1ec1u hi\u1ec7u \u1ee9ng ch\u1eef m\u1edbi, \u0111\u1ed5 b\u00f3ng, t\u00f4 m\u00e0u gradient.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3.4. Gradient<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">CSS3 h\u1ed7 tr\u1ee3:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 Linear gradient (m\u00e0u chuy\u1ec3n tuy\u1ebfn t\u00ednh).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 Radial gradient (m\u00e0u chuy\u1ec3n h\u00ecnh tr\u00f2n).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">V\u00ed d\u1ee5:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">background: linear-gradient(to right, red, yellow);<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3.5. Responsive Design<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Media Queries<\/strong>: Thay \u0111\u1ed5i CSS t\u00f9y k\u00edch th\u01b0\u1edbc m\u00e0n h\u00ecnh.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 H\u1ed7 tr\u1ee3 thi\u1ebft k\u1ebf web cho di \u0111\u1ed9ng, tablet, PC.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">@media (max-width: 768px) {<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">&nbsp; body {<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">&nbsp; &nbsp; background: lightblue;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">&nbsp; }<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">}<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3.6. Hi\u1ec7u \u1ee9ng chuy\u1ec3n \u0111\u1ed9ng<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Transition<\/strong>: Chuy\u1ec3n \u0111\u1ed5i m\u01b0\u1ee3t gi\u1eefa c\u00e1c tr\u1ea1ng th\u00e1i.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Transform<\/strong>: Xoay, ph\u00f3ng to\/thu nh\u1ecf, nghi\u00eang ph\u1ea7n t\u1eed.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Animation<\/strong>: T\u1ea1o chuy\u1ec3n \u0111\u1ed9ng ph\u1ee9c t\u1ea1p v\u1edbi @keyframes.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">V\u00ed d\u1ee5:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">div {<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">&nbsp; transition: all 0.3s ease;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">}<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>3.7. Flexbox &amp; CSS Grid<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Flexbox<\/strong>: B\u1ed1 c\u1ee5c linh ho\u1ea1t, d\u1ec5 c\u0103n ch\u1ec9nh theo h\u00e0ng\/c\u1ed9t.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Grid<\/strong>: T\u1ea1o l\u01b0\u1edbi b\u1ed1 c\u1ee5c 2 chi\u1ec1u m\u1ea1nh m\u1ebd.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>4. L\u1ee3i \u00edch khi s\u1eed d\u1ee5ng HTML5 &amp; CSS3<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>T\u1ed1c \u0111\u1ed9 t\u1ea3i nhanh h\u01a1n<\/strong> do gi\u1ea3m ph\u1ee5 thu\u1ed9c plugin.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>SEO t\u1ed1i \u01b0u h\u01a1n<\/strong> nh\u1edd th\u1ebb ng\u1eef ngh\u0129a.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>Tr\u1ea3i nghi\u1ec7m ng\u01b0\u1eddi d\u00f9ng t\u1ed1t h\u01a1n<\/strong> v\u1edbi giao di\u1ec7n \u0111\u1eb9p, m\u01b0\u1ee3t.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2022 <strong>D\u1ec5 m\u1edf r\u1ed9ng<\/strong> v\u00e0 h\u1ed7 tr\u1ee3 thi\u1ebft b\u1ecb di \u0111\u1ed9ng.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u2e3b<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>5. K\u1ebft lu\u1eadn<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">HTML5 v\u00e0 CSS3 kh\u00f4ng ch\u1ec9 l\u00e0 b\u1ea3n n\u00e2ng c\u1ea5p m\u00e0 c\u00f2n m\u1edf ra m\u1ed9t k\u1ef7 nguy\u00ean m\u1edbi cho thi\u1ebft k\u1ebf web.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">N\u1ebfu b\u1ea1n mu\u1ed1n website <strong>nh\u1eb9, nhanh, chu\u1ea9n SEO, \u0111\u1eb9p m\u1eaft v\u00e0 hi\u1ec7n \u0111\u1ea1i<\/strong>, vi\u1ec7c n\u1eafm v\u1eefng HTML5 &amp; CSS3 l\u00e0 \u0111i\u1ec1u b\u1eaft bu\u1ed9c.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>1. Gi\u1edbi thi\u1ec7u HTML5 v\u00e0 CSS3 l\u00e0 b\u01b0\u1edbc ti\u1ebfn quan tr\u1ecdng trong c\u00f4ng ngh\u1ec7 web, mang l\u1ea1i nhi\u1ec1u t\u00ednh n\u0103ng m\u1edbi gi\u00fap website nhanh h\u01a1n, nh\u1eb9 h\u01a1n, t\u01b0\u01a1ng t\u00e1c t\u1ed1t h\u01a1n v\u00e0 t\u01b0\u01a1ng th\u00edch \u0111a n\u1ec1n t\u1ea3ng. HTML5 t\u1eadp trung v\u00e0o c\u1ea5u tr\u00fac v\u00e0 ng\u1eef ngh\u0129a n\u1ed9i dung, trong khi CSS3 m\u1edf r\u1ed9ng kh\u1ea3 n\u0103ng [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[32],"tags":[],"class_list":["post-84","post","type-post","status-publish","format-standard","hentry","category-thu-vien-lap-trinh"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3 - Solio.online Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/\" \/>\n<meta property=\"og:locale\" content=\"vi_VN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3 - Solio.online Blog\" \/>\n<meta property=\"og:description\" content=\"1. Gi\u1edbi thi\u1ec7u HTML5 v\u00e0 CSS3 l\u00e0 b\u01b0\u1edbc ti\u1ebfn quan tr\u1ecdng trong c\u00f4ng ngh\u1ec7 web, mang l\u1ea1i nhi\u1ec1u t\u00ednh n\u0103ng m\u1edbi gi\u00fap website nhanh h\u01a1n, nh\u1eb9 h\u01a1n, t\u01b0\u01a1ng t\u00e1c t\u1ed1t h\u01a1n v\u00e0 t\u01b0\u01a1ng th\u00edch \u0111a n\u1ec1n t\u1ea3ng. HTML5 t\u1eadp trung v\u00e0o c\u1ea5u tr\u00fac v\u00e0 ng\u1eef ngh\u0129a n\u1ed9i dung, trong khi CSS3 m\u1edf r\u1ed9ng kh\u1ea3 n\u0103ng [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/\" \/>\n<meta property=\"og:site_name\" content=\"Solio.online Blog\" \/>\n<meta property=\"article:published_time\" content=\"2025-08-16T04:21:30+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-11-20T07:39:38+00:00\" \/>\n<meta name=\"author\" content=\"Trung Vu\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi\" \/>\n\t<meta name=\"twitter:data1\" content=\"Trung Vu\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 ph\u00fat\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/cac-diem-moi-trong-html5-va-css3\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/cac-diem-moi-trong-html5-va-css3\\\/\"},\"author\":{\"name\":\"Trung Vu\",\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/#\\\/schema\\\/person\\\/287c2155cd174f2a66574cea8e892d5b\"},\"headline\":\"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3\",\"datePublished\":\"2025-08-16T04:21:30+00:00\",\"dateModified\":\"2025-11-20T07:39:38+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/cac-diem-moi-trong-html5-va-css3\\\/\"},\"wordCount\":886,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/#organization\"},\"articleSection\":[\"Th\u01b0 vi\u1ec7n l\u1eadp tr\u00ecnh\"],\"inLanguage\":\"vi\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/solio.online\\\/blog\\\/cac-diem-moi-trong-html5-va-css3\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/cac-diem-moi-trong-html5-va-css3\\\/\",\"url\":\"https:\\\/\\\/solio.online\\\/blog\\\/cac-diem-moi-trong-html5-va-css3\\\/\",\"name\":\"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3 - Solio.online Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/#website\"},\"datePublished\":\"2025-08-16T04:21:30+00:00\",\"dateModified\":\"2025-11-20T07:39:38+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/cac-diem-moi-trong-html5-va-css3\\\/#breadcrumb\"},\"inLanguage\":\"vi\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/solio.online\\\/blog\\\/cac-diem-moi-trong-html5-va-css3\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/cac-diem-moi-trong-html5-va-css3\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Trang ch\u1ee7\",\"item\":\"https:\\\/\\\/solio.online\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/solio.online\\\/blog\\\/\",\"name\":\"Solio.online Blog\",\"description\":\"Tin T\u1ee9c C\u00f4ng Ngh\u1ec7, AI, L\u1eadp Tr\u00ecnh V\u00e0 Chuy\u1ec3n \u0110\u1ed5i S\u1ed1\",\"publisher\":{\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/solio.online\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"vi\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/#organization\",\"name\":\"Solio.online Blog\",\"url\":\"https:\\\/\\\/solio.online\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"vi\",\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/solio.online\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/cropped-IMG_1491-1.jpeg\",\"contentUrl\":\"https:\\\/\\\/solio.online\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/04\\\/cropped-IMG_1491-1.jpeg\",\"width\":512,\"height\":512,\"caption\":\"Solio.online Blog\"},\"image\":{\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/solio.online\\\/blog\\\/#\\\/schema\\\/person\\\/287c2155cd174f2a66574cea8e892d5b\",\"name\":\"Trung Vu\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"vi\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/7ab312adb447119821df167fd8c5a8d24f73e24ca0d0070ec4ac3adbda06154d?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/7ab312adb447119821df167fd8c5a8d24f73e24ca0d0070ec4ac3adbda06154d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/7ab312adb447119821df167fd8c5a8d24f73e24ca0d0070ec4ac3adbda06154d?s=96&d=mm&r=g\",\"caption\":\"Trung Vu\"},\"sameAs\":[\"https:\\\/\\\/solio.online\\\/blog\"],\"url\":\"https:\\\/\\\/solio.online\\\/blog\\\/author\\\/solio_admin\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3 - Solio.online Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3 - Solio.online Blog","og_description":"1. Gi\u1edbi thi\u1ec7u HTML5 v\u00e0 CSS3 l\u00e0 b\u01b0\u1edbc ti\u1ebfn quan tr\u1ecdng trong c\u00f4ng ngh\u1ec7 web, mang l\u1ea1i nhi\u1ec1u t\u00ednh n\u0103ng m\u1edbi gi\u00fap website nhanh h\u01a1n, nh\u1eb9 h\u01a1n, t\u01b0\u01a1ng t\u00e1c t\u1ed1t h\u01a1n v\u00e0 t\u01b0\u01a1ng th\u00edch \u0111a n\u1ec1n t\u1ea3ng. HTML5 t\u1eadp trung v\u00e0o c\u1ea5u tr\u00fac v\u00e0 ng\u1eef ngh\u0129a n\u1ed9i dung, trong khi CSS3 m\u1edf r\u1ed9ng kh\u1ea3 n\u0103ng [&hellip;]","og_url":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/","og_site_name":"Solio.online Blog","article_published_time":"2025-08-16T04:21:30+00:00","article_modified_time":"2025-11-20T07:39:38+00:00","author":"Trung Vu","twitter_card":"summary_large_image","twitter_misc":{"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi":"Trung Vu","\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc":"4 ph\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/#article","isPartOf":{"@id":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/"},"author":{"name":"Trung Vu","@id":"https:\/\/solio.online\/blog\/#\/schema\/person\/287c2155cd174f2a66574cea8e892d5b"},"headline":"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3","datePublished":"2025-08-16T04:21:30+00:00","dateModified":"2025-11-20T07:39:38+00:00","mainEntityOfPage":{"@id":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/"},"wordCount":886,"commentCount":0,"publisher":{"@id":"https:\/\/solio.online\/blog\/#organization"},"articleSection":["Th\u01b0 vi\u1ec7n l\u1eadp tr\u00ecnh"],"inLanguage":"vi","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/","url":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/","name":"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3 - Solio.online Blog","isPartOf":{"@id":"https:\/\/solio.online\/blog\/#website"},"datePublished":"2025-08-16T04:21:30+00:00","dateModified":"2025-11-20T07:39:38+00:00","breadcrumb":{"@id":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/solio.online\/blog\/cac-diem-moi-trong-html5-va-css3\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Trang ch\u1ee7","item":"https:\/\/solio.online\/blog\/"},{"@type":"ListItem","position":2,"name":"C\u00e1c \u0110i\u1ec3m M\u1edbi Trong HTML5 v\u00e0 CSS3"}]},{"@type":"WebSite","@id":"https:\/\/solio.online\/blog\/#website","url":"https:\/\/solio.online\/blog\/","name":"Solio.online Blog","description":"Tin T\u1ee9c C\u00f4ng Ngh\u1ec7, AI, L\u1eadp Tr\u00ecnh V\u00e0 Chuy\u1ec3n \u0110\u1ed5i S\u1ed1","publisher":{"@id":"https:\/\/solio.online\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/solio.online\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"vi"},{"@type":"Organization","@id":"https:\/\/solio.online\/blog\/#organization","name":"Solio.online Blog","url":"https:\/\/solio.online\/blog\/","logo":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/solio.online\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/solio.online\/blog\/wp-content\/uploads\/2026\/04\/cropped-IMG_1491-1.jpeg","contentUrl":"https:\/\/solio.online\/blog\/wp-content\/uploads\/2026\/04\/cropped-IMG_1491-1.jpeg","width":512,"height":512,"caption":"Solio.online Blog"},"image":{"@id":"https:\/\/solio.online\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/solio.online\/blog\/#\/schema\/person\/287c2155cd174f2a66574cea8e892d5b","name":"Trung Vu","image":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/secure.gravatar.com\/avatar\/7ab312adb447119821df167fd8c5a8d24f73e24ca0d0070ec4ac3adbda06154d?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/7ab312adb447119821df167fd8c5a8d24f73e24ca0d0070ec4ac3adbda06154d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7ab312adb447119821df167fd8c5a8d24f73e24ca0d0070ec4ac3adbda06154d?s=96&d=mm&r=g","caption":"Trung Vu"},"sameAs":["https:\/\/solio.online\/blog"],"url":"https:\/\/solio.online\/blog\/author\/solio_admin\/"}]}},"_links":{"self":[{"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/posts\/84","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/comments?post=84"}],"version-history":[{"count":1,"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/posts\/84\/revisions"}],"predecessor-version":[{"id":85,"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/posts\/84\/revisions\/85"}],"wp:attachment":[{"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/media?parent=84"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/categories?post=84"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/solio.online\/blog\/wp-json\/wp\/v2\/tags?post=84"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}