今天想折腾一下素材网站模板这个事，主要是因为前两天接了个小活，对方要个简单的展示页面，催得急，我就琢磨着能不能找个现成的模板改改。

开头完全没头绪

我先在平时用的几个资源站瞎翻，结果发现模板是多，但分类太乱了。有的叫“企业官网”，有的叫“个人博客”，点进去一看，里面啥素材都有，图片、图标、字体混在一块，找起来特别费劲。我挨个下载了几个免费的，解压完一看，好家伙，里面文件一大堆，光CSS文件夹就有三四个，根本分不清哪个是管哪部分的。

试着整理归类

后来我干脆把所有下载的模板都扔到一个文件夹里，按类型手动分类：

• 纯展示型的：这种就几张图加文字，结构简单，但样式太老气；
• 带后台功能的：里面一堆PHP文件，我压根不会改，直接放弃；
• 响应式设计的：电脑看着还行，手机打开布局全乱套了，还得自己调。

挑来挑去，选中一个看起来最顺眼的，虽然代码写得有点啰嗦，但至少结构清楚。

动手改代码遇到坑

我以为直接替换文字和图片就行了，结果一打开HTML文件就傻眼了。里面class名全是缩写，像“ctn”“hd”“bd”这种，猜了半天才搞明白是container、header、body的意思。改着改着又发现图片路径不对，原来模板里用的都是相对路径，我文件夹挪了位置，图片全显示不出来了。只好一个个检查路径，折腾了一身汗。

最气人的是CSS样式重叠，我改了个字体颜色，结果旁边边框线也没了。后来才发现是选择器权重问题，没办法，直接粗暴地加了!important才压住。

勉强搞定

吭哧吭哧改了两小时，总算把内容都换成了客户要的，虽然细节还有点糙，但至少能看了。导出前用手机试了试，发现某个按钮在苹果手机上点不动，查了半天是某个meta标签没加，补上之后才正常。

这回搞完最大的体会就是，模板看着省事，真要改起来处处是坑。下次要是时间够，我还是宁愿自己从头写，至少代码心里有数。