渭水空藏月

渭水空藏月 查看完整档案

北京编辑哈尔滨远东理工学院  |  韩国语 编辑vobile  |  Java工程师 编辑 koalatail.com 编辑
编辑

for(int i=1;i<=4;i++)

    {
 for(int j=4;j>i;j--)
        {   
            System.out.print(" ");
        }

    for(int j=1;j<=(2*i-1);j++)
        {   
            System.out.print("*");
        }
        System.out.println();
    }

for(int i=1;i<=3;i++)

    {
        for(int j=1;j<=i;j++)
        {   
            System.out.print(" ");
        }
 for(int  j=6;j>(2*i-1);j--)
        {   
            System.out.print("*");
        }
        System.out.println();
    }
}

个人动态

渭水空藏月 赞了文章 · 9月1日

前端每日实战:34# 视频演示如何用纯 CSS 创作在文本前后穿梭的边框

图片描述

效果预览

按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。

https://codepen.io/comehope/pen/qYepNv

可交互视频教程

此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。

请用 chrome, safari, edge 打开观看。

https://scrimba.com/p/pEgDAM/cQ73Vt8

源代码下载

每日前端实战系列的全部源代码请从 github 下载:

https://github.com/comehope/front-end-daily-challenges

代码解读

定义 dom,容器中包含文本:

<div class="warning">ERROR 404</div>

居中显示:

body {
  margin: 0;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgb(20%, 20%, 20%);
}

定义文字样式:

.warning {
    color: whitesmoke;
    font-size: 100px;
    font-family: sans-serif;
    font-weight: bold;
}

用伪元素定义边框尺寸:

.warning {
    position: relative;
    padding: 0.6em 0.4em;
}

.warning::before,
.warning::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0.2em solid;
    box-sizing: border-box;
}

把边框分为两部分,拼在一起:

.warning::before,
.warning::after {
    border: 0.2em solid transparent;
    color: orangered;
}

.warning::before {
    border-top-color: currentColor;
    border-right-color: currentColor;
}

.warning::after {
    border-bottom-color: currentColor;
    border-left-color: currentColor;
}

把上边框和右边框下沉一层:

.warning::before {
    z-index: -1;
}

为下边框和在边框加上阴影:

.warning::after {
    box-shadow: 0.3em 0.3em 0.3em rgba(20%, 20%, 20%, 0.8);
}

最后,让边框转起来:

.warning::before,
.warning::after {
    animation: rotating 10s infinite;
}

@keyframes rotating {
    to {
        transform: rotate(360deg);
    }
}

大功告成!

查看原文

赞 10 收藏 8 评论 0

渭水空藏月 收藏了文章 · 9月1日

前端每日实战:34# 视频演示如何用纯 CSS 创作在文本前后穿梭的边框

图片描述

效果预览

按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。

https://codepen.io/comehope/pen/qYepNv

可交互视频教程

此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。

请用 chrome, safari, edge 打开观看。

https://scrimba.com/p/pEgDAM/cQ73Vt8

源代码下载

每日前端实战系列的全部源代码请从 github 下载:

https://github.com/comehope/front-end-daily-challenges

代码解读

定义 dom,容器中包含文本:

<div class="warning">ERROR 404</div>

居中显示:

body {
  margin: 0;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgb(20%, 20%, 20%);
}

定义文字样式:

.warning {
    color: whitesmoke;
    font-size: 100px;
    font-family: sans-serif;
    font-weight: bold;
}

用伪元素定义边框尺寸:

.warning {
    position: relative;
    padding: 0.6em 0.4em;
}

.warning::before,
.warning::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0.2em solid;
    box-sizing: border-box;
}

把边框分为两部分,拼在一起:

.warning::before,
.warning::after {
    border: 0.2em solid transparent;
    color: orangered;
}

.warning::before {
    border-top-color: currentColor;
    border-right-color: currentColor;
}

.warning::after {
    border-bottom-color: currentColor;
    border-left-color: currentColor;
}

把上边框和右边框下沉一层:

.warning::before {
    z-index: -1;
}

为下边框和在边框加上阴影:

.warning::after {
    box-shadow: 0.3em 0.3em 0.3em rgba(20%, 20%, 20%, 0.8);
}

最后,让边框转起来:

.warning::before,
.warning::after {
    animation: rotating 10s infinite;
}

@keyframes rotating {
    to {
        transform: rotate(360deg);
    }
}

大功告成!

查看原文

渭水空藏月 收藏了文章 · 9月1日

前端每日实战:26# 视频演示如何用不到 50 行 CSS 代码,创作按钮被从纸上掀起的立体效果

图片描述

效果预览

按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。

https://codepen.io/comehope/pen/KRbXGe

可交互视频教程

此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。

请用 chrome, safari, edge 打开观看。

https://scrimba.com/c/c3e8dCB

源代码下载

每日前端实战系列的全部源代码请从 github 下载:

https://github.com/comehope/front-end-daily-challenges

代码解读

定义 dom,标准的导航版式:

<nav>
    <ul>
        <li>Home</li>
    </ul>
</nav>

居中显示:

html, body {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(cadetblue, darkcyan);
}

设置容器的样式,把背景色声明为变量:

nav {
    width: 300px;
    height: 300px;
    --bgcolor: lemonchiffon;
    background-color: var(--bgcolor);
    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    padding: 30px 0;
    box-sizing: border-box;
}

去掉列表符,让菜单项居中显示:

nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

设置菜单项的文字样式:

nav ul li {
    color: brown;
    font-size: 20px;
    font-family: sans-serif;
}

为菜单项增加鼠标划过效果:

nav ul li {
    padding: 0.5em 1em;
    border-radius: 0.5em;
    transition: 0.5s ease-out;
}

nav ul li:hover {
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1),
                0 6px 6px rgba(0, 0, 0, 0.1),
                0 8px 8px rgba(0, 0, 0, 0.1),
                0 12px 12px rgba(0, 0, 0, 0.1);
    transform: scale(1.05) translateY(-0.25em) perspective(300px) rotateX(20deg) ;
}

dom 中再增加几个菜单项:

<nav>
    <ul>
        <li>Home</li>
        <li>Products</li>
        <li>Services</li>
        <li>Contact</li>
    </ul>
</nav>

最后,调整一下菜单项布局:

nav ul {
    justify-content: space-between;
    flex-direction: column;
}

大功告成!

查看原文

渭水空藏月 收藏了文章 · 9月1日

前端每日实战:12# 视频演示如何用纯 CSS 创作一种文字断开的交互特效

图片描述

效果预览

按下右侧的“点击预览”按钮在当前页面预览,点击链接全屏预览。

https://codepen.io/zhang-ou/pen/LmjNgL

可交互视频教程

此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。

请用 chrome, safari, edge 打开观看。

https://scrimba.com/c/c2EvWHN

源代码下载

请从 github 下载。

https://github.com/comehope/front-end-daily-challenges/tree/master/012-broken-text-effects

代码解读

定义 dom,只有一个元素,元素有一个 data-text 属性,属性值等于元素内的文本:

<div class="text" data-text="BREAK">BREAK</div>

居中显示:

html, body {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

设置渐变背景色:

body {
    background: linear-gradient(brown, sandybrown);
}

设置文本的字体字号:

.text {
    font-size: 5em;
    font-family: "arial black";
}

利用伪元素增加文字:

.text {
    position: relative;
}

.text::before,
.text::after {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    color: lightyellow;
}

设置左侧文字的遮罩:

.text::before {
    background-color: darkgreen;
    clip-path: polygon(0 0, 60% 0, 30% 100%, 0 100%);
}

设置右侧文字的背景和遮罩:

.text::after {
    background-color: darkblue;
    clip-path: polygon(60% 0, 100% 0, 100% 100%, 30% 100%);
}

当鼠标划过时,遮罩的文字分别向两侧偏移:

.text::before,
.text::after {
    transition: 0.2s;
}

.text:hover::before {
    left: -0.15em;
}

.text:hover::after {
    left: 0.15em;
}

隐藏辅助元素,包括原始文字和伪元素的背景色:

.text {
    color: transparent;
}

.text::before {
    /*background-color: darkgreen;*/
}

.text::after {
    /*background-color: darkblue;*/
}

两侧文字增加歪斜效果:

.text:hover::before {
    transform: rotate(-5deg);
}

.text:hover::after {
    transform: rotate(5deg);
}

微调文字的高度:

.text:hover::before {
    top: -0.05em;
}

.text:hover::after {
    top: 0.05em;
}

大功告成!

知识点

查看原文

渭水空藏月 收藏了文章 · 7月1日

前端每日实战:109# 视频演示如何用 CSS 和 D3 创作一个用文字组成的心形图案

图片描述

效果预览

按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。

https://codepen.io/comehope/pen/xJvERW

可交互视频

此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。

请用 chrome, safari, edge 打开观看。

https://scrimba.com/p/pEgDAM/cm94eu6

源代码下载

每日前端实战系列的全部源代码请从 github 下载:

https://github.com/comehope/front-end-daily-challenges

代码解读

定义 dom,容器中包含 3 个子元素,每个子元素中有一个单词:

<div class="love">
    <span>aaa</span>
    <span>bbb</span>
    <span>ccc</span>
</div>

居中显示:

body {
    margin: 0;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: black;
}

定义容器尺寸:

.love {
    width: 450px;
    height: 450px;
}

设置文本样式:

.love {
    position: relative;
}

.love span {
    position: absolute;
    left: 0;
    color: goldenrod;
    font-size: 20px;
    font-family: sans-serif;
    text-shadow: 0 0 1em white;
}

定义文本左右往复移动的动画:

.love span {
    animation: x-move 10s ease-in-out infinite alternate;
}

@keyframes x-move {
    to {
        left: 450px;
    }
}

定义子元素的下标变量,设置动画延时,使各单词依次入场:

.love {
    --particles: 3;
}

.love span {
    animation-delay: calc(20s / var(--particles) * var(--n) * -1);
}

.love span:nth-child(1) {
    --n: 1;
}

.love span:nth-child(2) {
    --n: 2;
}

.love span:nth-child(3) {
    --n: 3;
}

增加文本沿心形运动的动画效果:

.love span {
    animation: 
        x-move 10s ease-in-out infinite alternate,
        y-move 20s linear infinite;
}

@keyframes y-move {
    0% { transform: translateY(180px); }
    10% { transform: translateY(45px); }
    15% { transform: translateY(5px); }
    18% { transform: translateY(0); }
    20% { transform: translateY(5px); }
    22% { transform: translateY(35px); }
    24% { transform: translateY(65px); }
    25% { transform: translateY(110px); }
    26% { transform: translateY(65px); }
    28% { transform: translateY(35px); }
    30% { transform: translateY(5px); }
    32% { transform: translateY(0); }
    35% { transform: translateY(5px); }
    40% { transform: translateY(45px); }
    50% { transform: translateY(180px); }
    71% { transform: translateY(430px); }
    72.5% { transform: translateY(440px); }
    75% { transform: translateY(450px); }
    77.5% { transform: translateY(440px); }
    79% { transform: translateY(430px); }
    100% { transform: translateY(180px); }
}

接下来用 d3 批量处理 dom 元素和 css 变量。
引入 d3 库:

<script data-original="https://d3js.org/d3.v5.min.js"></script>

声明一个数组,包含若干单词:

const words = ['aaa', 'bbb', 'ccc'];

用 d3 创建 dom 元素:

d3.select('.love')
    .selectAll('span')
    .data(words)
    .enter()
    .append('span')
    .text((d) => d);

用 d3 为 css 变量赋值:

d3.select('.love')
    .style('--particles', words.length)
    .selectAll('span')
    .data(words)
    .enter()
    .append('span')
    .style('--n', (d, i) => i + 1)
    .text((d) => d);

删除 html 文件中相关的 dom 元素和 css 文件中相关的 css 变量。

把数组元素改为“爱”在各种语言的单词:

const words = [
    '愛', 'Love', 'Amour', 'Liebe', 'Amore',
    'Amor', 'Любовь', 'الحب', 'प्यार', 'Cinta',
    'Αγάπη', '사랑', 'Liefde', 'Dashuri', 'Каханне',
    'Ljubav', 'Láska', 'Armastus', 'Mahal', 'אהבה', 
    'Szerelem', 'Grá', 'Mīlestība', 'Meilė', 'Любов', 
    'Љубовта', 'Cinta', 'عشق', 'Dragoste', 'Láska', 
    'Renmen', 'ፍቅር', 'munaña', 'Sevgi', 'Љубав', 
    'karout', 'amà', 'amôr', 'kærleiki', 'mborayhu', 
    'Upendo', 'sòòyayyàà', 'ljubav', 'Սեր', 'сүю', 
    'сүйүү', 'tia', 'aroha', 'KHAIR', 'प्रेम', 
    'kjærlighet', 'munay', 'jecel', 'Kärlek', 'soymek', 
    'Mahal', 'ярату', 'محبت', 'sopp', 'uthando', 
    'ความรัก', 'Aşk', 'Tình yêu', 'ליבע'];

最后,为第 1 个单词设置特殊的文字样式:

.love span:first-child {
    color: orangered;
    font-size: 3em;
    text-shadow: 
        0 0 0.1em black,
        0 0 1em white;
    z-index: 1;
}

大功告成!

查看原文

渭水空藏月 收藏了文章 · 7月1日

前端每日实战:65# 视频演示如何用纯 CSS 创作一个摇摇晃晃的 loader

图片描述

效果预览

按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。
https://codepen.io/comehope/pen/oyJvpe

可交互视频

此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。

请用 chrome, safari, edge 打开观看。
https://scrimba.com/p/pEgDAM/cqwpQh7

源代码下载

每日前端实战系列的全部源代码请从 github 下载:
https://github.com/comehope/front-end-daily-challenges

代码解读

定义 dom,容器中包含一个子元素,子元素内是文字:

<div class="loader">
    <span>Loading...</span>
</div>

居中显示:

body {
    margin: 0;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: black;
}

定义容器尺寸:

.loader {
    width: 10em;
    height: 10em;
    font-size: 30px;
    box-sizing: border-box;
}

设置文字样式:

.loader span {
    position: absolute;
    color: white;
    width: inherit;
    height: inherit;
    text-align: center;
    line-height: 10em;
    font-family: sans-serif;
}

画出组成圆的顶部弧线:

.loader {
    border-top: 0.3em solid hotpink;
    border-radius: 50%;
}

用伪元素画出组成圆的另外 2 条弧线:

.loader {
    position: relative;
}

.loader::before,
.loader::after {
    content: '';
    position: absolute;
    width: inherit;
    height: inherit;
    border-radius: 50%;
    box-sizing: border-box;
    top: -0.2em;
}

.loader::before {
    border-top: 0.3em solid dodgerblue;
    transform: rotate(120deg);
}

.loader::after {
    border-top: 0.3em solid gold;
    transform: rotate(240deg);
}

定义动画效果:

@keyframes rotating {
    50% {
        transform: rotate(calc(180deg * var(--direction)));
    }

    100% {
        transform: rotate(calc(360deg * var(--direction)));
    }
}

把动画效果应用到圆上:

.loader {
    animation: rotating 2s ease-in-out infinite;
    --direction: 1;
}

把动画效果应用到文字上:

.loader span {
    animation: rotating 2s linear infinite;
    --direction: -1;
}

最后,隐藏可能超出窗口的内容:

body {
    overflow: hidden;
}

大功告成!

查看原文

渭水空藏月 赞了文章 · 7月1日

前端每日实战:65# 视频演示如何用纯 CSS 创作一个摇摇晃晃的 loader

图片描述

效果预览

按下右侧的“点击预览”按钮可以在当前页面预览,点击链接可以全屏预览。
https://codepen.io/comehope/pen/oyJvpe

可交互视频

此视频是可以交互的,你可以随时暂停视频,编辑视频中的代码。

请用 chrome, safari, edge 打开观看。
https://scrimba.com/p/pEgDAM/cqwpQh7

源代码下载

每日前端实战系列的全部源代码请从 github 下载:
https://github.com/comehope/front-end-daily-challenges

代码解读

定义 dom,容器中包含一个子元素,子元素内是文字:

<div class="loader">
    <span>Loading...</span>
</div>

居中显示:

body {
    margin: 0;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: black;
}

定义容器尺寸:

.loader {
    width: 10em;
    height: 10em;
    font-size: 30px;
    box-sizing: border-box;
}

设置文字样式:

.loader span {
    position: absolute;
    color: white;
    width: inherit;
    height: inherit;
    text-align: center;
    line-height: 10em;
    font-family: sans-serif;
}

画出组成圆的顶部弧线:

.loader {
    border-top: 0.3em solid hotpink;
    border-radius: 50%;
}

用伪元素画出组成圆的另外 2 条弧线:

.loader {
    position: relative;
}

.loader::before,
.loader::after {
    content: '';
    position: absolute;
    width: inherit;
    height: inherit;
    border-radius: 50%;
    box-sizing: border-box;
    top: -0.2em;
}

.loader::before {
    border-top: 0.3em solid dodgerblue;
    transform: rotate(120deg);
}

.loader::after {
    border-top: 0.3em solid gold;
    transform: rotate(240deg);
}

定义动画效果:

@keyframes rotating {
    50% {
        transform: rotate(calc(180deg * var(--direction)));
    }

    100% {
        transform: rotate(calc(360deg * var(--direction)));
    }
}

把动画效果应用到圆上:

.loader {
    animation: rotating 2s ease-in-out infinite;
    --direction: 1;
}

把动画效果应用到文字上:

.loader span {
    animation: rotating 2s linear infinite;
    --direction: -1;
}

最后,隐藏可能超出窗口的内容:

body {
    overflow: hidden;
}

大功告成!

查看原文

赞 35 收藏 28 评论 4

渭水空藏月 赞了文章 · 7月1日

前端每日实战:苦练 CSS 基本功——图解辅助线的原理和画法

头图.png

在用 CSS 进行绘图和布局时,除了借助浏览器开发工具之外,还经常需要绘制一些辅助线,以便定位参考。今天就以第 170 号作品中使用的网格线为例,详细讲解一下辅助线的原理和画法。

为了使辅助线明显可见,把线的颜色设置为和背景对比强烈的白色,并且线也粗一些,在实际使用时,你应该降低辅助线与背景的对比并且使用细线。

分步图解

1、定义容器

div {
    font-size: 50px;
    width: 6em;
    height: 4em;
    background-color: teal;
}

假设你有一个 <div> 容器,容器里是否有元素都可以,当前演示为了突显辅助线,暂时让容器里空空如也:

01.png

2、一条基本的横线

div {
    background-image: linear-gradient(to bottom, transparent 95%, white 95%);
}

网格线是一条一条线条组成的,所以要先画出一条线,它的95%都是透明的,只有5%是白色的:

02.png

3、一条有尺寸的横线

div {
    background-size: 1em 1em;
    background-repeat: no-repeat;
}

请把绘制网格线想象成是铺地砖,首先要定义地砖的尺寸,这里用 1em 1em 定义了一块方砖,同时让砖块不重复,所以只显示出了孤单的一块砖:

03.png

4、横向平铺地砖

div {
    background-repeat: repeat-x;
}

如果把地砖横向平铺,就能组合成一条水平线:

04.png

5、纵向平铺地砖

div {
    background-repeat: repeat-y;
}

如果把地砖纵向平铺,就能组合成一条垂直线。
错!
纵向平铺是像阶梯一样的效果:

05.png

6、横向和纵向同时平铺地砖

div {
    background-repeat: repeat;
}

横向和纵向同时平铺,就是像作业本一样的多条横线效果。注意,这时最顶端是没有线的:

06.png

7、竖线平铺效果

div {
    background-image: linear-gradient(to right, transparent 95%, white 95%);
    background-size: 1em 1em;
    background-repeat: repeat;
}

假如把地砖换成向右的竖线,即只把 to bottom 改为 to right ,其他不变,绘制出的就是一排一排的竖线。同样注意,这时最左边是没有线的:

07.png

8、不完美的网格线

div {
    background-image:
        linear-gradient(to bottom, transparent 95%, white 95%),
        linear-gradient(to right, transparent 95%, white 95%);
    background-size: 1em 1em;
    background-repeat: repeat;
}

把第6步和第7步合并起来,网格线基本成型了,不过顶端和左端还缺少线条:

08.png

9、一段顶端线

div {
    background-image: 
        linear-gradient(to top, transparent 95%, white 95%);
    background-size: 1em 1em;
    background-repeat: no-repeat;
}

来解决顶端线的问题,先画出一段顶端线。这段代码和第3步极相似,仅仅是 to bottom 改成了 to top

09.png

10、一条顶端线

div {
    background-repeat: repeat-x;
}

把这一段顶端线水平平铺,就是一条定位在顶部的水平线:

10.png

11、一段左端线

div {
    background-image: 
        linear-gradient(to left, transparent 95%, white 95%);
    background-size: 1em 1em;
    background-repeat: no-repeat;
}

用类似的办法解决左端线问题,先定义一段左端线,注意 linear-gradient 函数的第 1 个参数改成 to left 了:

11.png

12、一条左端线

div {
    background-repeat: repeat-y;
}

平铺这段左端线,就得到了一条紧挨容器左侧的竖线:

12.png

13、All in one 的完美效果

div:nth-child(13) {
    background-image: 
        linear-gradient(to bottom, transparent 95%, white 95%),
        linear-gradient(to right, transparent 95%, white 95%),
        linear-gradient(to top, transparent 95%, w hite 95%),
        linear-gradient(to left, transparent 95%, white 95%);
    background-size: 1em 1em;
    background-repeat: repeat, repeat, repeat-x, repeat-y;

好了,我们把第8步不完美的网格线、顶端线、左端线都合起来,就是完美的网格线了,注意 background-repeart 的写法,它有 4 个参数,分别对应 background-image 里的 4 条线:

13.png

干得漂亮!收工。

参考

  • 《CSS3 艺术》第4.1.2节,背景图片 background-image
  • 《CSS3 艺术》第4.1.4节,背景尺寸 background-size
  • 《CSS3 艺术》第4.1.5节,背景平铺 background-repeat
  • 《CSS3 艺术》第4.2节,线性渐变 linear-gradient()
查看原文

赞 67 收藏 44 评论 5

渭水空藏月 赞了回答 · 2019-11-15

解决使用大量代理服务器爬谷歌搜索引擎的搜索结果需要存cookie吗?

cookie的目的是为了记住当前的访问用户,而你现在并需要让谷歌记住你,所以不需要存cookie

关注 2 回答 1

渭水空藏月 提出了问题 · 2019-08-08

解决使用大量代理服务器爬谷歌搜索引擎的搜索结果需要存cookie吗?

我是用java写的这个插件,因为公司的老项目需要用jar包式的插件来获取搜索结果页面提取链接

关注 2 回答 1

认证与成就

  • 获得 9 次点赞
  • 获得 6 枚徽章 获得 0 枚金徽章, 获得 1 枚银徽章, 获得 5 枚铜徽章

擅长技能
编辑

开源项目 & 著作
编辑

(゚∀゚ )
暂时没有

注册于 2017-03-30
个人主页被 198 人浏览