CSS 日常项目中的笔记整理(持续整理)

1. 用CSS画一个三角形

方法一:隐藏上,左,右三条边,颜色设定为(transparent)

css:

    * {margin: 0; padding: 0;}

    .content {

        width: 0;

        height: 0;

        margin: 0 auto;

        border-width: 20px;

        border-style: solid;

        border-color: transparent transparent pink transparent;  // 对应上右下左,此处为 下 粉色

    }

html:

    

 

方法二: 采用的是均分原理

css:

    * {margin: 0; padding: 0;}

    .content {

        width:0;

        height:0;

        margin:0 auto;

        border:50px solid transparent;

        border-top: 50px solid pink;

    }

html:

    

 

 

 

 

你可能感兴趣的:(项目笔记,学习日记)