.nav{border-radius: 5px;box-shadow:5px 5px 0 #cc1725;}
.nav li:after{content: "";width: 2px; height: 15px; background: linear-gradient(to bottom,#dd2926,#a82724,#dd2926);
display: block; top: 19px; right: -3px; position: absolute;}
.nav li:last-child:after{background: none;}
.nav li:after{content: "";width: 2px; height: 15px; background: linear-gradient(to bottom,#dd2926,#a82724,#dd2926);
display: block; top: 19px; right: -3px; position: absolute;}
.nav li:last-child:after{background: none;}
2018-08-21
word-wrap:break-word和word-break:break-all的區別詳見:http://www.cnblogs.com/2050/archive/2012/08/10/2632256.html
2018-08-13
<style>
div:empty {
border: 1px solid green;
}
</style>
div:empty {
border: 1px solid green;
}
</style>
2018-08-11
有關border-image的詳細解釋
http://www.zhangxinxu.com/wordpress/2010/01/css3-border-image/
http://www.tuicool.com/articles/EJZnUnm
http://www.zhangxinxu.com/wordpress/2010/01/css3-border-image/
http://www.tuicool.com/articles/EJZnUnm
2018-08-10
這三種不同寫法可作參考
.wrapper > div:nth-of-type(2n+1),
.wrapper > p:nth-of-type(2n){
background: orange;
}
/*或者*/
.wrapper > div:nth-first-child(4n+1),
.wrapper > p:nth-of-type(2n){
background: orange;
}
/*或者*/
.wrapper > div:nth-last-child(2n+1),
.wrapper > p:nth-of-type(even){
background: orange;
}
.wrapper > div:nth-of-type(2n+1),
.wrapper > p:nth-of-type(2n){
background: orange;
}
/*或者*/
.wrapper > div:nth-first-child(4n+1),
.wrapper > p:nth-of-type(2n){
background: orange;
}
/*或者*/
.wrapper > div:nth-last-child(2n+1),
.wrapper > p:nth-of-type(even){
background: orange;
}
2018-08-08
/*使用偽元素制作導航列表項分隔線*/
.nav li:after{content:"";position:absolute;right:-2px;height:15px;width:1px;
top:18px;background-image:linear-
gradient(rgba(255,255,255,0.1),rgba(000,000,000,0.3),rgba(255,255,255,0.1));
}
/*刪除第一項和最后一項導航分隔線*/
.nav li:last-child:after{content:"";background-image:none;}
.nav li:after{content:"";position:absolute;right:-2px;height:15px;width:1px;
top:18px;background-image:linear-
gradient(rgba(255,255,255,0.1),rgba(000,000,000,0.3),rgba(255,255,255,0.1));
}
/*刪除第一項和最后一項導航分隔線*/
.nav li:last-child:after{content:"";background-image:none;}
2018-08-08
h2,p:nth-child(2n+1){
-webkit-column-span:all;
-moz-column-span:all;
-o-column-span:all;
-ms-column-span:all;
column-span:all;
}
-webkit-column-span:all;
-moz-column-span:all;
-o-column-span:all;
-ms-column-span:all;
column-span:all;
}
2018-08-07
真是,要實戰的話有付費的啊,免費的講的已經不錯了,難道以后自己做網頁還要別人告訴你嗎?拜托,學人家的就是學生,說這種話真的是······呵呵了。
2018-07-13
這里的h2和p:nth-child(2n)才是并列關系,也就是說是對h2進行跨越所有的列,而不是對h2:nth-child(2n)
2018-07-13
.wrapper div:hover
.wrapper:hover div的區別在于鼠標點擊div之外,wrapper之內的區域時,會不會發生放縮的變化,這也就是會閃爍的原因。前者當鼠標放在該區域時,會發生閃爍的效果;后者則不會產生什么變化。
.wrapper:hover div的區別在于鼠標點擊div之外,wrapper之內的區域時,會不會發生放縮的變化,這也就是會閃爍的原因。前者當鼠標放在該區域時,會發生閃爍的效果;后者則不會產生什么變化。
2018-07-13
這里的主要思想就是通過target偽類去獲取相應的id,并在CSS中進行樣式設定,和直接應用id進行樣式設定的區別在于這里要加上鏈接,而且鏈接里的href里的內容是在id里內容的基礎上添加一個#
2018-07-12