一个直接可用的文章页小模板
做博客模板最容易犯的错误是一上来就堆组件。其实文章页只需要五个区块:标题、元信息、正文、标签、相关文章,把这几块做扎实,页面就已经够用了。
标题区放一行 h1 加一句摘要就够;元信息一行放下日期、分类、浏览量,字号小一号、颜色淡一点。
正文宽度建议限制在 42em 左右,行高 1.8,段间距略大于行距,中文长文阅读会舒服很多。代码块用等宽字体加浅底色,别加花哨的边框。
标签一行小链接即可;相关文章取同分类最新几篇,只放标题和日期,不放缩略图,加载快也不显得乱。
配色全部收进 CSS 变量,换主题只改变量;其余样式能少写就少写,模板越简单,改版时越不容易散架。
这套骨架在本站文章页里已经跑了一段时间,需要完整源码的话在评论区说一声。