[1092] 前端技術入門
@import url("https://schoolweb.tn.edu.tw/uploads/fonts/woff2.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@600&display=swap');
@font-face {
font-family: SweiSpikeLegCJKtc-Regular;
src: url(https://cdn.jsdelivr.net/gh/max32002/[email protected]/WebFont/CJK%20TC/SweiSpikeLegCJKtc-Regular.woff2) format("woff2"), url(https://cdn.jsdelivr.net/gh/max32002/[email protected]/WebFont/CJK%20TC/SweiSpikeLegCJKtc-Regular.woff) format("woff");
}
@font-face {
font-family: naikaifont;
src: url(https://cdn.jsdelivr.net/gh/max32002/[email protected]/webfont/NaikaiFont-Regular-Lite.woff2) format("woff2"), url(https://cdn.jsdelivr.net/gh/max32002/[email protected]/webfont/NaikaiFont-Regular-Lite.woff) format("woff");
}
body {
background:
url(../images/tree_t.png) no-repeat top left,
url(../images/tree_b.png) no-repeat bottom left,
url(../images/tree_m.png) repeat-y top left,
url(../images/tree_b_r.png) repeat-x bottom left,
url(../images/bg_s.png) ;
}
header{
margin-top: 300px;
}
#nav {
background: #A5BB8F;
}
aside {
background: #dadec58f;
border-radius: 8px;
min-height: 450px !important;
}
article {
/* min-height: 450px !important; */
}
#footer {
/* background: #A5BB8F; */
min-height: 150px;
}
.my-container-width {
max-width: 1350px;
}
.block {
/* margin-top: 1rem;
margin-bottom: 3rem; */
margin: 1rem 0 3rem;
}
/* .blockTitle {
color: rgba(48, 113, 150, 0.562);
font-family: naikaifont, SweiSpikeLegCJKtc-Regular, "Noto Serif TC", sans-serif, mnyylti, Mamelon;
} */
.blockHead {
text-align: center;
position: relative;
}
#page_center .blockHead {
text-align: left;
padding-left: 1.85rem;
}
.blockTitle {
font-family: naikaifont;
color: #ffffff;
height: 40px;
font-size: 1.5rem;
}
.bbg1 {
text-shadow: 0px 2px #804454, 2px 0px #804454, -2px 0px #804454, 0px -2px #804454, -2px -2px #804454, 2px 2px #804454, 2px -2px #804454, -2px 2px #804454;
background: url(../images/bbg1.png) no-repeat;
}
.bbg2 {
text-shadow: 0px 2px #36626b, 2px 0px #36626b, -2px 0px #36626b, 0px -2px #36626b, -2px -2px #36626b, 2px 2px #36626b, 2px -2px #36626b, -2px 2px #36626b;
background: url(../images/bbg2.png) no-repeat;
}
.bbg3 {
text-shadow: 0px 2px #6b6b1e, 2px 0px #6b6b1e, -2px 0px #6b6b1e, 0px -2px #6b6b1e, -2px -2px #6b6b1e, 2px 2px #6b6b1e, 2px -2px #6b6b1e, -2px 2px #6b6b1e;
background: url(../images/bbg3.png) no-repeat;
}
.bbg4 {
text-shadow: 0px 2px #3c583d, 2px 0px #3c583d, -2px 0px #3c583d, 0px -2px #3c583d, -2px -2px #3c583d, 2px 2px #3c583d, 2px -2px #3c583d, -2px 2px #3c583d;
background: url(../images/bbg4.png) no-repeat;
}
@media only screen and (max-width: 768px) {
#page_center .blockHead, .blockHead {
text-align: left;
padding-left: 30%;
}
}
a:link{
color: rgb(36, 139, 100);
}
a:visited{
color: rgb(14, 53, 38);
}
a:hover{
text-decoration: none;
}
p::selection, div::selection{
background: tomato;
color:white;
}
.blockTitle {
display: inline-block;
padding-right: 2rem;
}
.block:hover .blocktool {
position: absolute;
content: url(../images/settings.png);
}