关于一些CSS常用技巧吧

1、使用CSS3 box-shadow制作同心圆：

.circle{
  width:10px;
  height:10px;
  border-radius:50%;
  background-color:black;
  box-shadow:0 0 0 3px red;
}

最后的效果：

image.png

有点像一只眼睛哈哈哈~
参考链接： https://blog.csdn.net/zhanglongdream/article/details/72773511

---

2、用HTML、CSS制作一个对话框尖角

首先理解一个元素的border分为top，right，bottom，left

image.png

代码：

image.png

于是我们想要的对话框尖角就要有了~
效果：

image.png

代码：

参考链接：https://blog.csdn.net/u010585448/article/details/51865829

---

3、关于min-height：100%的使用

.parent{
            width: 200px;
            height: 200px;
            background-color: red;
            overflow: auto;
            font-size: 14px;
        }
        .child{
            background-color: yellow;
        }

效果：

image.png

此时父元素的盖度大于子元素内容高度，背景色出现了断层，解决方法是给子元素加上min-height:100%;
效果：（高于父元素）

image.png

效果：（低于父元素）

image.png

代码：

    

        我是一个小孩，我的高度不确定，我有自己的背景色~我的父亲也有背景色~
        我的爸爸高100px,我想要内容高度低于父亲时，我的背景色是父亲的100%；
        还想要内容多于父亲高度时，父亲出滚动条，而我的高度是自己的高度~
    

记于2018年8月13日。不加班的夜晚哈哈哈