CSS和“★”字符制做的中国国旗实现代码分享-计算机技术网

CSS和“★”字符制做的中国国旗实现代码分享

2020年4月16日下午2:28 • css使用教程 • 阅读 2

在网上看见某位牛人用CSS做的红旗就是很牛！
上图先看：

<html>  <head>  <title>CSS中国国旗</title>  <style type=”text/css”>  .all{  background-color:red;  width:960;  height=640;  }  .five{  background-color:red;  width:480;  height=320;  }  .big{  position:absolute;  background-color:red;  margin-top:64px;  margin-left:64px;  color:yellow;  font-size:192px;  }  .small{  position:absolute;  background-color:red;  color:yellow;  font-size:64px;  }  .s1{  margin-top:32px;  margin-left:288px;  filter:progid:DXImageTransform.Microsoft.Matrix(SizingMethod=’auto expand’,M11=0.6565,M12=0.7543,M21=-0.7543,M22=0.6565);  }  .s2{  margin-top:96px;  margin-left:352px;  filter:progid:DXImageTransform.Microsoft.Matrix(SizingMethod=’auto expand’,M11=0.8978,M12=0.4404,M21=-0.4404,M22=0.8978);  }  .s3{  margin-top:192px;  margin-left:352px;  filter:progid:DXImageTransform.Microsoft.Matrix(SizingMethod=’auto expand’,M11=0.9994,M12=0.0359,M21=-0.0359,M22=0.9994);  }  .s4{  margin-top:256px;  margin-left:288px;  filter:progid:DXImageTransform.Microsoft.Matrix(SizingMethod=’auto expand’,M11=0.9357,M12=-0.3528,M21=0.3528,M22=0.9357);  }  </style>  </head>  <body>  <div class=”all”>  <div class=”five”>  <div class=”big”>★</div>  <div class=”small s1″>★</div>  <div class=”small s2″>★</div>  <div class=”small s3″>★</div>  <div class=”small s4″>★</div>  </div>  </div>  </body>  </html>  第2种代码，全部镶嵌在“<body>..</body>”网页标签里：  <div style=”background-color:red;width:960;height=640;”>  <div style=”background-color:red;width:480;height=320;”>  <div style=”z-index:2;position:absolute;background-color:red;margin-top:64px;margin-left:64px;color:yellow;font-size:192px;”>★</div>  <div style=”z-index:2;position:absolute;background-color:red;margin-top:32px;margin-left:288px;color:yellow;font-size:64px;filter:progid:DXImageTransform.Microsoft.Matrix(SizingMethod=’auto expand’,M11=0.6565,M12=0.7543,M21=-0.7543,M22=0.6565);”>★</div>  <div style=”z-index:2;position:absolute;background-color:red;margin-top:96px;margin-left:352px;color:yellow;font-size:64px;filter:progid:DXImageTransform.Microsoft.Matrix(SizingMethod=’auto expand’,M11=0.8978,M12=0.4404,M21=-0.4404,M22=0.8978);”>★</div>  <div style=”z-index:2;position:absolute;background-color:red;margin-top:192px;margin-left:352px;color:yellow;font-size:64px;filter:progid:DXImageTransform.Microsoft.Matrix(SizingMethod=’auto expand’,M11=0.9994,M12=0.0359,M21=-0.0359,M22=0.9994);”>★</div>  <div style=”z-index:2;position:absolute;background-color:red;margin-top:256px;margin-left:288px;color:yellow;font-size:64px;filter:progid:DXImageTransform.Microsoft.Matrix(SizingMethod=’auto expand’,M11=0.9357,M12=-0.3528,M21=0.3528,M22=0.9357);”>★</div>  </div>  </div>

提示：您可以先修改部分代码再运行

—-想了解更多的linux相关异常处理怎么解决关注<计算机技术网(www.ctvol.com)!!>

本文来自网络收集，不代表计算机技术网立场，如涉及侵权请联系管理员删除。

ctvol管理联系方式QQ:251552304

本文章地址：https://www.ctvol.com/csstutorial/64063.html

CSS和“★”字符制做的中国国旗实现代码分享

精彩推荐