【CSS】CSS练习，改自己博客园

本文主要是介绍【CSS】CSS练习，改自己博客园，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

:root{
 
}

*{
    user-select: none;
}

body{  
  background-image: linear-gradient( 103.3deg,  rgba(252,225,208,1) 30%, rgba(255,173,214,1) 55.7%, rgba(162,186,245,1) 81.8% );
}

#navigator{

}

#navigator #navList{ 
    list-style: none;
    display: flex;
    justify-content: flex-start;
    flex-direction: row;  
}

#navigator #navList li{
    transition: .4s;
    border-radius: 8px;
    width: 80px;
    height: 40px;
    margin-left:5px; 
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;  
    cursor: pointer; 
    box-shadow: 
        inset 2px 2px 4px rgba(0,0,0,.1),
        inset -2px -2px 4px rgba(255,255,255,.1);
}
#navigator #navList li:hover{ 
    transition: .4s;
    box-shadow: 
        inset 2px 2px 4px rgba(255,255,255,.1),
        inset -2px -2px 4px rgba(0,0,0,.1),
        2px 2px 4px rgba(0,0,0,.1);
}
#navigator #navList li:active{ 
    transition: .4s;
    box-shadow: none;
} 
#navigator #navList li a{  
    color: #666;
    text-decoration: none;
} 
#navigator #navList li:hover{
    transition: .4s;
}

.blogStats{
    font-size: small;
    display: flex;
    justify-content: flex-end;
    padding-right: 60px;
}

.day{
    margin: 10px 40px;
    border-radius: 3px;
}

.day .postTitle,.day .postCon,.day .postDesc{
    margin-left: 20px;
    margin-right: 20px;
    padding: 0 40px;
    border-left: solid 1px #999;
    border-right: solid 1px #999;
}

.day .dayTitle{
    margin-top: 20px;
    font-weight: 700;;
    padding:10px;
}

.day .postTitle{
    padding-top: 20px;
    border-top: solid 1px #999;
}

.day .postCon{
    color:#666;
    font-size: small;
    display: flex; 
}

.day .postCon .c_b_p_desc{
    width: 100%;
   display: flex;
   flex-direction: column;
   
   justify-content: flex-end;
}

.day .postCon .c_b_p_desc a{ 
    text-align: end;
}

.day .postSeparator{
    height:10px;
}

 
.day .postDesc{ 
    color:#666;
    padding-top: 5px;
    border-bottom: solid 1px #999;
    padding-bottom: 20px;
    font-size: small;
    display: flex;
    display: flex;
    justify-content: flex-end;
 
}

.day .postDesc *{
    padding-left: 10px;
} 

这篇关于【CSS】CSS练习，改自己博客园的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！