![WebGIS之Element前端组件开发](https://wfqqreader-1252317822.image.myqcloud.com/cover/368/44819368/b_44819368.jpg)
上QQ阅读APP看本书,新人免费读10天
设备和账号都新为新人
1.5 自定义主题样式切换
Element提供了一套默认使用的主题,Element也提供使用其他自定义主题的方法,详见Element官网首页中的“主题”部分。本节通过直接引用的方法来自定义主题。
在Element官网的首页中单击“组件”按钮,然后单击“unpkg.com/element-ui”,在弹出的页面中打开文件夹“lib\theme-chalk”,如图1-30所示。
![](https://epubservercos.yuewen.com/2BE4CA/23950045301099506/epubprivate/OEBPS/Images/43162_21_2.jpg?sign=1739083493-lzmJMPHA3xZLpuevIEURTsrV4aPsboZu-0-b9f0a6daae59a1370310665f8657ce57)
图1-30 文件夹theme-chalk的页面
单击文件夹theme-chalk中的某个文件,如文件autocomplete.css,可打开该文件的页面,如图1-31所示。单击图1-31中的“View Raw”按钮,可看到文件autocomplete.css的JavaScript代码,如图 1-32 所示(只显示了部分 JavaScript 代码)。按下组合键 Ctrl+S,可将文件autocomplete.css的JavaScript代码保存到本地,并将其添加到项目中,通过<link></link>标签将文件autocomplete.css引入HTML页面即可使用。
![](https://epubservercos.yuewen.com/2BE4CA/23950045301099506/epubprivate/OEBPS/Images/43162_22_1.jpg?sign=1739083493-o1cwV20SkOdIdLofI51MaTkeawUREeDx-0-88ca8af300dfa587a18ce4aaa3e7b05a)
图1-31 文件autocomplete.css的页面
![](https://epubservercos.yuewen.com/2BE4CA/23950045301099506/epubprivate/OEBPS/Images/43162_22_2.jpg?sign=1739083493-6V70YkiI17VcW5XTAE1Rt1KdWWMBk8h2-0-b807e7a56b9055bc3cae40d2b73d4859)
图1-32 文件autocomplete.css的JavaScript代码