CSS simulates click event——css simulates focus event——css downward corner mark display——flex layout

CSS simulate click event

.modify:active div{
    
    
  color: red;
}
.singout:active div{
    
    
  color: red;
}

css simulate focus event

&:focus-within {
    
     //激活样式
  border: 1px solid #d57da7;
}
&:focus-within .icno_usename {
    
     //激活样式
  background: url("../images/use_active.png") no-repeat;
  background-size: 100% 100%;
}

css downward subscript display

.to_bottom {
    
    
   position: absolute;
   top:90px;
   left: 45px;
   width: 0;
   height: 0;
   border-top: 10px solid #FFFFFF;;
   border-left: 10px solid transparent;
   border-right: 10px solid transparent;
 }

Rules for using flex

Rules for using flex