Dreamweaver怎么制作簡單的日歷模板?
Dreamweaver中想要制作一個(gè)日歷,主要使用表格來制作,函數(shù)創(chuàng)建與調(diào)用,if語句與for語句、ID標(biāo)簽的應(yīng)用。下面我們就來看看詳細(xì)的教程。

1、打開Dreamweaver軟件,新建一個(gè)HTML文檔。在body標(biāo)簽加入onload="getRili()",用來調(diào)取下面步驟的函數(shù)。在body內(nèi)部新建一個(gè)div的標(biāo)簽并定義ID為date。如下圖:

2、在新建文檔的<head></head>標(biāo)記里輸入<style type="text/css"></style>,這個(gè)標(biāo)記里用來設(shè)置一個(gè)CSS樣式。再輸入<script type="text/javascript"></script>標(biāo)記,用來創(chuàng)建日歷的制作。

3、在<style type="text/css"></style>這個(gè)標(biāo)記里輸入一個(gè)CSS樣式,這里不再解釋樣式的作用。在<script type="text/javascript"></script>標(biāo)記里創(chuàng)建一個(gè)函數(shù)getRili()。

4、下面開始講解函數(shù)內(nèi)部日歷的實(shí)現(xiàn)步驟,首先,命名我們需要用到的變量。這里先列出,下面用到時(shí)再做介紹。

5、首先在函數(shù)里輸入兩個(gè)if語句,這兩個(gè)語句的功能是判斷是否為閏年,以此來設(shè)置二月份的天數(shù)。下面的row變量用來獲得每月所占用的行數(shù),也就是在頁面顯示的時(shí)候有幾行。str用來獲取我們要輸入的表格和文字。

6、插入兩個(gè)for循環(huán),第一個(gè)for循環(huán)用來獲取周日到周六,并把輸出代碼保存入str。第二個(gè)for循環(huán),首先條件設(shè)定的意思是保證輸出當(dāng)月的行數(shù),代碼意思用來創(chuàng)建行。

7、在第二個(gè)for循環(huán)嵌套一個(gè)for循環(huán),并設(shè)定if條件語句,用來判定從那一列開始輸出每月的幾號。假如剛好是當(dāng)天日期,改變當(dāng)前單元格的背景顏色。

8、最后輸入的兩行代碼,第一行表示表格的結(jié)束。第二行是把生成的代碼,保存入ID為date的div。這樣一個(gè)日歷的制作就完成了!保存后運(yùn)行,就是第一幅圖片的樣子了!
以上就是Dreamweaver制作日歷的教程,希望大家喜歡,請繼續(xù)關(guān)注腳本之家。
相關(guān)推薦:
Dreamweaver cc2018主題顏色怎么設(shè)置?
相關(guān)文章
Dreamweaver網(wǎng)頁怎么添加文本字段?Dreamweaver設(shè)計(jì)帶有用戶名密碼的登陸頁面的時(shí)候,需要添加文本字段,該怎么添加呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2018-01-26
Dreamweaver怎么實(shí)現(xiàn)一個(gè)網(wǎng)頁內(nèi)包含多個(gè)頁面的效果?
Dreamweaver怎么實(shí)現(xiàn)一個(gè)網(wǎng)頁內(nèi)包含多個(gè)頁面的效果?Dreamweaver設(shè)計(jì)網(wǎng)頁頁面的時(shí)候,想要一個(gè)網(wǎng)頁包含多個(gè)頁面,該怎么實(shí)現(xiàn)呢?我們可以使用框架實(shí)現(xiàn),下面我們就來看看詳2018-01-26
Dreamweaver表單怎么設(shè)置6位數(shù)的密碼?
Dreamweaver表單怎么設(shè)置6位數(shù)的密碼?Dreamweaver中出入的表單想要設(shè)置6位數(shù)的密碼,該怎么設(shè)置呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2018-01-26
Dreamweaver網(wǎng)頁中怎么插入命名錨記鏈接?
Dreamweaver網(wǎng)頁中怎么插入命名錨記鏈接?Dreamweaver設(shè)計(jì)網(wǎng)頁的時(shí)候,想要插入命名錨記鏈接,該怎么使用命名錨記呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2018-01-16
dreamweaver怎么新建收藏夾并歸類資源?dreamweaver中收藏了很多東西,為了方便查找我們可以根據(jù)資源類型歸類,下面我們就來看看dreamweaver新建收藏夾并歸類的教程,需要2018-01-09
Dreamweaver怎么使用css選擇器中的類?Dreamweaver中css選擇器中有很多功能,想要使用其中的類,該怎么使用呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2018-01-09
Dreamweaver文件頭部信息有什么作用? dw查看文件頭部信息的教程
Dreamweaver文件頭部信息有什么作用?Dreamweaver制作的網(wǎng)頁由兩部分組成,一個(gè)是頭部信息,一個(gè)就是主體信息,今天我們就來介紹一下dw查看文件頭部信息的教程,需要的朋友2018-01-09
Dreamweaver網(wǎng)頁中的文本怎么添加背景色?
Dreamweaver網(wǎng)頁中的文本怎么添加背景色?Dreamweaver設(shè)計(jì)的網(wǎng)格,想要一小段文本中的文字添加背景色,該怎么添加呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參考下2018-01-08
Dreamweaver網(wǎng)頁中怎么添加電子郵箱鏈接?
Dreamweaver網(wǎng)頁中怎么添加電子郵箱鏈接?Dreamweaver設(shè)計(jì)的網(wǎng)頁想要添加聯(lián)系我們的文字直接鏈接到電子郵箱,該怎么制作呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參2018-01-05
Dreamweaver網(wǎng)頁中的文本怎么添加背景圖片?
Dreamweaver網(wǎng)頁中的文本怎么添加背景圖片?Dreamweaver設(shè)計(jì)的文本網(wǎng)頁太單調(diào),想要給文本添加星空背景圖片,該怎么添加呢?下面我們就來看看詳細(xì)的教程,需要的朋友可以參2018-01-05












