前端学习无论如何都必须要学会制作的简单效果（动图展示）

line-height: 20px;

color: #333;

}

.con::before {

content: ‘’;

width: 0;

height: 0;

position: absolute;

top: 28px;

left: 18px;

border: 8px solid #000;

border-style: solid dashed dashed;

border-color: #fff transparent transparent;

}

123

效果：

三、注册页面判断输入密码长度效果

---

请输入6~16位密码

效果：

四、输入密码框的显示隐藏密码效果

---

效果：

五、物品全选反选效果

---

商品 价钱 苹果 8 香蕉 3 龙眼 9 菠萝蜜 22