POST TIME:2020-03-28 18:48
最近我發(fā)現(xiàn)一些朋友在下載模板安裝時發(fā)現(xiàn)內(nèi)容錯位,其實是CSS文件調(diào)用不當引起的,一般是CSS文件調(diào)用路徑錯誤,所以今天我將要向大家介紹如何查找織夢模板模板所調(diào)用的CSS文件。
首先打開模板文件夾里的index.htm文件,這里可以清楚看到模板的所調(diào)用的css文件,大家找到:
<link href="{dede:global.cfg_templeturl/}/style/織夢模板.css" rel="stylesheet" media="screen" type="text/css" />
一般在index.htm里第八行里就是這一句,通過這句話大家可以看到一個css路徑,也就是在 empletsstyle這個文件下的所有文件都是dede默認模板的css文件,而index.htm的css就是織夢模板.css。
打開這個css文件后大家還會看到:
@import url("layout.css");
@import url("page.css");
這兩句的意思就是織夢模板.css這個css文件還引用了layout.css和page.css這2個css文件。
通過查看織夢模板.css文件大家可以發(fā)現(xiàn)這個css主要控制的是所有模板文件的頭部和尾部以及所有css的全局設(shè)計。
大家找到/*---------- base ---------*/這句下面一直到/*---------- frame ---------*/這里基本上都是全局css
下面的透過看單詞就明白是header和foot的css也就是模板的頭尾部css。
關(guān)于page和layout這兩個css是關(guān)于列表部分css、翻頁css、以及一些通用的css,大家可以通過查看css了解一下。
下面我為大家舉個例子講解一下css的對應(yīng)關(guān)系和部分標簽的基礎(chǔ)應(yīng)用:請大家打開head.htm模板文件。
首先大家打開head.htm后會看到<div class="header">這句話
那么其中的header就是一個定義為header的css。
那我們可以復(fù)制header,然后再織夢模板.css
里用Ctrl+f來查找有關(guān)header的所有css定義。
其它css的查找同樣,如果你在某個css文件中找不到相應(yīng)的css那么就在其他幾個css文件中查找,然后修改,至于具體怎么修改css就不再本次講解之內(nèi)了,有關(guān)css的學習在網(wǎng)上有很多教程。
在這里只是簡單說明一下css的查找和應(yīng)用.