{"id":2390,"date":"2023-11-14T15:10:41","date_gmt":"2023-11-14T03:59:20","guid":{"rendered":""},"modified":"2023-11-14T11:59:20","modified_gmt":"2023-11-14T03:59:20","slug":"CSS background-clip","status":"publish","type":"post","link":"https:\/\/bianchenghao6.com\/2390.html","title":{"rendered":"CSS background-clip"},"content":{"rendered":"


\n <\/head>
\n <\/p>\n

\n

CSS background-clip<\/h1>\n<\/p><\/div>\n
\n CSS background-clip\u5c5e\u6027\u6307\u5b9a\u80cc\u666f\u7684\u7ed8\u5236\u533a\u57df\u3002\u5b83\u901a\u8fc7\u5e94\u7528\u526a\u5207\u6846\u6765\u9650\u5236\u80cc\u666f\u989c\u8272\u6216\u56fe\u50cf\u51fa\u73b0\u7684\u533a\u57df\u3002\n <\/div>\n
\n \u5b83\u8bbe\u7f6e\u5143\u7d20\u7684\u80cc\u666f\u662f\u5426\u5728border-box\uff0cpadding-box\u548ccontent-box\u4e0b\u5ef6\u4f38\u3002\n <\/div>\n

\u8bed\u6cd5<\/h3>\n
\n
 background-clip: border-box| padding-box| content-box| inherit;
 <\/span><\/code><\/pre>\n<\/p><\/div>\n
\n    \u8ba9\u6211\u4eec\u7406\u89e3\u5c5e\u6027\u503c\u4ee5\u53ca\u6bcf\u4e2a\u5c5e\u6027\u7684\u793a\u4f8b\u3002\n  <\/div>\n
border-box<\/h3>\n
\n    \u8fd9\u662f\u9ed8\u8ba4\u503c\u3002\u8fd9\u610f\u5473\u7740\u5c06\u5728\u8fb9\u6846\u5185\u7ed8\u5236\u80cc\u666f\u56fe\u50cf\u548c\u989c\u8272\u3002\u5b83\u8bbe\u7f6e\u80cc\u666f\u989c\u8272\uff0c\u8be5\u989c\u8272\u5206\u5e03\u5728\u6574\u4e2a\u5206\u533a\u4e0a\u3002\n  <\/div>\n
\u793a\u4f8b<\/h3>\n
\n
 <!DOCTYPE html> 
 <html> 
     <head> 
         <style> 
             div { 
                 background-color: yellow; 
                 background-clip: border-box; 
                 text-align: center; 
                 border:5px dotted blue; 
             } 
 h1,h2{
 color: red;
 }
         <\/style> 
     <\/head> 
     <body> 
         <div> 
             <h1> 
               Welcome to the bianchenghao6.com
             <\/h1> 
             <h2> 
                 background-clip: border-box; 
             <\/h2> 
         <\/div> 
     <\/body> 
 <\/html>
 <\/span><\/code><\/pre>\n<\/p><\/div>\n
\n   \u8f93\u51fa\uff1a<\/strong>\n  <\/div>\n
  CSS background-clip_https:\/\/bianchenghao6.com_\u3010CSS \u6559\u7a0b\u3011_\u7b2c1\u5f20 <\/p>\n
padding-box<\/h3>\n
\n    \u5b83\u5728\u8fb9\u6846\u5185\u8bbe\u7f6e\u80cc\u666f\uff0c\u5373\u80cc\u666f\u56fe\u50cf\u548c\u989c\u8272\u7ed8\u5236\u5728\u586b\u5145\u6846\u5185\u3002\n  <\/div>\n
\u793a\u4f8b<\/h3>\n
\n
 <!DOCTYPE html> 
 <html> 
     <head> 
         <style> 
             div { 
                 background-color: yellow; 
                 background-clip: padding-box; 
 padding: 25px;
                 text-align: center; 
                 border:5px dashed blue; 
             } 
 h1,h2{
 color: red;
 }
         <\/style> 
     <\/head> 
     <body> 
         <div> 
             <h1> 
               Welcome to the bianchenghao6.com
             <\/h1> 
             <h2> 
                 background-clip: padding-box; 
             <\/h2> 
         <\/div> 
     <\/body> 
 <\/html>
 <\/span><\/code><\/pre>\n<\/p><\/div>\n
\n   \u8f93\u51fa\uff1a<\/strong>\n  <\/div>\n
  CSS background-clip_https:\/\/bianchenghao6.com_\u3010CSS \u6559\u7a0b\u3011_\u7b2c2\u5f20 <\/p>\n
content-box<\/h3>\n
\n    \u5b83\u4ec5\u5c06\u80cc\u666f\u8272\u8bbe\u7f6e\u4e3a\u5185\u5bb9\u3002\u80cc\u666f\u7ed8\u5236\u5728\u5185\u5bb9\u6846\u4e2d\uff0c\u5373\u80cc\u666f\u56fe\u50cf\u548c\u989c\u8272\u5c06\u5728\u5185\u5bb9\u6846\u4e2d\u7ed8\u5236\u3002\n  <\/div>\n
\u793a\u4f8b<\/h3>\n
\n
 <!DOCTYPE html> 
 <html> 
     <head> 
         <style> 
             div { 
                 background-color: yellow; 
                 background-clip: content-box; 
 padding: 15px;
                 text-align: center; 
                 border:5px dashed blue; 
             } 
 h1,h2{
 color: red;
 }
         <\/style> 
     <\/head> 
     <body> 
         <div> 
             <h1> 
               Welcome to the bianchenghao6.com
             <\/h1> 
             <h2> 
                 background-clip: content-box; 
             <\/h2> 
         <\/div> 
     <\/body> 
 <\/html>
 <\/span><\/code><\/pre>\n<\/p><\/div>\n
\n   \u8f93\u51fa\uff1a<\/strong>\n  <\/div>\n
  CSS background-clip_https:\/\/bianchenghao6.com_\u3010CSS \u6559\u7a0b\u3011_\u7b2c3\u5f20
\n <\/body>
\n<\/html><\/p>\n","protected":false},"excerpt":{"rendered":"zh-cn","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[175],"tags":[],"class_list":["post-2390","post","type-post","status-publish","format-standard","hentry","category-css-jc"],"_links":{"self":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/posts\/2390"}],"collection":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/comments?post=2390"}],"version-history":[{"count":0,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/posts\/2390\/revisions"}],"wp:attachment":[{"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/media?parent=2390"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/categories?post=2390"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bianchenghao6.com\/wp-json\/wp\/v2\/tags?post=2390"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}