整点儿这边能用的CSS代码说明
参考资料
WA自定义教程 HTML颜色代码 CSS颜色代码 CSS字体加粗/斜体 CSS字体代码 W3school这个网站看起来很厉害,有很多种CSS代码模板可以参考,还有自带的测试框,可以用于检察代码是否可用。
一些常见的用语翻译
Background 背景 color颜色 Font 字体 Font-style 字体变斜体等的选项 normal 文本正常显示 italic 文本斜体显示 oblique 文本倾斜显示 Font-weight 字体重量(粗细) bold加粗 Lighter 变细 normal 一般
此项操作需在“自定义”后台中实现。 找到“自定义”中的“自定义CSS”一项后,将以下代码输入,并点击保存。
我在下方代码中加入了批注(汉字),在输入前请删除批注。
/*
BASICS Use the following CSS rules to change the elements you're trying to customize.
*/
body { background-color: #efefef; 背景色代码可百度 }
/* Blog header on index and post pages */ 页面大标题 #blog-title a { color: #fff; background-color: #7a629d; font-style:italic; }
#blog-title a:hover { color: #eee; background-color: #7a629d; }
/* Blog header on post pages ONLY */ body#post #blog-title a { padding: 4px 8px; }
/* Blog description (underneath title) on index page */ 博客描述(介绍语)的定义 header p.description { font-style: italic; 文章字体 斜体 }
/* Post titles on blog index */ .post-title { font-weight: normal; 字体加粗选项 } .post-title a.u-url:link, .post-title a.u-url:visited { color: blue; 发文中链接的颜色表示,可改为其他 }
/* “Read more...” links */ body#collection a.read-more { text-decoration: underline; }
/* Links inside blog posts */ article p a { color: #444[]; text-decoration: none; border-bottom: 2px solid orangered; } article p a:hover { background-color: orangered; color: white[]; text-decoration: none; }
/*
RECIPES These are common patterns you may want to use on your blog.
*/
/* Center images */ img { display: block; margin: 0 auto; }
/* Disable post header fade effect */ body#post header -moz-opacity: 1; -khtml-opacity: 1; -webkit-opacity: 1; opacity: 1; }
/* Hide post views */ header nav .views { display: none; }
前往mastodon @[email protected] 与我互动。 连载放置于 https://jiangshanghan.art.blog
本作品由 江尚寒 采用知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议进行许可。