玩游戏学前端——看您的细节把握能力

港控/mmm° 2022-08-05 12:22 164阅读 0赞

*  引入
 *  游戏
    
     *  KERNTYPE
     *  Shape Type
 *  声明

# 引入 #

大约一年前曾经通过两篇文章给大家推荐了几个前端游戏《[玩游戏学前端——猜颜色、选择器][Link 1]》、《[玩游戏学前端——颜色您了解多少？][Link 2]》，刚刚又给大家分享了《[玩游戏学前端——钢笔工具边玩边学][Link 3]》，通过玩游戏来学东西真的轻松愉快，我们接着给大家分享两个游戏，看看您的细节把握能力如何？  
[![这里写图片描述][20150423121553929]][20150423121553929 1]

[![这里写图片描述][20150423121629824]][20150423121629824 1]

# 游戏 #

## [KERNTYPE][] ##

这个游戏检测您对字体细节的把握能力，主要考察文字间字母的位置，当您设置完之后，会反馈您的分数和结果。如下图所示。  
![这里写图片描述][20150423122346790]  
蓝色字体标识正确的位置，白色的是您刚刚放置的位置，还可以使用单选按钮对比字体。

当然如果您的水平足够高，或者人品偶尔爆发，那么结果就是这样的。  
![这里写图片描述][20150423122605709]  
如结果所示，我的水平不是一般的高吧。

不信的话再来几个，哈哈  
![这里写图片描述][20150423123502958]  
![这里写图片描述][20150423123646502]  
![这里写图片描述][20150423123658451]  
![这里写图片描述][20150423123551521]  
![这里写图片描述][20150423123611714]  
![这里写图片描述][20150423123510571]  
![这里写图片描述][20150423123520274]

当然，有的时候人品处于低谷，也可能……  
![这里写图片描述][20150423123603330]

您的水平嘞，别藏着掖着，给俺看看，可以留言评论哈。

## [Shape Type][20150423121629824 1] ##

这个游戏考察您对字体字形的把握能力，刚开始会给一个需要调整的字体，调整之后会反馈您的测试结果，如下两幅图所示，第一幅为测试前，第二幅为测试后。  
![这里写图片描述][20150423125855499]  
![这里写图片描述][20150423125843060]

![这里写图片描述][20150423125909080]  
![这里写图片描述][20150423130035667]  
![这里写图片描述][20150423125935210]  
![这里写图片描述][20150423130122358]  
![这里写图片描述][20150423130018048]  
![这里写图片描述][20150423130145493]  
![这里写图片描述][20150423130039030]

# 声明 #

前端开发whqet，关注前端开发，分享相关资源。csdn专家博客，王海庆希望能对您有所帮助，限于作者水平有限，出错难免，欢迎拍砖！  
欢迎任何形式的转载，烦请注明装载，保留本段文字。  
本文原文链接，[http://blog.csdn.net/whqet/article/details/45219957][http_blog.csdn.net_whqet_article_details_45219957]  
欢迎大家访问独立博客[http://whqet.github.io][http_whqet.github.io]

[Link 1]: http://blog.csdn.net/whqet/article/details/24848605
[Link 2]: http://blog.csdn.net/whqet/article/details/25724179
[Link 3]: http://blog.csdn.net/whqet/article/details/45217929
[20150423121553929]: https://img-blog.csdn.net/20150423121553929
[20150423121553929 1]: /images/20220805/b7a05cc3d23540eaa2ad9b0d073941df.png
[20150423121629824]: https://img-blog.csdn.net/20150423121629824
[20150423121629824 1]: /images/20220805/fa2912a8e29d484db87b3f8fb77c7df6.png
[KERNTYPE]: http://type.method.ac/
[20150423122346790]: /images/20220805/40b1a27916ff47bcb651b9dd6564c06c.png
[20150423122605709]: /images/20220805/f69fafc298a44b8c8524590d303e9cff.png
[20150423123502958]: /images/20220805/cd995e6e83cf4b2bace10aaa4fa60a5f.png
[20150423123646502]: /images/20220805/77cab50e0fee4e8fb58e8bff82c4ec0f.png
[20150423123658451]: /images/20220805/ccc8a33e9ed8417fb7740162f7d4cd39.png
[20150423123551521]: /images/20220805/afdcac66cc2d42f9a9ec2656a4141d2c.png
[20150423123611714]: /images/20220805/c043ad1f87fe49da8609c157ad57af60.png
[20150423123510571]: /images/20220805/a5be3bd4328d4a1aa8766a97e6adf325.png
[20150423123520274]: /images/20220805/a2662638326b4e9daf9be94e71d08b3c.png
[20150423123603330]: /images/20220805/ef9a4706d3974860ab9671974194c494.png
[20150423125855499]: /images/20220805/c3d296d7e3374eda9d81434fea2974b4.png
[20150423125843060]: /images/20220805/2aba54b5d4cd4e65a2a45e9ec4e0a914.png
[20150423125909080]: /images/20220805/919bb7535b5f4b1986055139e43d1e09.png
[20150423130035667]: /images/20220805/8a9a59190709492eb063cfe30e105b41.png
[20150423125935210]: /images/20220805/26cfc6db7cb34c50864b357e5395c0ca.png
[20150423130122358]: /images/20220805/6d904164e8df4581b0f5ffdb27ca5ac2.png
[20150423130018048]: /images/20220805/49d83a52e8824f1695ac671d0bfe106d.png
[20150423130145493]: /images/20220805/da00173406fc4ac4b9acde74984ac000.png
[20150423130039030]: /images/20220805/056c77f450ac4c0a8a3677385bd3b5aa.png
[http_blog.csdn.net_whqet_article_details_45219957]: http://blog.csdn.net/whqet/article/details/45219957
[http_whqet.github.io]: http://whqet.github.io