{"id":309,"date":"2013-10-26T17:04:00","date_gmt":"2013-10-26T17:04:00","guid":{"rendered":"https:\/\/kiencang.net\/2013\/10\/26\/thuoc-tinh-opacity-trong-css3\/"},"modified":"2013-10-26T17:04:00","modified_gmt":"2013-10-26T17:04:00","slug":"thuoc-tinh-opacity-trong-css3","status":"publish","type":"post","link":"https:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/","title":{"rendered":"Thu\u1ed9c t\u00ednh opacity trong CSS3"},"content":{"rendered":"\n<p>Opacity l\u00e0 thu\u1ed9c t\u00ednh m\u1edbi trong CSS v\u00e0 thu\u1ed9c phi\u00ean b\u1ea3n m\u1edbi nh\u1ea5t c\u1ee7a CSS3, n\u00f3 quy \u0111\u1ecbnh \u0111\u1ed9 trong su\u1ed1t c\u1ee7a h\u00ecnh \u1ea3nh ho\u1eb7c n\u1ec1n m\u00e0u n\u00e0o \u0111\u00f3. <\/p>\n\n\n\n<p>N\u1ebfu t\u1eebng bi\u1ebft Photoshop b\u1ea1n ch\u1eafc kh\u00f4ng l\u1ea1 opacity. B\u1eb1ng CSS3 ch\u00fang ta kh\u00f4ng c\u1ea7n d\u00f9ng ph\u1ea7n m\u1ec1m ch\u1ec9nh s\u1eeda \u1ea3nh n\u00e0o n\u1eefa, c\u00e1c th\u00e0nh ph\u1ea7n s\u1ebd \u0111\u01b0\u1ee3c \u0111i\u1ec1u ch\u1ec9nh \u0111\u1ed9 trong su\u1ed1t t\u00f9y \u00fd. <\/p>\n\n\n\n<p>C\u00f9ng Ki\u1ebfn c\u00e0ng th\u1eed ngay v\u00e0 lu\u00f4n nh\u00e9!<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"400\" height=\"300\" style=\"opacity:0.6;\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2021\/02\/xuc-xac.jpg\" alt=\"\" class=\"wp-image-12316\" srcset=\"https:\/\/kiencang.net\/wp-content\/uploads\/2021\/02\/xuc-xac.jpg 400w, https:\/\/kiencang.net\/wp-content\/uploads\/2021\/02\/xuc-xac-300x225.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/><\/figure><\/div>\n\n\n\n<p>H\u00e3y nh\u00ecn v\u00e0o b\u1ee9c \u1ea3nh tr\u00ean, th\u1ef1c t\u1ebf n\u00f3 n\u00e9t h\u01a1n nh\u01b0ng \u0111\u01b0\u1ee3c l\u00e0m trong su\u1ed1t ch\u1ec9 c\u00f2n 60% so v\u1edbi b\u1ee9c g\u1ed1c, d\u01b0\u1edbi \u0111\u00e2y ch\u00ednh l\u00e0 b\u1ee9c g\u1ed1c:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"400\" height=\"300\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2021\/02\/xuc-xac.jpg\" alt=\"\" class=\"wp-image-12316\" srcset=\"https:\/\/kiencang.net\/wp-content\/uploads\/2021\/02\/xuc-xac.jpg 400w, https:\/\/kiencang.net\/wp-content\/uploads\/2021\/02\/xuc-xac-300x225.jpg 300w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/><\/figure><\/div>\n\n\n\n<p>\u0110o\u1ea1n code \u0111\u1ec3 th\u1ef1c hi\u1ec7n trong su\u1ed1t cho \u1ea3nh l\u00e0:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>img\n{\nopacity:0.6;\nfilter:alpha(opacity=60); \/* Cho IE8 v\u00e0 c\u00e1c phi\u00ean b\u1ea3n c\u0169 h\u01a1n *\/\n}<\/code><\/pre>\n\n\n\n<p class=\"has-luminous-vivid-amber-background-color has-background\">Xem th\u00eam: <a href=\"https:\/\/kiencang.net\/code-bo-tron-anh-voi-css3\/\" target=\"_blank\" rel=\"noreferrer noopener\">code bo tr\u00f2n \u1ea3nh<\/a>.<\/p>\n\n\n\n<p>Ngo\u00e0i ra ch\u00fang ta c\u0169ng c\u00f3 th\u1ec3 l\u00e0m trong su\u1ed1t n\u1ec1n m\u00e0u nh\u01b0 th\u1ebf n\u00e0y:<\/p>\n\n\n\n<div style=\"background: url('http:\/\/1.bp.blogspot.com\/-1f05jEIbmuQ\/UmvzLHg55OI\/AAAAAAAACx0\/e04B247rn2o\/s400\/lam-nen.jpg'); height: 200px; padding: 50px; width: 300px;\">\n<div style=\"background-color: #cccccc; color: blue; filter: alpha(opacity=60); opacity: 0.6; padding: 15px; text-align: justify; width: 250px;\"><b>\u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. \u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. <\/b><\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<p>Theo \u0111\u00f3, b\u1ea1n c\u00f3 m\u1ed9t \u1ea3nh l\u00e0m <a href=\"https:\/\/kiencang.net\/background-trong-css\/\" target=\"_blank\" rel=\"noreferrer noopener\">background<\/a>, th\u1ebb div l\u00e0m n\u1ec1n v\u1edbi m\u00e0u x\u00e1m, v\u00e0 ch\u1eef b\u00ean tr\u00ean, \u0111\u1ec3 n\u1ec1n div kh\u00f4ng l\u00e0m che&nbsp;background&nbsp;\u1ea3nh t\u00f4i l\u00e0m n\u00f3 trong su\u1ed1t \u1edf m\u1ee9c \u0111\u1ed9 n\u00e0o \u0111\u00f3 (n\u1ebfu \u0111\u1ec3 trong su\u1ed1t ho\u00e0n to\u00e0n &#8211; t\u01b0\u01a1ng \u0111\u01b0\u01a1ng v\u1edbi b\u1ecf n\u1ec1n th\u00ec ch\u1eef s\u1ebd kh\u00f3 \u0111\u1ecdc).<\/p>\n\n\n\n<p>Code m\u1eabu:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;div style=\"background: url('images\/bg.jpg'); height: 200px; padding: 50px; width: 300px;\"&gt;\n&lt;div style=\"background-color: #cccccc; color: blue; filter: alpha(opacity=60); opacity: 0.6; padding: 15px; text-align: justify; width: 250px;\"&gt;\n&lt;b&gt;\u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. \u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. \u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. \u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. \u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. \u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. \u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. \u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu. \u0110\u00e2y l\u00e0 \u0111o\u1ea1n v\u0103n b\u1ea3n m\u1eabu.&lt;\/b&gt;\n&lt;\/div&gt;\n&lt;\/div&gt;<\/code><\/pre>\n\n\n\n<p>Ngu\u1ed3n \u1ea3nh minh h\u1ecda: freeimages.co.uk<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Opacity l\u00e0 thu\u1ed9c t\u00ednh m\u1edbi trong CSS v\u00e0 thu\u1ed9c phi\u00ean b\u1ea3n m\u1edbi nh\u1ea5t c\u1ee7a CSS3, n\u00f3 quy \u0111\u1ecbnh \u0111\u1ed9 trong su\u1ed1t c\u1ee7a h\u00ecnh \u1ea3nh ho\u1eb7c n\u1ec1n m\u00e0u n\u00e0o \u0111\u00f3. N\u1ebfu t\u1eebng bi\u1ebft Photoshop b\u1ea1n ch\u1eafc kh\u00f4ng l\u1ea1 opacity. B\u1eb1ng CSS3 ch\u00fang ta kh\u00f4ng c\u1ea7n d\u00f9ng ph\u1ea7n m\u1ec1m ch\u1ec9nh s\u1eeda \u1ea3nh n\u00e0o n\u1eefa, c\u00e1c th\u00e0nh ph\u1ea7n &hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[229],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v21.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Thu\u1ed9c t\u00ednh opacity trong CSS3 &#8226; Ki\u1ebfn c\u00e0ng<\/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:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/\" \/>\n<meta property=\"og:locale\" content=\"vi_VN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Thu\u1ed9c t\u00ednh opacity trong CSS3 &#8226; Ki\u1ebfn c\u00e0ng\" \/>\n<meta property=\"og:description\" content=\"Opacity l\u00e0 thu\u1ed9c t\u00ednh m\u1edbi trong CSS v\u00e0 thu\u1ed9c phi\u00ean b\u1ea3n m\u1edbi nh\u1ea5t c\u1ee7a CSS3, n\u00f3 quy \u0111\u1ecbnh \u0111\u1ed9 trong su\u1ed1t c\u1ee7a h\u00ecnh \u1ea3nh ho\u1eb7c n\u1ec1n m\u00e0u n\u00e0o \u0111\u00f3. N\u1ebfu t\u1eebng bi\u1ebft Photoshop b\u1ea1n ch\u1eafc kh\u00f4ng l\u1ea1 opacity. B\u1eb1ng CSS3 ch\u00fang ta kh\u00f4ng c\u1ea7n d\u00f9ng ph\u1ea7n m\u1ec1m ch\u1ec9nh s\u1eeda \u1ea3nh n\u00e0o n\u1eefa, c\u00e1c th\u00e0nh ph\u1ea7n &hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/\" \/>\n<meta property=\"og:site_name\" content=\"Ki\u1ebfn c\u00e0ng\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/anhducnguyen87\/\" \/>\n<meta property=\"article:published_time\" content=\"2013-10-26T17:04:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kiencang.net\/wp-content\/uploads\/2021\/02\/xuc-xac.jpg\" \/>\n<meta name=\"author\" content=\"Nguy\u1ec5n \u0110\u1ee9c Anh\" \/>\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=\"Nguy\u1ec5n \u0110\u1ee9c Anh\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 ph\u00fat\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Thu\u1ed9c t\u00ednh opacity trong CSS3 &#8226; Ki\u1ebfn c\u00e0ng","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:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/","og_locale":"vi_VN","og_type":"article","og_title":"Thu\u1ed9c t\u00ednh opacity trong CSS3 &#8226; Ki\u1ebfn c\u00e0ng","og_description":"Opacity l\u00e0 thu\u1ed9c t\u00ednh m\u1edbi trong CSS v\u00e0 thu\u1ed9c phi\u00ean b\u1ea3n m\u1edbi nh\u1ea5t c\u1ee7a CSS3, n\u00f3 quy \u0111\u1ecbnh \u0111\u1ed9 trong su\u1ed1t c\u1ee7a h\u00ecnh \u1ea3nh ho\u1eb7c n\u1ec1n m\u00e0u n\u00e0o \u0111\u00f3. N\u1ebfu t\u1eebng bi\u1ebft Photoshop b\u1ea1n ch\u1eafc kh\u00f4ng l\u1ea1 opacity. B\u1eb1ng CSS3 ch\u00fang ta kh\u00f4ng c\u1ea7n d\u00f9ng ph\u1ea7n m\u1ec1m ch\u1ec9nh s\u1eeda \u1ea3nh n\u00e0o n\u1eefa, c\u00e1c th\u00e0nh ph\u1ea7n &hellip;","og_url":"https:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2013-10-26T17:04:00+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2021\/02\/xuc-xac.jpg"}],"author":"Nguy\u1ec5n \u0110\u1ee9c Anh","twitter_card":"summary_large_image","twitter_misc":{"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi":"Nguy\u1ec5n \u0110\u1ee9c Anh","\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc":"2 ph\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/","url":"https:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/","name":"Thu\u1ed9c t\u00ednh opacity trong CSS3 &#8226; Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2013-10-26T17:04:00+00:00","dateModified":"2013-10-26T17:04:00+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"breadcrumb":{"@id":"https:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/thuoc-tinh-opacity-trong-css3\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"Thu\u1ed9c t\u00ednh opacity trong CSS3"}]},{"@type":"WebSite","@id":"https:\/\/kiencang.net\/#website","url":"https:\/\/kiencang.net\/","name":"Ki\u1ebfn c\u00e0ng","description":"\u00d4m l\u00fd thuy\u1ebft, h\u00f4n th\u1ef1c h\u00e0nh","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kiencang.net\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"vi"},{"@type":"Person","@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16","name":"Nguy\u1ec5n \u0110\u1ee9c Anh","image":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/kiencang.net\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/6d71f9b89393952a8382e30dad26c1ec?s=96&d=monsterid&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6d71f9b89393952a8382e30dad26c1ec?s=96&d=monsterid&r=g","caption":"Nguy\u1ec5n \u0110\u1ee9c Anh"},"description":"Sinh n\u0103m 1987, t\u1ed1t nghi\u1ec7p Cao \u0111\u1eb3ng th\u1ef1c h\u00e0nh FPT qu\u00e3ng 2014, chuy\u00ean ng\u00e0nh Thi\u1ebft k\u1ebf website. T\u00f4i th\u00edch Content, SEO, Ads, T\u0103ng t\u1ed1c website v\u00e0 Th\u01b0\u01a1ng m\u1ea1i \u0111i\u1ec7n t\u1eed. B\u00ean c\u1ea1nh b\u00e0i t\u1ef1 vi\u1ebft, t\u00f4i c\u0169ng d\u1ecbch nhi\u1ec1u n\u1ed9i dung th\u00fa v\u1ecb c\u1ee7a c\u00e1c t\u00e1c gi\u1ea3 kh\u00e1c nhau. FB c\u00e1 nh\u00e2n: facebook.com\/anhducnguyen87. Email li\u00ean h\u1ec7: guiemailchotoi@gmail.com","sameAs":["https:\/\/www.facebook.com\/anhducnguyen87\/"],"url":"https:\/\/kiencang.net\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/309"}],"collection":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/comments?post=309"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/309\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=309"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=309"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=309"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}