常用css效果

a標籤的hover變色

.link{
	&:hover{
		color:red
	}
}

類名決定是否出現，能否使用動畫？

nav導航中的li元素中的a標籤，選中下方出現標識

  &.selected{
     color: #fff;
     &::after{
         content: '';
         display: block;
         width:100%;
         height:2px;
         background-color: red;
         position: relative;
         bottom:16px;
     }  
   }

使用keyframe實現元素旋轉效果

 .App-logo {
   animation: App-logo-spin infinite 20s linear;
 }
@keyframes App-logo-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

鼠標hover圖片放大

.item-cover-img{
        cursor: pointer;
        transition: all 0.6s;
        &:hover{
         transform:scale(1.3)
     }

文字超出部分顯示省略號

畫一條0.5px的線

<meta name="viewport" content="width=device-width, initial-scale=0.5, minimum-scale=0.5, maximum-scale=0.5"/>
或者：
transform: scale(0.5,0.5);