河北铝猎工艺品有限公司

        很多網(wǎng)店老板都想把自己的網(wǎng)店好好的裝修一翻,可到底怎么裝修呢?簡單說,就是代碼貼入到寶貝描述中就OK!很多IT行外人,一聽到代碼,就不知如何下手了!在這里,我就來介紹一些常用的語法吧!
首先:要準(zhǔn)備兩樣工具,Dreamweaver(IT界簡稱為DW,是設(shè)計(jì)網(wǎng)頁界面用的),Fireworks或Photoshop(IT界簡稱為FW和PS,這兩個(gè)都是圖片處理工具,前者簡單易用,后者復(fù)雜高效) 下載地址http://www.swzz.net
附:網(wǎng)店裝修按網(wǎng)站建設(shè)的專業(yè)術(shù)語來說是做美工,美工的首要條件就是審美觀要好,其次才是軟件工具應(yīng)用!在這里推薦一個(gè)網(wǎng)頁學(xué)習(xí)網(wǎng)站給大家,有不懂的可以加入群問問 學(xué)網(wǎng)頁網(wǎng)http://www.xwangye.com
其次:申請(qǐng)一個(gè)無防盜鏈接相冊或靜態(tài)空間(如果有防盜鏈,你鏈接不了圖片),以后裝修的圖片和寶貝圖片都要放在這里邊!

        現(xiàn)在講講基本常用的一些HTML標(biāo)簽吧:
裝修就是要用HTML代碼來裝修,HTML代碼不區(qū)分大小寫,這里就不介紹HTML了含義了,越多大家越暈,下邊有些也不介紹了吧,有興趣的可以百度下!

注:HTML標(biāo)簽都是用"<>"包括后成雙成對(duì)出現(xiàn)的(如:<div></div>或<table></table>),結(jié)尾標(biāo)簽要加個(gè)"/",在這里,我就寫一個(gè)了!

         在學(xué)習(xí)以下內(nèi)容時(shí),你可以在桌面上新建一個(gè)寫字板或記事本,把記事本后綴名改成swzz.htm,用鼠標(biāo)右鍵點(diǎn)擊該文件,選擇打開方式,選擇寫字板或記事 本,然后把以下所要調(diào)試的內(nèi)容復(fù)制到里邊,保存(快捷鍵Ctrl+S).雙擊要開此swzz.htm就可以看到效果了!

一、布局標(biāo)簽(層顯示和表格顯示)
1.DIV:層的意思,與table類似,個(gè)人覺得在易趣中實(shí)用度還行,淘寶中不好使用!(例:<div>商網(wǎng)找找http://www.swzz.net</div>就是一個(gè)層,層沒有任何屬性,在網(wǎng)頁中除了顯示文字,不會(huì)有層的效果!不急,后邊教!)
2.TABLE:表格的意思,與DIV類似,在網(wǎng)店裝修比DIV好用,推薦使用!
3.TR:表格中行的意思,一對(duì)表示一行!
4.TD:表格中單元格的意思,一對(duì)表示一格!
注:TABLE,TR,TD三個(gè)是合起來用,缺一不可!(例:<table><tr><td>商網(wǎng)找找 http://www.swzz.net</td></tr></table>)

二、文本標(biāo)簽
5.H:這個(gè)是標(biāo)題字體格式,如H1至H6,字從大到小!(例:<H1>商網(wǎng)找找 http://www.swzz.net</H1>或<H6>商網(wǎng)找找http://www.swzz.net</H6>)
6.HR:這個(gè)是水平線的意思,也就是在網(wǎng)頁里顯示一橫線,此標(biāo)簽不用成對(duì)出現(xiàn),一個(gè)即可!(如:<HR>)
7.BR:這個(gè)是換行的意思,此標(biāo)簽不用成對(duì)出現(xiàn),一個(gè)即可!(如:商網(wǎng)找找<br>http://www.swzz.net)
8.P:這個(gè)也是換行的意思,與BR的區(qū)別在于,BR換行上行與下行中間無空隙,P換行上行與下行中間會(huì)多出一條的空隙,此標(biāo)簽不用成對(duì)出現(xiàn),一個(gè)即可!(如:商網(wǎng)找找<p>http://www.swzz.net)
9.B:表示文本加粗(如:<B>商網(wǎng)找找 http://www.swzz.net</B>)
10.U:表示文本下劃線(如:<U>商網(wǎng)找找 http://www.swzz.net</U>)
11.I:表示文本斜體(如:<I>商網(wǎng)找找 http://www.swzz.net</I>)
12.S:表示文本刪除線,即在文字中間加一橫線(如:<S>商網(wǎng)找找 http://www.swzz.net</S>)
13.BIG:表示大字體顯示文本(如:<BIG>商網(wǎng)找找 http://www.swzz.net</BIG>)
14.SMALL:表示小字體顯示文本(如:<SMALL>商網(wǎng)找找 http://www.swzz.net</SMALL>)
15.SUP:表示文本為上標(biāo)(如:<SUP>商網(wǎng)找找 http://www.swzz.net</SUP>)
16.SUB:表示文本為上標(biāo)(如:<SUB>商網(wǎng)找找 http://www.swzz.net</SUB>)
17. 表示空格,在HTML中,直接按空白鍵可以設(shè)出一個(gè)空格,如果多個(gè)空格,HTML只能讀取一個(gè)!

三、其它
1.IMG:表示顯示圖片,此標(biāo)簽不用成對(duì)出現(xiàn),一個(gè)即可(如:<img src="圖片地址" alt=商網(wǎng)找找 http://www.swzz.net>,alt屬性值表示注釋)
2.BGSOUND:添加背景音樂,此標(biāo)簽不用成對(duì)出現(xiàn),一個(gè)即可(如:<bgsound src="音樂地址" loop="循環(huán)次數(shù)">,loop為-1時(shí),無條件循環(huán)播放)
3.:表示超鏈接(如:<a href="http://www.swzz.net</a>,href屬性值為要鏈接的地址,target屬性值為在新窗口打開(_parent為在當(dāng)前窗口打開),title屬性值為注釋文字)
4.移動(dòng)文字:<marquee direction=down>商網(wǎng)找找 http://www.swzz.net</marquee>(解說:此為從上往下移動(dòng),只要把direction屬性值變掉就可以做出不同的移動(dòng),up從下往上,right從左往右,left從右往左,alternate從左到右來回走動(dòng),把文字換成圖片,也就成了圖片左右移動(dòng)了)

現(xiàn)在講講基本常用的一些屬性吧:
注:屬性是添加在HTML標(biāo)簽中的,兩個(gè)參數(shù)用空格隔開,屬性值用""括起來!(如:<div width="100" height="100">)
1.WIDTH:表示寬度的意思,很實(shí)用,實(shí)用范圍很廣(如:width="100")
2.HEIGHT:表示高度的意思,很實(shí)用,實(shí)用范圍很廣(如:height="100")
3.BACKGROUND:設(shè)置背景圖片(如:background="圖片地址")
4.BGCOLOR:表示背景顏色的意思(如:<td bgcolor="#ff0000">,#ff0000表示紅色,此色植可以開DW或FW或PS來查,很方便!)
5.COLOR:表示文字顏色的意思(如:<font color="#000000">商網(wǎng)找找 http://www.swzz.net</font>)
6.ALIGN:表示對(duì)齊的意思(如:<td align="right">,right右,center中,left左)

部分解說:
一、設(shè)置文字屬性:文字屬性不用設(shè)置在表格或?qū)拥臉?biāo)簽中,需設(shè)置在特定<font>或<span>標(biāo)簽中,此標(biāo)簽必須成對(duì)出現(xiàn),舉個(gè)例子吧!
<font color="#FF0000" size="+1" face="宋體">商網(wǎng)找找http://www.swzz.net</font>
<SPAN>用法與<FONT>類似,但<SPAN>一般不用于做文字方面屬性,而是用來裝STYLE屬性;
color為顏色屬性,size為字體大小,face為字體
二、style:此屬性是樣式的意思,可以把一切的屬性都包括在里邊,所被包括的屬性=符號(hào)必須換成:符號(hào),兩個(gè)屬性要用;符號(hào)隔開,舉個(gè)例子吧!
<div style="width:100px;height:100px;font-family:"宋體";font-size:30px;color:#ff000;">商網(wǎng)找找 http://www.swzz.net</div>
font-family:"宋體";這是字體的意思,表示這層中的文字是用宋體來顯示的,font-size:30px;文字大小的意思!
這里style屬性是設(shè)置在DIV中,同樣也可以設(shè)置在TABLE,FONT,TR,TD標(biāo)簽中!style功能比較強(qiáng)大,如果有興趣的可以去下載個(gè)CSS手冊看看!
三、HTML默認(rèn)的一些屬性:
1.默認(rèn)對(duì)齊為"居左";
2.默認(rèn)的背景顏色為"白色";
3.默認(rèn)的字體為"宋體";
4.默認(rèn)的大小為"12像素";

 
舉兩個(gè)表格例子吧!
1.簡單表格
  <table width="100" height="100" border="1" cellspacing="2" cellpadding="3">
    <tr>
      <td><font color="#ff0000" size="+1" face="宋體">商網(wǎng)找找 http://www.swzz.net</font></td>
      <td><span style="width:100px;height:100px;font-family:"宋體";font-size:12px;color:#ff000">商網(wǎng)找找 http://www.swzz.net</span></td>
    </tr>
    <tr>
      <td style="width:100px;height:100px;font-family:"宋體";font-size:12px;color:#ff000" colspan="2">商網(wǎng)找找 http://www.swzz.net</td>
    </tr>
  </table>
 
說明: border="1"邊框?yàn)?,cellspacing="2"間距為2,cellpadding="3"填充為3,colspan="2"表示此行表格兩列合并成一列,也就是一個(gè)單元格式

2.細(xì)邊表格
  <table width="100" height="100" border="0" cellpadding="2" cellspacing="1" bgcolor="#000000">
    <tr>
      <td bgcolor="#FFFFFF"><font color="#ff0000" size="+1" face="宋體">商網(wǎng)找找http://www.swzz.net</font></td>
      <td bgcolor="#FFFFFF"><span style="width:100px;height:100px;font-family:"宋體";font-size:12px; color:#ff000">商網(wǎng)找找 http://www.swzz.net</span></td>
    </tr>
    <tr>
      <td style="width:100px;height:100px;font-family:"宋體";font-size:12px; color:#ff000" colspan="2" bgcolor="#FFFFFF">商網(wǎng)找找 http://www.swzz.net</td>
    </tr>
  </table>
 
說明:把TABLE的邊框設(shè)置成0,也就是沒有邊框,背景設(shè)為黑色,把每個(gè)TD,也就是單元格的背景設(shè)為白色,就可以了!
以上就是網(wǎng)頁的布局方法,布局也就是把一個(gè)表格中再填表格,一直達(dá)到自己理想的布局界面!
還記得最前邊要下載的兩個(gè)軟件嗎?在布局網(wǎng)頁前,我們要用圖片處理工具,在軟件中畫出自己想要的頁面,再切片出來,再布局頁面!
本以為可能只寫一點(diǎn)點(diǎn)的吧,沒想到寫完看了,這么一大堆,新手持了頭暈了?呵呵!其實(shí)里邊內(nèi)容并不多,都是實(shí)用代碼!
這畢竟是一個(gè)專門職業(yè),所以要做好,還是要下功夫的!

聲明：本網(wǎng)部份文章為轉(zhuǎn)載文章，在每篇文章底部有說明，文章的觀點(diǎn)和立場僅代表作者個(gè)人立場，不代表微網(wǎng)立場，若是文章轉(zhuǎn)載中有侵范您的權(quán)益，請(qǐng)發(fā)郵件到 493149@qq.com或致電13922854199通知?jiǎng)h除，謝謝！