纯CSS3绘制26个英文字母
来源：互联网 发布：c语言模块 结构体 编辑：程序博客网 时间：2024/04/28 15:14
纯CSS3绘制26个英文字母
在这里你看到的26个标准的英文字母并不是普通的字体，它们是用CSS在空白的页面上绘制出来的，纯css作品。主要运用了CSS3里的多个新变换功能，需要使用最新的浏览器进行观赏。
网页代码中用到（<!-- 浮动Div换行 --> <div style="clear:both">）和Div边距设置和浮动（margin:20px 5px 10px 80px; float: left;）。其中边距Margin四个像素依次代表：上右下左。
以下按字母表顺序，列出绘制26个字母的CSS。
.A{ position:relative; margin:10px 30px 10px 5px; /*上右下左 */ float: left; left:30px; width:60px; height:91px; border-bottom:solid 14px #0feee2; } .A:before{ transform:skew(-19deg,0); position:absolute; content:''; top:12.5px; left:0; width:16px; height:125px; background-color:#0feee2; } .A:after{ transform:skew(19deg,0); position:absolute; content:''; top:12.5px; left:45px; width:16px; height:125px; background-color:#0feee2; } 
.B{ position:relative; margin:10px 20px 10px 30px; float: left; top:12.5px; left:10px; width:60px; height:125px; border-left:solid 16px #2056cd; } .B:before{ position:absolute; content:''; width:52px; height:39px; border-width:15px 15px 10px 0; border-color:#2056cd; border-style:solid; border-radius:0 240%180%0 /0 180%180%0; } .B:after{ position:absolute; content:''; bottom:0; width:58px; height:43px; border-width:10px 15px 15px 0; border-color:#2056cd; border-style:solid; border-radius:0 180%220%0 /0 180%180%0; } 
.C{ position:relative; margin:10px 5px 10px 10px; float: left; top:12.5px; left:10px; width:84px; height:95px; border-width:15px 12px 15px 16px; border-color:#87adef; border-style:solid; border-radius:50%; } .C:before{ transform:rotate(45deg); position:absolute; content:''; top:2px; left:49px; width:90px; height:90px; background-color:#ffffff; } 
.D{ position:relative; margin:10px 20px 10px 5px; float: left; top:12.5px; left:10px; border-left:solid 15px #ade081; height:125px; } .D:before{ position:absolute; content:''; top:0; left:0; width:60px; height:95px; border-width:15px 15px 15px 0; border-color:#ade081; border-style:solid; border-radius:0 300%300%0 /0 180%180%0; } 
.E{ position:relative; margin:10px 10px 10px 60px; float: left; top:12.5px; left:10px; width:63px; height:95px; border-width:15px 0 15px 16px; border-color:#cd2388; border-style:solid; } .E:before{ position:absolute; content:''; top:38px; left:0px; width:53px; height:15px; background-color:#cd2388; } 
.F{ position:relative; margin:10px 5px 10px 10px; float: left; top:12.5px; left:10px; width:63px; height:110px; border-width:15px 0 0 16px; border-color:#668899; border-style:solid; } .F:before{ position:absolute; content:''; top:38px; left:0px; width:53px; height:15px; background-color:#668899; } 
.G{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:84px; height:95px; border-width:15px 12px 15px 16px; border-color:#f0af00; border-style:solid; border-radius:50%; } .G:before{ transform:rotate(45deg); position:absolute; content:''; top:2px; left:48px; background-color:#ffffff; width:90px; height:90px; } .G:after{ position:absolute; content:''; bottom:0.5px; right:7px; width:28px; height:36px; border-width:13px 14px 0 0; border-color:#f0af00; border-style:solid; } 
.H{ position:relative; margin:10px 10px 10px 5px; float: left; top:12.5px; left:10px; width:60px; height:125px; border-width:0 16px 0 16px; border-color:#cde680; border-style:solid; } .H:before{ position:absolute; content:''; top:53px; left:0; width:60px; height:14px; background-color:#cde680; } 
.I{ z-index:1; position:relative; margin:10px 10px 10px 10px; float: left; top:12.5px; left:20px; width:16px; height:125px; background-color:#020a0f; } 
.J{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:-5px; width:75px; height:66px; border-right:solid 16px #b0c0d0; } .J:before{ position:absolute; content:''; bottom:-60px; right:-16px; width:50px; height:60px; border-width:0 16px 15px 14px; border-color:#b0c0d0; border-style:solid; border-radius:0 0 75%75%; } .J:after{ transform:rotate(-40deg); position:absolute; content:''; top:40px; left:-20px; width:60px; height:60px; background-color:#ffffff; } 
.K{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:80px; height:125px; border-left:solid 16px #ce6688; overflow:hidden; } .K:before{ transform:skew(-43deg,0); position:absolute; content:''; top:0; left:16px; width:19px; height:84px; background-color:#ce6688; } .K:after{ transform:skew(30deg,0); position:absolute; content:''; bottom:0; right:25px; width:18px; height:80px; background-color:#ce6688; } 
.L{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:63px; height:110px; border-width:0 0 15px 16px; border-color:#998800; border-style:solid; } 
.M{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:80px; height:125px; border-width:0 15px 0 15px; border-color:#ff0000; border-style:solid; } .M:before{ transform:skew(20deg,0); position:absolute; content:''; top:0; left:14px; width:12px; height:110px; background-color:#ff0000; } .M:after{ transform:skew(-20deg,0); position:absolute; content:''; top:0; right:14px; width:12px; height:110px; background-color:#ff0000; } 
.N{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:63px; height:125px; border-width:0 15px 0 15px; border-color:#9aff02; border-style:solid; } .N:before{ transform:skew(30deg,0); position:absolute; content:''; top:0; left:24px; width:15px; height:125px; background-color:#9aff02; } 
.O{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:70px; height:97px; border-width:14px 16px 14px 16px; border-color:#ffff40; border-style:solid; border-radius:55% /52%; } 
.P{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:60px; height:125px; border-left:solid 16px #00ffff; } .P:before{ position:absolute; content:''; width:56px; height:50px; border-width:13px 15px 13px 0; border-color:#00ffff; border-style:solid; border-radius:0 220%220%0 /0 180%180%0; }
.Q { z-index:-1; position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:70px; height:97px; border-width:14px 16px 14px 16px; border-color:#deff00; border-style:solid; border-radius:55% /52%; } .Q:before{ transform:rotate(-84deg); position:absolute; content:''; top:82px; left:49px; width:16px; height:48px; border-width:16px 0 13px 13px; border-color:#deff00; border-style:solid; border-radius:200%0 0 200% /100%0 0 100%; } .Q:after{ transform:rotate(-18deg); position:absolute; content:''; bottom:-35px; right:-44px; width:30px; height:30px; background-color:#ffffff; } 
.R{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:60px; height:125px; border-left:solid 16px #a0b0c0; } .R:before{ position:absolute; content:''; width:52px; height:44px; border-width:13px 15px 13px 0; border-color:#a0b0c0; border-style:solid; border-radius:0 220%220%0 /0 180%180%0; } .R:after{ transform:skew(32deg,0); position:absolute; content:''; bottom:0; left:38px; width:18px; height:58px; background-color:#a0b0c0; } 
.S{ transform:rotate(14deg); position:relative; margin:10px 5px 10px 5px; float: left; width:105px; height:150px; top:10px; left:10px; } .S:before{ transform:rotate(18deg); position:absolute; content:''; width:44px; height:40px; border-width:14px 0 15px 15.5px; border-color:#ffaf80; border-style:solid; border-radius:220%0 0 150% /150%0 0 100%; } .S:after{ transform:rotate(198deg); position:absolute; content:''; top:65px; left:21px; width:52px; height:44px; border-width:14px 0 15px 15px; border-color:#ffaf80; border-style:solid; border-radius:240%0 0 110% /140%0 0 100%; } 
.T{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:100px; height:125px; border-top:solid 15px #ffd0e0; } .T:before{ position:absolute; content:''; top:0; left:42px; width:16px; height:110px; background-color:#ffd0e0; } 
.U{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:60px; height:80px; border-width:0 16px 0 16px; border-color:#ff8f01; border-style:solid; } .U:before{ position:absolute; content:''; top:65px; left:-16px; width:60px; height:45px; border-width:0 16px 15px 16px; border-color:#ff8f01; border-style:solid; border-radius:0 0 200%200% /0 0 300%300%; } 
.V{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:30px; width:59px; } .V:before{ transform:skew(18deg,0); position:absolute; content:''; top:0; left:0; height:125px; border-left:solid 16px #008800; } .V:after{ transform:skew(-18deg,0); position:absolute; content:''; top:0; right:0; height:125px; border-left:solid 16px #008800; } 
.W{ position:relative; margin:10px 5px 10px 40px; float: left; top:12.5px; left:25px; width:100px; } .W:before{ transform:skew(11deg,0); position:absolute; content:''; top:0; left:0; width:42px; height:125px; border-width:0 13px 0 15px; border-color:#000000; border-style:solid; } .W:after{ transform:skew(-11deg,0); position:absolute; content:''; top:0; right:0; width:42px; height:125px; border-width:0 15px 0 13px; border-color:#000000; border-style:solid; } 
.X{ position:relative; margin:10px 5px 10px 25px; float: left; top:12.5px; left:50px; width:16px; height:125px; } .X:before{ transform:skew(32deg,0); position:absolute; content:''; top:0; left:0; width:16px; height:125px; background-color:#0066ff; } .X:after{ transform:skew(-32deg,0); position:absolute; content:''; top:0; right:0; width:16px; height:125px; background-color:#0066ff; } 
.Y{ position:relative; margin:10px 5px 10px 80px; float: left; top:92.5px; left:52px; width:16px; height:50px; background-color:#22ff55; } .Y:before{ transform:skew(28deg,0); position:absolute; content:''; top:-80px; left:-21px; width:16px; height:80px; background-color:#22ff55; } .Y:after{ transform:skew(-28deg,0); position:absolute; content:''; top:-80px; right:-21px; width:16px; height:80px; background-color:#22ff55; } 
.Z{ position:relative; margin:20px 5px 10px 80px; float: left; top:12.5px; left:10px; width:90px; height:95px; border-width:15px 0 15px 0; border-color:#336699; border-style:solid; } .Z:before{ transform:skew(-37deg,0); position:absolute; content:''; top:0; left:36px; width:18px; height:95px; background-color:#336699; } 完整的HTML5+CSS3版Demo。效果截图：
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>CSS3绘制26个字母</title> <style> .A{ position:relative; margin:10px 30px 10px 5px; /*上右下左 */ float: left; left:30px; width:60px; height:91px; border-bottom:solid 14px #0feee2; } .A:before{ transform:skew(-19deg,0); position:absolute; content:''; top:12.5px; left:0; width:16px; height:125px; background-color:#0feee2; } .A:after{ transform:skew(19deg,0); position:absolute; content:''; top:12.5px; left:45px; width:16px; height:125px; background-color:#0feee2; } .B{ position:relative; margin:10px 20px 10px 30px; float: left; top:12.5px; left:10px; width:60px; height:125px; border-left:solid 16px #2056cd; } .B:before{ position:absolute; content:''; width:52px; height:39px; border-width:15px 15px 10px 0; border-color:#2056cd; border-style:solid; border-radius:0 240%180%0 /0 180%180%0; } .B:after{ position:absolute; content:''; bottom:0; width:58px; height:43px; border-width:10px 15px 15px 0; border-color:#2056cd; border-style:solid; border-radius:0 180%220%0 /0 180%180%0; } .C{ position:relative; margin:10px 5px 10px 10px; float: left; top:12.5px; left:10px; width:84px; height:95px; border-width:15px 12px 15px 16px; border-color:#87adef; border-style:solid; border-radius:50%; } .C:before{ transform:rotate(45deg); position:absolute; content:''; top:2px; left:49px; width:90px; height:90px; background-color:#ffffff; } .D{ position:relative; margin:10px 20px 10px 5px; float: left; top:12.5px; left:10px; border-left:solid 15px #ade081; height:125px; } .D:before{ position:absolute; content:''; top:0; left:0; width:60px; height:95px; border-width:15px 15px 15px 0; border-color:#ade081; border-style:solid; border-radius:0 300%300%0 /0 180%180%0; } .E{ position:relative; margin:10px 10px 10px 60px; float: left; top:12.5px; left:10px; width:63px; height:95px; border-width:15px 0 15px 16px; border-color:#cd2388; border-style:solid; } .E:before{ position:absolute; content:''; top:38px; left:0px; width:53px; height:15px; background-color:#cd2388; } .F{ position:relative; margin:10px 5px 10px 10px; float: left; top:12.5px; left:10px; width:63px; height:110px; border-width:15px 0 0 16px; border-color:#668899; border-style:solid; } .F:before{ position:absolute; content:''; top:38px; left:0px; width:53px; height:15px; background-color:#668899; } .G{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:84px; height:95px; border-width:15px 12px 15px 16px; border-color:#f0af00; border-style:solid; border-radius:50%; } .G:before{ transform:rotate(45deg); position:absolute; content:''; top:2px; left:48px; background-color:#ffffff; width:90px; height:90px; } .G:after{ position:absolute; content:''; bottom:0.5px; right:7px; width:28px; height:36px; border-width:13px 14px 0 0; border-color:#f0af00; border-style:solid; } .H{ position:relative; margin:10px 10px 10px 5px; float: left; top:12.5px; left:10px; width:60px; height:125px; border-width:0 16px 0 16px; border-color:#cde680; border-style:solid; } .H:before{ position:absolute; content:''; top:53px; left:0; width:60px; height:14px; background-color:#cde680; } .I{ z-index:1; position:relative; margin:10px 10px 10px 10px; float: left; top:12.5px; left:20px; width:16px; height:125px; background-color:#020a0f; } .J{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:-5px; width:75px; height:66px; border-right:solid 16px #b0c0d0; } .J:before{ position:absolute; content:''; bottom:-60px; right:-16px; width:50px; height:60px; border-width:0 16px 15px 14px; border-color:#b0c0d0; border-style:solid; border-radius:0 0 75%75%; } .J:after{ transform:rotate(-40deg); position:absolute; content:''; top:40px; left:-20px; width:60px; height:60px; background-color:#ffffff; } .K{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:80px; height:125px; border-left:solid 16px #ce6688; overflow:hidden; } .K:before{ transform:skew(-43deg,0); position:absolute; content:''; top:0; left:16px; width:19px; height:84px; background-color:#ce6688; } .K:after{ transform:skew(30deg,0); position:absolute; content:''; bottom:0; right:25px; width:18px; height:80px; background-color:#ce6688; } .L{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:63px; height:110px; border-width:0 0 15px 16px; border-color:#998800; border-style:solid; } .M{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:80px; height:125px; border-width:0 15px 0 15px; border-color:#ff0000; border-style:solid; } .M:before{ transform:skew(20deg,0); position:absolute; content:''; top:0; left:14px; width:12px; height:110px; background-color:#ff0000; } .M:after{ transform:skew(-20deg,0); position:absolute; content:''; top:0; right:14px; width:12px; height:110px; background-color:#ff0000; } .N{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:63px; height:125px; border-width:0 15px 0 15px; border-color:#9aff02; border-style:solid; } .N:before{ transform:skew(30deg,0); position:absolute; content:''; top:0; left:24px; width:15px; height:125px; background-color:#9aff02; } .O{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:70px; height:97px; border-width:14px 16px 14px 16px; border-color:#ffff40; border-style:solid; border-radius:55% /52%; } .P{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:60px; height:125px; border-left:solid 16px #00ffff; } .P:before{ position:absolute; content:''; width:56px; height:50px; border-width:13px 15px 13px 0; border-color:#00ffff; border-style:solid; border-radius:0 220%220%0 /0 180%180%0; } .Q { z-index:-1; position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:70px; height:97px; border-width:14px 16px 14px 16px; border-color:#deff00; border-style:solid; border-radius:55% /52%; } .Q:before{ transform:rotate(-84deg); position:absolute; content:''; top:82px; left:49px; width:16px; height:48px; border-width:16px 0 13px 13px; border-color:#deff00; border-style:solid; border-radius:200%0 0 200% /100%0 0 100%; } .Q:after{ transform:rotate(-18deg); position:absolute; content:''; bottom:-35px; right:-44px; width:30px; height:30px; background-color:#ffffff; } .R{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:60px; height:125px; border-left:solid 16px #a0b0c0; } .R:before{ position:absolute; content:''; width:52px; height:44px; border-width:13px 15px 13px 0; border-color:#a0b0c0; border-style:solid; border-radius:0 220%220%0 /0 180%180%0; } .R:after{ transform:skew(32deg,0); position:absolute; content:''; bottom:0; left:38px; width:18px; height:58px; background-color:#a0b0c0; } .S{ transform:rotate(14deg); position:relative; margin:10px 5px 10px 5px; float: left; width:105px; height:150px; top:10px; left:10px; } .S:before{ transform:rotate(18deg); position:absolute; content:''; width:44px; height:40px; border-width:14px 0 15px 15.5px; border-color:#ffaf80; border-style:solid; border-radius:220%0 0 150% /150%0 0 100%; } .S:after{ transform:rotate(198deg); position:absolute; content:''; top:65px; left:21px; width:52px; height:44px; border-width:14px 0 15px 15px; border-color:#ffaf80; border-style:solid; border-radius:240%0 0 110% /140%0 0 100%; } .T{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:100px; height:125px; border-top:solid 15px #ffd0e0; } .T:before{ position:absolute; content:''; top:0; left:42px; width:16px; height:110px; background-color:#ffd0e0; } .U{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:10px; width:60px; height:80px; border-width:0 16px 0 16px; border-color:#ff8f01; border-style:solid; } .U:before{ position:absolute; content:''; top:65px; left:-16px; width:60px; height:45px; border-width:0 16px 15px 16px; border-color:#ff8f01; border-style:solid; border-radius:0 0 200%200% /0 0 300%300%; } .V{ position:relative; margin:10px 5px 10px 5px; float: left; top:12.5px; left:30px; width:59px; } .V:before{ transform:skew(18deg,0); position:absolute; content:''; top:0; left:0; height:125px; border-left:solid 16px #008800; } .V:after{ transform:skew(-18deg,0); position:absolute; content:''; top:0; right:0; height:125px; border-left:solid 16px #008800; } .W{ position:relative; margin:10px 5px 10px 40px; float: left; top:12.5px; left:25px; width:100px; } .W:before{ transform:skew(11deg,0); position:absolute; content:''; top:0; left:0; width:42px; height:125px; border-width:0 13px 0 15px; border-color:#000000; border-style:solid; } .W:after{ transform:skew(-11deg,0); position:absolute; content:''; top:0; right:0; width:42px; height:125px; border-width:0 15px 0 13px; border-color:#000000; border-style:solid; } .X{ position:relative; margin:10px 5px 10px 25px; float: left; top:12.5px; left:50px; width:16px; height:125px; } .X:before{ transform:skew(32deg,0); position:absolute; content:''; top:0; left:0; width:16px; height:125px; background-color:#0066ff; } .X:after{ transform:skew(-32deg,0); position:absolute; content:''; top:0; right:0; width:16px; height:125px; background-color:#0066ff; } .Y{ position:relative; margin:10px 5px 10px 80px; float: left; top:92.5px; left:52px; width:16px; height:50px; background-color:#22ff55; } .Y:before{ transform:skew(28deg,0); position:absolute; content:''; top:-80px; left:-21px; width:16px; height:80px; background-color:#22ff55; } .Y:after{ transform:skew(-28deg,0); position:absolute; content:''; top:-80px; right:-21px; width:16px; height:80px; background-color:#22ff55; } .Z{ position:relative; margin:20px 5px 10px 80px; float: left; top:12.5px; left:10px; width:90px; height:95px; border-width:15px 0 15px 0; border-color:#336699; border-style:solid; } .Z:before{ transform:skew(-37deg,0); position:absolute; content:''; top:0; left:36px; width:18px; height:95px; background-color:#336699; } </style></head><body> <!-- 字母A --> <div id="A1" class="A"></div> <!-- 字母B --> <div id="B2" class="B"></div> <!-- 字母C --> <div id="C3" class="C"></div> <!-- 字母D --> <div id="D4" class="D"></div> <!-- 字母E --> <div id="E5" class="E"></div> <!-- 字母F --> <div id="F6" class="F"></div> <!-- 字母G --> <div id="G7" class="G"></div> <!-- 字母H --> <div id="H8" class="H"></div> <!-- 字母I --> <div id="I9" class="I"></div> <!-- 浮动Div换行 --> <div style="clear:both"> <!-- 字母J --> <div id="J10" class="J"></div> <!-- 字母K --> <div id="K11" class="K"></div> <!-- 字母L --> <div id="L12" class="L"></div> <!-- 字母M --> <div id="M13" class="M"></div> <!-- 字母N --> <div id="N14" class="N"></div> <!-- 字母O --> <div id="O15" class="O"></div> <!-- 字母O --> <div id="P16" class="P"></div> <!-- 字母Q --> <div id="Q17" class="Q"></div> <!-- 字母R --> <div id="R18" class="R"></div> <!-- 浮动Div换行 --> <div style="clear:both"> <!-- 字母S --> <div id="S19" class="S"></div> <!-- 字母T --> <div id="T20" class="T"></div> <!-- 字母U --> <div id="U21" class="U"></div> <!-- 字母V --> <div id="V22" class="V"></div> <!-- 字母W --> <div id="W23" class="W"></div> <!-- 字母X --> <div id="X24" class="X"></div> <!-- 字母Y --> <div id="Y25" class="Y"></div> <!-- 字母Z --> <div id="Z26" class="Z"></div></body></html> 本文参考：http://www.webhek.com/css-sans 0 0
- 纯CSS3绘制26个英文字母
- 输出26个英文字母
- 纯div+css3代码绘制hellokitty猫
- 纯div+css3代码绘制可爱小女孩
- 纯CSS3绘制打火机动画火焰特效
- 用纯css3绘制三角形的原理
- 纯CSS3绘制的小猫笑脸动画
- 纯CSS3手里剑模型动画绘制
- 汇编->显示26个英文字母
- 爱情与26个英文字母
- 随机生成26个英文字母
- PHP 26个英文字母递增
- Python3 打印26个英文字母
- 根据26个英文字母排序
- CSS3-使用纯css绘制天猫logo
- 26个英文字母的爱情解释
- Dropdownlist动态绑定26个英文字母
- 26个英文字母是谁发明的?
- 机房重构之开篇
- JavaWeb程序中的路径问题
- linux基础(二）
- 【BZOJ1060】[ZJOI2007]时态同步【TreeDp】
- Centos6.2下LAMP环境的搭建
- 纯CSS3绘制26个英文字母
- poj 2823 Sliding Window
- KVC
- Response status code does not indicate success: 401 (Unauthorized).
- KVO
- 第四周项目三-随机数函数应用于游戏（猜数字游戏）
- C++读取数量不定的输入数据
- Problem P
- php curl post 上传文件流
