【CSS】基于Jeolee模板的CSS DIY
本萌新!好像!会写CSS了!(醒醒你不会啊)
主要参考了某篇替换背景的博客,然后按照博主的指导尝试替换了网页中某些部件的font,padding,margin之类的玩意儿(好像是这些??完全不懂,标签和属性多得让人头大)。
下面贴代码(背景的地址随便加_(:з」∠)_,不过想显示的东西最好在图片右边):
body{
/* background: url(discard);
background-size: contain;*/
background: url(address);
background-size:cover;
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
height:100%;
}
#wrap {
position: relative;
margin-left: 100px;
margin-right: 0px;
text-align: left;
width: 932px;
height:100%;
}
#notemiddle{
min-height:1873px;
width:1167px;
}
#content{
font-size:20px;
width:800px;
padding-left: 26px;
}
.linex{
height:12px;
}
.date{
font-size:26px;
padding-bottom:18px;
font-family: Times New Roman,kaiti;
}
h2 a:link, h2 a:visited, h2 a:active {
font-family: Times New Roman,kaiti;
font-size: 20px;
color: rgba(25, 25, 25, 0.68);
margin-left: 30px;
}
h5 a:link, h5 a:visited, h5 a:active{
font-family: Times New Roman,kaiti;
font-size: 20px;
color: rgba(25, 25, 25, 0.68);
margin-left: 30px;
}
h5{
margin-bottom: 0px;
}
.c_b_p_desc {
font-size: 16px;
font-family: Times New Roman,kaiti;
text-indent: 32px;
color: rgba(10, 28, 97, 0.65);
}
A:visited {
color: #30f;
}
.author {
font-family: Times New Roman,kaiti;
font-size: 15px;
color: #266969;
font-weight: normal;
padding-top: 8px;
padding-bottom: 12px;
letter-spacing: -0.1px;
}
#menu {
margin-top:-86px;
font-size: 16px;
font-family: Times New Roman,kaiti;
color: #52126b;
line-height: 20px;
}
#header{
color:rgb(64, 3, 88);
font-weight:normal;
font-size:13px;
font-family:华文楷体;
text-shadow: 1px 1px 1px rgba(141, 31, 185, 0.72);
background-color:white;
height:52px;
padding-top: 5px;
padding-bottom: 21px;
}
#header h1 a {
font-size: 20px;
color: rgb(64, 3, 88);
font-family: 华文楷体;
text-shadow: 1px 1px 1px rgba(141, 31, 185, 0.72);
}
#menutop{
margin-top:-31px;
}
#menumiddle{
width: 222px;
padding-left: 20px;
margin-top:-20px;
}
h3 {
left: -15px;
padding-top: 7px;
padding-bottom: 2px;
padding-left: 20px;
font-family: Times New Roman,kaiti;
margin-top: 0px;
font-size: 20px;
margin-bottom: 5px;
background-color: #f9e6e6;
width: 180px;
}
#profile_block {
margin-bottom: 5px;
padding-left: 20px;
font-size: 16px;
}
#menu ul {
padding-left: 20px;
padding-right: 45px;
padding-top: 5px;
margin-bottom: 5px;
padding-bottom: 2px;
}
#menu a {
font-size: 16px;
font-family: Times New Roman,kaiti;
}
#menu li{
font-size=16px;
padding-bottom:0;
margin-bottom: 5px;
}
#cnblogs_post_body h1, .blog_comment_body h1 {
font-family:Times New Roman,华文楷体;
font-size: 28px;
width:800px;
}
#cnblogs_post_body h2, .blog_comment_body h2 {
font-family:Times New Roman,华文楷体;
font-size: 24px;
width:800px;
}
#cnblogs_post_body h3, .blog_comment_body h3 {
font-family:Times New Roman,华文楷体;
font-size: 20px;
width:600px;
margin-left:20px;
background-color:white;
}
#cnblogs_post_body h4, .blog_comment_body h4 {
font-family:Times New Roman,华文楷体;
font-size: 20px;
width:800px;
}
#cnblogs_post_body h5, .blog_comment_body h5 {
font-family:Times New Roman,华文楷体;
font-size: 18px;
width:800px;
}
#cnblogs_post_body h6, .blog_comment_body h6 {
font-family:Times New Roman,华文楷体;
font-size: 18px;
width:800px;
}
#BlogPostCategory {
margin-bottom: 12px;
font-size: 18px;
font-family: Times New Roman,kaiti;
}
#EntryTag {
padding-bottom: 5px;
font-family: Times New Roman,kaiti;
font-size: 18px;
}
#green_channel{
margin-left: auto;
}
#post_next_prev {
font-size: 16px;
font-family: Times New Roman,kaiti;
}
.comment_preview p, div.commentform p{
margin: 10px 0;
font-size: 16px;
font-family: Times New Roman,kaiti;
}
#commentform_title {
font-size: 20px;
font-family: Times New Roman,kaiti;
}
.commentbox_tab{
font-size: 21px;
font-family: Times New Roman,kaiti;
}
a:-webkit-any-link {
font-size:18px;
font-family:Times New Roman,kaiti;
}
#HistoryToday, .recomm-block {
font-family: Times New Roamn,kaiti;
font-size: 20px;
line-height:1.5;
}
.c_ad_block {
font-family: Times New Roamn,kaiti;
font-size: 20px;
}
div.newsItem>h3 {
display: none;
}
#notebottom{
top:0px;
}
.linex{
display:none;
}
#myposts .postDesc2 {
font-size: 18px;
font-family:Times new Roman,kaiti;
}
img.ushio{
transform:scale(0.9)
}
.ushio:hover {
transform:scale(1)
}
革命尚未成功,CSS之后还是要系统学的(你的Html还没学会啊ほら!)。