很多網(wǎng)店老板都想把自己的網(wǎng)店好好的裝修一翻,可到底怎么裝修呢?簡(jiǎn)單說(shuō),就是代碼貼入到寶貝描述中就OK!很多IT行外人,一聽(tīng)到代碼,就不知如何下手了!在這里,我就來(lái)介紹一些常用的語(yǔ)法吧!
首先:要準(zhǔn)備兩樣工具,Dreamweaver(IT界簡(jiǎn)稱為DW,是設(shè)計(jì)網(wǎng)頁(yè)界面用的),Fireworks或Photoshop(IT界簡(jiǎn)稱為FW和PS,這兩個(gè)都是圖片處理工具,前者簡(jiǎn)單易用,后者復(fù)雜高效) 下載地址http://www.swzz.net
附:網(wǎng)店裝修按網(wǎng)站建設(shè)的專業(yè)術(shù)語(yǔ)來(lái)說(shuō)是做美工,美工的首要條件就是審美觀要好,其次才是軟件工具應(yīng)用!在這里推薦一個(gè)網(wǎng)頁(yè)學(xué)習(xí)網(wǎng)站給大家,有不懂的可以加入群?jiǎn)枂?wèn) 學(xué)網(wǎng)頁(yè)網(wǎng)http://www.xwangye.com
其次:申請(qǐng)一個(gè)無(wú)防盜鏈接相冊(cè)或靜態(tài)空間(如果有防盜鏈,你鏈接不了圖片),以后裝修的圖片和寶貝圖片都要放在這里邊!
現(xiàn)在講講基本常用的一些HTML標(biāo)簽吧:
裝修就是要用HTML代碼來(lái)裝修,HTML代碼不區(qū)分大小寫(xiě),這里就不介紹HTML了含義了,越多大家越暈,下邊有些也不介紹了吧,有興趣的可以百度下!
注:HTML標(biāo)簽都是用"<>"包括后成雙成對(duì)出現(xiàn)的(如:<div></div>或<table></table>),結(jié)尾標(biāo)簽要加個(gè)"/",在這里,我就寫(xiě)一個(gè)了!
在學(xué)習(xí)以下內(nèi)容時(shí),你可以在桌面上新建一個(gè)寫(xiě)字板或記事本,把記事本后綴名改成swzz.htm,用鼠標(biāo)右鍵點(diǎn)擊該文件,選擇打開(kāi)方式,選擇寫(xiě)字板或記事本,然后把以下所要調(diào)試的內(nèi)容復(fù)制到里邊,保存(快捷鍵Ctrl+S).雙擊要開(kāi)此swzz.htm就可以看到效果了!
一、布局標(biāo)簽(層顯示和表格顯示)
1.DIV:層的意思,與table類似,個(gè)人覺(jué)得在易趣中實(shí)用度還行,淘寶中不好使用!(例:<div>商網(wǎng)找找http://www.swzz.net</div>就是一個(gè)層,層沒(méi)有任何屬性,在網(wǎng)頁(yè)中除了顯示文字,不會(huì)有層的效果!不急,后邊教!)
2.TABLE:表格的意思,與DIV類似,在網(wǎng)店裝修比DIV好用,推薦使用!
3.TR:表格中行的意思,一對(duì)表示一行!
4.TD:表格中單元格的意思,一對(duì)表示一格!
注:TABLE,TR,TD三個(gè)是合起來(lái)用,缺一不可!(例:<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)頁(yè)里顯示一橫線,此標(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換行上行與下行中間無(wú)空隙,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:添加背景音樂(lè),此標(biāo)簽不用成對(duì)出現(xiàn),一個(gè)即可(如:<bgsound src="音樂(lè)地址" loop="循環(huán)次數(shù)">,loop為-1時(shí),無(wú)條件循環(huán)播放)
3.:表示超鏈接(如:<a href="http://www.swzz.net" target="_blank" title="商網(wǎng)找找">商網(wǎng)找找http://www.swzz.net</a>,href屬性值為要鏈接的地址,target屬性值為在新窗口打開(kāi)(_parent為在當(dāng)前窗口打開(kāi)),title屬性值為注釋文字)
4.移動(dòng)文字:<marquee direction=down>商網(wǎng)找找 http://www.swzz.net</marquee>(解說(shuō):此為從上往下移動(dòng),只要把direction屬性值變掉就可以做出不同的移動(dòng),up從下往上,right從左往右,left從右往左,alternate從左到右來(lái)回走動(dòng),把文字換成圖片,也就成了圖片左右移動(dòng)了)
現(xiàn)在講講基本常用的一些屬性吧:
注:屬性是添加在HTML標(biāo)簽中的,兩個(gè)參數(shù)用空格隔開(kāi),屬性值用""括起來(lái)!(如:<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表示紅色,此色植可以開(kāi)DW或FW或PS來(lái)查,很方便!)
5.COLOR:表示文字顏色的意思(如:<font color="#000000">商網(wǎng)找找 http://www.swzz.net</font>)
6.ALIGN:表示對(duì)齊的意思(如:<td align="right">,right右,center中,left左)
部分解說(shuō):
一、設(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>一般不用于做文字方面屬性,而是用來(lái)裝STYLE屬性;
color為顏色屬性,size為字體大小,face為字體
二、style:此屬性是樣式的意思,可以把一切的屬性都包括在里邊,所被包括的屬性=符號(hào)必須換成:符號(hào),兩個(gè)屬性要用;符號(hào)隔開(kāi),舉個(gè)例子吧!
<div style="width:100px;height:100px;font-family:"宋體";font-size:30px;color:#ff000;">商網(wǎng)找找 http://www.swzz.net</div>
font-family:"宋體";這是字體的意思,表示這層中的文字是用宋體來(lái)顯示的,font-size:30px;文字大小的意思!
這里style屬性是設(shè)置在DIV中,同樣也可以設(shè)置在TABLE,FONT,TR,TD標(biāo)簽中!style功能比較強(qiáng)大,如果有興趣的可以去下載個(gè)CSS手冊(cè)看看!
三、HTML默認(rèn)的一些屬性:
1.默認(rèn)對(duì)齊為"居左";
2.默認(rèn)的背景顏色為"白色";
3.默認(rèn)的字體為"宋體";
4.默認(rèn)的大小為"12像素";
舉兩個(gè)表格例子吧!
1.簡(jiǎn)單表格
<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>
說(shuō)明: 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>
說(shuō)明:把TABLE的邊框設(shè)置成0,也就是沒(méi)有邊框,背景設(shè)為黑色,把每個(gè)TD,也就是單元格的背景設(shè)為白色,就可以了!
以上就是網(wǎng)頁(yè)的布局方法,布局也就是把一個(gè)表格中再填表格,一直達(dá)到自己理想的布局界面!
還記得最前邊要下載的兩個(gè)軟件嗎?在布局網(wǎng)頁(yè)前,我們要用圖片處理工具,在軟件中畫(huà)出自己想要的頁(yè)面,再切片出來(lái),再布局頁(yè)面!
本以為可能只寫(xiě)一點(diǎn)點(diǎn)的吧,沒(méi)想到寫(xiě)完看了,這么一大堆,新手持了頭暈了?呵呵!其實(shí)里邊內(nèi)容并不多,都是實(shí)用代碼!
這畢竟是一個(gè)專門(mén)職業(yè),所以要做好,還是要下功夫的!
樂(lè)發(fā)網(wǎng)超市批發(fā)網(wǎng)提供超市貨源信息,超市采購(gòu)進(jìn)貨渠道。超市進(jìn)貨網(wǎng)提供成都食品批發(fā),日用百貨批發(fā)信息、微信淘寶網(wǎng)店超市采購(gòu)信息和超市加盟信息.打造國(guó)內(nèi)超市采購(gòu)商與批發(fā)市場(chǎng)供應(yīng)廠商搭建網(wǎng)上批發(fā)市場(chǎng)平臺(tái),是全國(guó)批發(fā)市場(chǎng)行業(yè)中電子商務(wù)權(quán)威性網(wǎng)站。
本文內(nèi)容整合網(wǎng)站:百度百科、知乎、淘寶平臺(tái)規(guī)則
本文來(lái)源: 網(wǎng)店裝修三步曲