一、HTML
1.Html至今仍是制作網頁時必不可少的代碼。如果能夠熟悉掌握並應用這些代碼，大到網站，小到博客等都會有莫大的好處。
HTML全稱：HyperText Mark-up Language.
譯稱：超文本標記語言。
目前網絡上應用最為廣泛的語言，也是構成網頁的基本語言。
文本文件我們很常見，HTML和文本文件差不多，所以我們可以用WINDOWS自帶的記事本進行編輯它。但是它需要浏覽器的解析才能看到我們所要的效果。
2.下面我們來講解HTML重要的組成部分 “元素”？
模板首頁的地址：dedecms根目錄/templets/default/index.htm 也是我們今天主講的HTML頁面.
我們打開先熟悉一下。
我們首先看到的是HTML頁面以DOCTYPE開始，它的作用是聲明文檔的類型，且它之前不能有任何內容（包括換行符和空格），否則將使文檔聲明無效。接著是<html>標簽，以</html>結束。其中包含了很多代碼；這就是一個元素。
元素的定義是用標簽來表示的功能和內容就是HTML的“元素”
格式是:<標簽名>[內容]</標簽名>,我們DEDE模板調用標簽和這個挺相似的；
<head>，<body>元素都是嵌套在<HTML>元素中的，所以<html> 就是HTML頁面的根元素且是必須存在的，大家可以看一下我們的首頁模板，是不是這樣的。
3.接下來我就來講一下HTML中非常重要的標簽
HTML標簽大多是成對出現的，例：<body></body>
還有一種是空標簽，例：<br />標簽，作用是換行;
標簽大致可分為
1.塊級標簽
“塊級標簽”通常會在web頁面中開始新的一行，並且常常會包含其他標簽。
模板頁裡的<div>、<p>及<ul>等標簽都屬於此類標簽。
2.行內標簽
通常是不會重新開一行，而且只能包含文本或者其他內置標簽。
模板頁裡的<a>、<strong>等標簽都屬於此類標簽。
HTML 標簽對大小寫是不敏感的：<a> 和 <A> 的作用是相同的。推薦為小寫, 養成一個好的習慣很重要。
一個HTML頁面裡必須有的四個標簽
<html> <head> <title> <body>
當然我們的首頁模板也一定有的；
在<head>標簽中填寫與該文件（HTML）的相關信息
<body>標簽中填寫的實際內容就是要在浏覽器顯示我們要看到的內容
在<head>標簽中，只能有一個代表文件標題的標簽，就是<title>標簽
就是我們浏覽器中做上角顯示的內容
圖1
下面我們主要來講下首頁模板被圍在<body>元素中的標簽都是做什麼的？
<div>標簽：DIV的起始標簽和結束標簽之間的所有內容都是用來構成這個塊的，也稱作 “層”。我們常用DIV+CSS來進行HTML布局，可以看到我們首頁模板有很多<div>標簽。所以這個標簽對我們應用HTML很重要。
<dl> <ul> 我們做列表的時候會用到，他們都是列表標簽。
<a>是鏈接的標簽，大家應該會知道。
<hX> 標簽表示為該內容為標題，X級別用數字1-6來表示。1代表最高級，6代表最底。<hX>標簽應用很廣泛，這裡我告訴大家一個是，當用圖象<img>當標題的話，也要用<h>~</h>括上，這樣一來。在不能顯示圖像的情況下，可以用<img>標簽的alt屬性所指定的文字把標題顯示出來。
<p> 標簽表示該內容為一個段落；
<span>標簽表示在行內定義一個區域，也就是一行內可以被<span>劃分成好幾個區域，從而實現某種特定效果。
<strong>特別強調。
標簽我們先介紹到這；
當你將一個 HTML 文件存盤時，您即可以使用 HTM 也可以使用 HTML 作為擴展名。
4.下面我們來講講如何刪除首頁上的部分內容。
我選擇刪除投票調查那部分，
圖2
我們現在在模板裡把投票調查那部分代碼找到。
圖3
找到後，選擇刪除就OK了。
圖4
HTML其主要特點如下：
1 簡易,HTML使用靈活方便。
2 可擴展,HTML采取子類元素的方式，為系統擴展帶來保證。
3 平台廣泛,HTML幾乎可以應用到任何平台上
小結：1.HTML概述 2.HTML組成 3.模板裡的基本標簽 4.刪除模板的部分內容
一、CSS
1.CSS就是一種叫做樣式表（stylesheet）的技術。也有的人稱之為層疊樣式表（Cascading Stylesheet）。
今天我們要講就是層疊樣式表，以下簡稱CSS。
HTML只不過是構成一個文本文件的一系列標簽，指定標簽是如何顯示的就需要用到樣式表了。
在制作HTML時采用CSS技術，可以有效地對頁面的布局、字體、顏色、背景和其它效果實現更加精確的控制。
你可以將站點上所有的網頁風格都使用一個CSS文件進行控制，只要修改這個CSS文件中屬性值，那麼整個站點的所有頁面都會隨之發生變動。
在講下面內容之前，我們先打開首頁模板中用到的CSS文件。
在首頁模板代碼模式下，可以看到
<link href="{dede:global.cfg_templeturl/}/style/dedecms.css" rel="stylesheet" media="screen" type="text/css" />
這個是連接外部CSS的方式。
可以在dedecms根目錄templets\style目錄下找到 dedecms.css文件；
@import url("layout.css");
@import url("page.css");
CSS中加載另外2個CSS文件,可能一會我們會用到這2個文件.
2.基本語法格式
CSS基本是是按照以下的的語法格式進行表示的：
選擇符 {屬性： 值}
*{
padding:0px;
margin:0px;
}
注意樣式與樣式之間要用分號隔開。
選擇符是用來指定針對哪一個標簽應用樣式表的部分。 也就是那個*.
padding和margin屬性，指的是表明選擇器所使用的標簽。
0px,就是值，也就是我們所要表達的意思了。
這個是不需要指定的。
指定標簽：用id屬性和classs（類名）屬性指定標簽為對象的應用樣式。
定義ID選擇符，名稱前要加一個#，而類名則是.
在同一個HTML中類名可以指定多個，但ID名只能指定一處，這點注意。
3.下面我們針對首頁模板進行下CSS的應用
我們對頭條文章的標題的字號變的大一點，字體變成紅色，，並設為斜體。
圖5
我們接下來在模板裡先找到頭條文章的代碼，看到 <!--頭條-->這個了吧，很容易就找到了，所以我們應該制作模板的時候，也都做好注釋，養成一個好習慣很重要。
圖6
著重指出的部分<a>就是我們要CSS修飾的。我們通常所要改的內容就是修改與之最近標簽的CSS。
我們現在打開CSS文件,<div class="onenews">
我們先找外圍DIV所對應的onenews選擇符。
是不是在dedecms沒有找到啊。
不要著急，剛才我提到那2個CSS文件找找看。
終於讓我在page.css中找到；
圖7
font-size:16px;
font-size：字號的意思，也就是字的大小。Px是的單位，一個像素。
可以隨便改個20數字試試。
接下，我們要做的是改顏色:
好。
我們加上一個color屬性，COLOR就是顏色屬性。
我們在給它指定一個紅色的值，color：#FF0000.
你們也可以隨便給個設定個顏色.
Font-style就是字體屬性，我們給它設個值。Font-
style：italic；
做完後，保存下。
我們更新首頁，看看有沒有變化。
圖8
小結：1什麼是CSS
2.CSS的基本語法
3.首頁模板的實例應用
總結:1.DEDE首頁模板HTML的組成
2.CSS對HTML的重要性
- 上一頁:HTML 簡史
- 下一頁:將網站（主頁）變成黑白