css样式的意义？

Question

 cite:before {

      content: '';

      position: absolute;

      right: 7px;

      bottom: 7px;

      width: 0;

      height: 0;

      border-width: 4px;

      border-style: solid;

      border-color: #888 transparent transparent transparent;

      transition: all 0.2s;

      -webkit-transition: all 0.2s;

      -moz-transition: all 0.2s;

      -o-transition: all 0.2s;

      -ms-transition: all 0.2s;

      transform-origin: 50% 25%;

      -ms-transform-origin: 50% 25%;

      -moz-transform-origin: 50% 25%;

      -webkit-transform-origin: 50% 25%;

      -o-transform-origin: 50% 25%;

    }

   .extended cite:before {

      transform: rotate(180deg);

      -webkit-transform: rotate(180deg);

      -moz-transform: rotate(180deg);

      -o-transform: rotate(180deg);

      -ms-transform: rotate(180deg);

    }   

这两段代码是什么意思？

Answer 1

before 是在标签的前面加东西；然后定义高宽，上右边距；transition是动画展开，这么多行是为了兼容不同的浏览器transform是旋转，这么多行的也是兼容

Answer 2

：before（伪类元素选择器）与  content"";一起用， content"";是一个空的；{}border-width: 4px;      border-style: solid;      border-color: #888 transparent transparent transparent;}上段代码是一个上三角图案；{position: absolute;      right: 7px;      bottom: 7px;}上段代码则是移动三角图案transition: all 0.2s;这是过度元素所有属性都是0.2s内执行transform-origin: 50% 25%;圆心的确定  transform: rotate(180deg)顺时针旋转180度；你这段代码的意思是：   ∴在0.2内变为∵

Answer 3

伪元素，这东西在别人的网站代码上看到有，但是自己基本没怎么用过啊，了解太少了。