{"id":6125,"date":"2022-03-14T16:45:47","date_gmt":"2022-03-14T08:45:47","guid":{"rendered":"http:\/\/jilin.hydesign.tw\/?p=6125"},"modified":"2022-03-22T16:38:41","modified_gmt":"2022-03-22T08:38:41","slug":"css-functions-attr","status":"publish","type":"post","link":"http:\/\/jilin.hydesign.tw\/index.php\/2022\/03\/14\/css-functions-attr\/","title":{"rendered":"\u6307\u5b9a\u5c6c\u6027\u503c attr()"},"content":{"rendered":"\n<p>\u900f\u904eCSS\u5b9a\u7fa9\u5c6c\u6027\uff0c\u81ea\u8a02html\u5143\u7d20\u5c6c\u6027\u503c\u3002<br>ps.\u76ee\u524d\u6709\u700f\u89bd\u5668\u652f\u63f4\u5ea6\u554f\u984c<\/p>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h3 class=\"wp-block-heading\">\u261e \u8a9e\u6cd5\u8aaa\u660e<\/h3>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"css\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\/* Simple usage *\/\nattr(data-count);\nattr(title);\n\n\/* With type *\/\nattr(src url);\nattr(data-count number);\nattr(data-width px);\n\n\/* With fallback *\/\nattr(data-count number, 0);\nattr(src url, '');\nattr(data-width px, inherit);\nattr(data-something, 'default');<\/pre>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<h3 class=\"wp-block-heading\">\u261e \u7bc4\u4f8b<\/h3>\n\n\n\n<h4 class=\"wp-block-heading\">\u81ea\u8a02\u5c6c\u6027\u503c ::before<\/h4>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"css\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\/* css\u7bc4\u4f8b-\u81ea\u8a02\u5c6c\u6027\u503c *\/\np::before {\n  content: attr(data-foo) \" \";\n}<\/pre>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;p data-foo=\"hello\">world&lt;\/p><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">\u81ea\u8a02\u5c6c\u6027\u503c ::after<\/h4>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"css\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">\/* css\u7bc4\u4f8b-\u81ea\u8a02\u5c6c\u6027\u503c *\/\nspan:hover::after {\n    content: attr(data-title);\n}<\/pre>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;span data-title=\"\u63d0\u793a\">\u6309\u94ae&lt;\/span><\/pre>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u900f\u904eCSS\u5b9a\u7fa9\u5c6c\u6027\uff0c\u81ea\u8a02html\u5143\u7d20\u5c6c\u6027\u503c\u3002ps.\u76ee\u524d\u6709\u700f\u89bd\u5668\u652f\u63f4\u5ea6\u554f\u984c \u261e \u8a9e\u6cd5\u8aaa\u660e \u261e \u7bc4\u4f8b \u81ea\u8a02\u5c6c\u6027\u503c &#46;&#46;&#46;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13,53,12,4],"tags":[],"class_list":["post-6125","post","type-post","status-publish","format-standard","hentry","category-css","category-css-functions","category-front-end","category-notes"],"_links":{"self":[{"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/posts\/6125","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/comments?post=6125"}],"version-history":[{"count":84,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/posts\/6125\/revisions"}],"predecessor-version":[{"id":7039,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/posts\/6125\/revisions\/7039"}],"wp:attachment":[{"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/media?parent=6125"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/categories?post=6125"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/jilin.hydesign.tw\/index.php\/wp-json\/wp\/v2\/tags?post=6125"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}