{"id":2811,"date":"2016-11-03T07:50:15","date_gmt":"2016-11-03T07:50:15","guid":{"rendered":"https:\/\/www.codebee.co.th\/labs\/?p=2811"},"modified":"2017-02-14T12:41:04","modified_gmt":"2017-02-14T12:41:04","slug":"css-%e0%b8%a7%e0%b8%b4%e0%b8%98%e0%b8%b5%e0%b8%97%e0%b8%b3-mask-%e0%b9%81%e0%b8%aa%e0%b8%94%e0%b8%87%e0%b8%81%e0%b8%a3%e0%b8%ad%e0%b8%9a%e0%b8%a3%e0%b8%b9%e0%b8%9b%e0%b9%80%e0%b8%9b%e0%b9%87%e0%b8%99","status":"publish","type":"post","link":"https:\/\/www.codebee.co.th\/labs\/css-%e0%b8%a7%e0%b8%b4%e0%b8%98%e0%b8%b5%e0%b8%97%e0%b8%b3-mask-%e0%b9%81%e0%b8%aa%e0%b8%94%e0%b8%87%e0%b8%81%e0%b8%a3%e0%b8%ad%e0%b8%9a%e0%b8%a3%e0%b8%b9%e0%b8%9b%e0%b9%80%e0%b8%9b%e0%b9%87%e0%b8%99\/","title":{"rendered":"CSS \u0e27\u0e34\u0e18\u0e35\u0e17\u0e33 Mask \u0e41\u0e2a\u0e14\u0e07\u0e01\u0e23\u0e2d\u0e1a\u0e23\u0e39\u0e1b\u0e40\u0e1b\u0e47\u0e19\u0e27\u0e07\u0e01\u0e25\u0e21"},"content":{"rendered":"

CSS \u0e27\u0e34\u0e18\u0e35\u0e17\u0e33 Mask \u0e41\u0e2a\u0e14\u0e07\u0e01\u0e23\u0e2d\u0e1a\u0e23\u0e39\u0e1b\u0e40\u0e1b\u0e47\u0e19\u0e27\u0e07\u0e01\u0e25\u0e21<\/h3>\n

<\/br>
\nCSS \u0e27\u0e34\u0e18\u0e35\u0e17\u0e33 Mask \u0e41\u0e2a\u0e14\u0e07\u0e01\u0e23\u0e2d\u0e1a\u0e23\u0e39\u0e1b\u0e40\u0e1b\u0e47\u0e19\u0e27\u0e07\u0e01\u0e25\u0e21<\/strong>
\n<\/br>
\n\u0e41\u0e19\u0e30\u0e19\u0e33\u0e27\u0e34\u0e18\u0e35\u0e17\u0e33\u0e23\u0e39\u0e1b\u0e42\u0e1b\u0e23\u0e44\u0e1f\u0e25\u0e4c \u0e2b\u0e23\u0e37\u0e2d\u0e23\u0e39\u0e1b Avatar \u0e1a\u0e19\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e43\u0e2b\u0e49\u0e21\u0e35\u0e01\u0e23\u0e2d\u0e1a\u0e23\u0e39\u0e1b\u0e27\u0e07\u0e01\u0e25\u0e21\u0e04\u0e25\u0e49\u0e32\u0e22 \u0e46 \u0e01\u0e32\u0e23 mask \u0e42\u0e14\u0e22\u0e2d\u0e32\u0e28\u0e31\u0e22\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e02\u0e2d\u0e07 CSS ( Cascading Style Sheets ) \u0e17\u0e35\u0e48\u0e2a\u0e33\u0e04\u0e31\u0e0d\u0e40\u0e02\u0e35\u0e22\u0e19\u0e42\u0e04\u0e4a\u0e14\u0e41\u0e04\u0e48\u0e1a\u0e23\u0e23\u0e17\u0e31\u0e14\u0e40\u0e14\u0e35\u0e22\u0e27 \u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e40\u0e23\u0e35\u0e22\u0e01\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19 class \u0e1a\u0e19 img element \u0e2b\u0e23\u0e37\u0e2d div \u0e44\u0e14\u0e49\u0e40\u0e25\u0e22 \u0e25\u0e2d\u0e07\u0e44\u0e1b\u0e14\u0e39\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a\u0e27\u0e48\u0e32 \u0e21\u0e35\u0e27\u0e34\u0e18\u0e35\u0e40\u0e02\u0e35\u0e22\u0e19\u0e22\u0e31\u0e07\u0e44\u0e07\u0e1a\u0e49\u0e32\u0e07<\/p>\n

<\/br><\/p>\n

\u0e2a\u0e48\u0e27\u0e19\u0e02\u0e2d\u0e07 CSS <\/h4>\n

\u0e43\u0e0a\u0e49\u0e40\u0e1e\u0e35\u0e22\u0e07\u0e04\u0e33\u0e2a\u0e31\u0e48\u0e07\u0e40\u0e14\u0e35\u0e22\u0e27\u0e04\u0e23\u0e31\u0e1a \u0e04\u0e37\u0e2d border-radius \u0e15\u0e31\u0e49\u0e07\u0e0a\u0e37\u0e48\u0e2d class \u0e41\u0e25\u0e30\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e02\u0e19\u0e32\u0e14\u0e04\u0e27\u0e32\u0e21\u0e21\u0e19\u0e02\u0e2d\u0e07\u0e02\u0e2d\u0e1a\u0e23\u0e39\u0e1b\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e1b\u0e2d\u0e23\u0e4c\u0e40\u0e0b\u0e47\u0e19 \u0e25\u0e2d\u0e07\u0e21\u0e32\u0e14\u0e39\u0e15\u0e31\u0e27\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e01\u0e31\u0e19\u0e04\u0e23\u0e31\u0e1a \u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e25\u0e2d\u0e07\u0e17\u0e14\u0e2a\u0e2d\u0e1a \u0e43\u0e2b\u0e49\u0e01\u0e33\u0e2b\u0e19\u0e14 border-radius:20%
\n<\/br>
\n\u0e01\u0e33\u0e2b\u0e19\u0e14 border-radius \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 20% <\/strong><\/p>\n

.img-circle {\r\n    border-radius: 20%;\r\n}<\/pre>\n
\u0e1c\u0e25\u0e25\u0e31\u0e1e\u0e18\u0e4c\u0e17\u0e35\u0e48\u0e44\u0e14\u0e49\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e40\u0e23\u0e35\u0e22\u0e01\u0e43\u0e0a\u0e49\u0e07\u0e32\u0e19\u0e43\u0e19 html \u0e41\u0e1a\u0e1a\u0e19\u0e35\u0e49<\/p>\n
\r\n\r\n<\/pre>\n
\"\u0e27\u0e34\u0e18\u0e35-mask-\u0e23\u0e39\u0e1b\u0e40\u0e1b\u0e47\u0e19\u0e27\u0e07\u0e01\u0e25\u0e21\u0e14\u0e49\u0e27\u0e22-CSS\"<\/p>\n
<\/br>
\n\u0e01\u0e33\u0e2b\u0e19\u0e14 border-radius \u0e40\u0e17\u0e48\u0e32\u0e01\u0e31\u0e1a 50% <\/strong><\/p>\n
.img-circle {\r\n    border-radius: 50%;\r\n}<\/pre>\n
\"\u0e27\u0e34\u0e18\u0e35-mask-\u0e23\u0e39\u0e1b\u0e40\u0e1b\u0e47\u0e19\u0e27\u0e07\u0e01\u0e25\u0e21\u0e14\u0e49\u0e27\u0e22-CSS\"
\n<\/br>
\n\u0e40\u0e1b\u0e47\u0e19\u0e40\u0e17\u0e04\u0e19\u0e34\u0e04 css \u0e07\u0e48\u0e32\u0e22 \u0e46 \u0e41\u0e25\u0e30\u0e40\u0e02\u0e35\u0e22\u0e19\u0e42\u0e04\u0e4a\u0e14\u0e2a\u0e31\u0e49\u0e19\u0e21\u0e32\u0e01 \u0e25\u0e2d\u0e07\u0e40\u0e2d\u0e32\u0e44\u0e1b\u0e1b\u0e23\u0e31\u0e1a\u0e43\u0e0a\u0e49\u0e01\u0e31\u0e1a\u0e07\u0e32\u0e19\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e14\u0e39\u0e04\u0e23\u0e31\u0e1a \u0e2b\u0e27\u0e31\u0e07\u0e27\u0e48\u0e32\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19\u0e1b\u0e23\u0e30\u0e42\u0e22\u0e0a\u0e19\u0e4c<\/p>\n","protected":false},"excerpt":{"rendered":"
CSS \u0e27\u0e34\u0e18\u0e35\u0e17\u0e33 Mask \u0e41\u0e2a\u0e14\u0e07\u0e01\u0e23\u0e2d\u0e1a\u0e23\u0e39\u0e1b\u0e40\u0e1b\u0e47\u0e19\u0e27\u0e07\u0e01\u0e25\u0e21 CSS \u0e27\u0e34\u0e18\u0e35\u0e17\u0e33 Mask \u0e41\u0e2a\u0e14\u0e07\u0e01\u0e23\u0e2d\u0e1a\u0e23\u0e39\u0e1b\u0e40\u0e1b\u0e47\u0e19\u0e27\u0e07\u0e01\u0e25\u0e21 \u0e41\u0e19\u0e30\u0e19\u0e33\u0e27\u0e34\u0e18\u0e35\u0e17\u0e33\u0e23\u0e39\u0e1b\u0e42\u0e1b\u0e23\u0e44\u0e1f\u0e25\u0e4c \u0e2b\u0e23\u0e37\u0e2d\u0e23\u0e39\u0e1b Avatar \u0e1a\u0e19\u0e40\u0e27\u0e47\u0e1a\u0e44\u0e0b\u0e15\u0e4c\u0e43\u0e2b\u0e49\u0e21\u0e35\u0e01\u0e23\u0e2d\u0e1a\u0e23\u0e39\u0e1b\u0e27\u0e07\u0e01\u0e25\u0e21\u0e04\u0e25\u0e49\u0e32\u0e22 \u0e46 \u0e01\u0e32\u0e23 mask \u0e42\u0e14\u0e22\u0e2d\u0e32\u0e28\u0e31\u0e22\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e32\u0e21\u0e32\u0e23\u0e16\u0e02\u0e2d\u0e07 CSS ( Cascading Style…<\/p>\n","protected":false},"author":1,"featured_media":2812,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"video","meta":{"footnotes":""},"categories":[46],"tags":[984,985,983,614,549,793,11,986,935],"class_list":{"0":"post-2811","1":"post","2":"type-post","3":"status-publish","4":"format-video","5":"has-post-thumbnail","6":"hentry","7":"category-website-development-","8":"tag-css-circle-mask","9":"tag-css-","10":"tag-css--mask","11":"tag-614","12":"tag-549","13":"tag--css","14":"tag-11","16":"tag-935","17":"post_format-post-format-video"},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/posts\/2811","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/comments?post=2811"}],"version-history":[{"count":5,"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/posts\/2811\/revisions"}],"predecessor-version":[{"id":2819,"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/posts\/2811\/revisions\/2819"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/media\/2812"}],"wp:attachment":[{"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/media?parent=2811"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/categories?post=2811"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.codebee.co.th\/labs\/wp-json\/wp\/v2\/tags?post=2811"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}