商品網頁設計_商品網頁怎麼做

1、下圖是某商城商品分類頁面，請按圖片用html製作出如下頁面，並將主要代碼寫在答卷上,並寫出你的設計方法

上面那行字，設置屬性text-derection為under-line這樣就會有下劃線....
下面菜單用一個DIV裡面嵌套五個DIV。
每個DIV的寬高設置好。
第一個DIV的漸變效果代碼略復雜，可以找個圖做背景，商品分類和全部分類超鏈接設置屬性disaplay為block，一個左浮動一個右浮動，行高屬性（line-height）設置成與DIV的高度一直，這樣垂直才會居中，下面的應該大同小異。
用DISAPLAY設置為BLOCK之後會變成塊級元素，下面的超鏈接全都要設置成左浮動，像【家用電器】那樣的，你可以直接打空格控制縮進距離，也可以調整左邊距。。。
嗯。。。不懂可以繼續問。。。本人大一，HTML學的還湊合

2、商品網頁怎麼做

建網站沒有你想像的那麼難，只要搞好幾件事就OK了： 1.就是要購買你網站的域名，也就相當於你家的門牌，只不過它是虛擬的，去萬網、新網上都有的，不過你要先查一下有沒有了，因為很多人搶注域名的！ 2.有了門牌域名後，你需要買空間，因為它就像你家的地基一樣。沒有空間，你的公司簡介、產品圖片等就沒地方放的。 3.別忘了作一下解析，讓你的域名和空間聯到一起！我建議到萬網、新網上買那種打包的，也就是域名、空間在一起的！ 4.網頁製作了這就不用我說了自已不會請別人作好了！ 1.注意你購買的域名及空間都有證書給你的，收好它 2.製作好了之後，你的網站有一個FTP許可權的帳號及密碼，你要找給你作的人要回來，有了這個後你就不必擔心什麼了！

麻煩採納，謝謝!

3、網頁設計：1、製作一個個人網站，2個頁面以上 2、以商品為背景資料，製作一個產品廣告專題要求：先

你這個a是作業嗎。私信聯系我

4、淘寶網店怎麼開啊？怎麼上貨小貨，怎麼對商品網頁設計？

如果您的上網時間充足的話建議先做虛擬
有信譽後
可以免費代銷實物

虛擬網店充值只需投資3OO元
無風險
無壓力

只要努力
月入幾千不是問題
！踏踏實實的做
信譽！良心
保證！

！！土豆
優酷
酷六
都有我的
視頻教程
歡迎收看！！
在線時間長
可隨時解決你所遇到的問題
！
有不明白的Q我
有意聯系我用戶名

5、在網頁製作中，商品的分類欄怎麼做？具體點。

用div+CSS
<UL>
<LI></LI>
<LI></LI>
<LI></LI>
<LI></LI>
<LI></LI>
</UL>

6、B2C網站商品詳情頁應該如何設計？

商品詳情頁存在的目的是什麼？

商品詳情頁是在用戶對你的產品產生了需求，走進你的網路店鋪里，具體詳細的查看這個產品的情況，來決定自己是否要購買。所以商品詳情頁承擔了轉化消費者的重則，是最重要的一個環節。

那麼消費者購買一個產品，所看重哪些地方呢：

1 產品本身的本質

用戶購買產品是拿來用的，所以一定關注產品品質，產品詳情頁應該用大量的圖片和文字來描述產品本身的品質，圖片本身一定要漂亮，這樣才能更好地突出產品自己的美感。

2 證書輔助

光你自己說你的產品好是沒有用的，需要列出證據來，最好的證據就是各種國家證書，表明你的產品是正品，經過了國家審核標准，不是假冒偽劣產品。

3 用戶贊美

除了證書輔助之外，用戶的贊美詩非常重要的，每一個用戶都更加看重已經購買產品用戶的感受，通過查看他們的評價來判斷這件產品的品質如何。

4 產品優勢

目前互聯網競品非常多，產品品質都差不多，用戶憑什麼購買你的產品呢，你要給他們一個非常充足的理由，找出你自己的產品賣點來，沒有賣點一定也要製造賣點，否則你永遠都賣不過你的競爭對手。

5 介紹其他同類型產品

用戶查看商品詳情頁的時候，不管你描述的多麼好，不購買的概率都會很大，所以要充分利用這次用戶瀏覽的機會，向他推薦相關的產品。這里的相關產品一定要符合邏輯，例如可以列出不同價位的同款產品，讓對價格敏感的用戶有更多的選擇。或者列出與此款產品配套的產品，用戶購買了此產品一定會購買此產品配合使用。

7、html css製作家用商品分類頁面

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{margin:0;padding: 0;box-sizing:border-box;}
a{color:#666;text-decoration: none;}
.menu{width:220px;}
.menu h2{width:100%;height: 36px;line-height: 36px;font-size:18px;padding-left: 10px;background: #0F7CBF;}
.menu h2 a{color:#fff;}
.menu .item h3{height: 30px;line-height:30px;padding-left:15px;background: #E4F1FA;}
.menu .item h3 a{color:#0F7CBF;font-size: 14px;}
.menu .item p{padding: 15px;line-height: 18px;}
.menu .item p a{font-size: 12px;}
</style>
</head>
<body>
<div class="menu">
<h2><a href="#">家用電器</a></h2>
<div class="item">
<h3><a href="#">大家電</a></h3>
<p>
<a href="#">平板電視</a> <a href="#">洗衣機</a> <a href="#">冰箱</a>
<a href="#">空調</a> <a href="#">煙機/灶具</a> <a href="#">熱水器</a>
<a href="#">冷櫃/酒櫃</a> <a href="#">消毒櫃</a> <a href="#">家庭影院</a>
</p>
</div>
<div class="item">
<h3><a href="#">大家電</a></h3>
<p>
<a href="#">平板電視</a> <a href="#">洗衣機</a> <a href="#">冰箱</a>
<a href="#">空調</a> <a href="#">煙機/灶具</a> <a href="#">熱水器</a>
<a href="#">冷櫃/酒櫃</a> <a href="#">消毒櫃</a> <a href="#">家庭影院</a>
</p>
</div>
<div class="item">
<h3><a href="#">大家電</a></h3>
<p>
<a href="#">平板電視</a> <a href="#">洗衣機</a> <a href="#">冰箱</a>
<a href="#">空調</a> <a href="#">煙機/灶具</a> <a href="#">熱水器</a>
<a href="#">冷櫃/酒櫃</a> <a href="#">消毒櫃</a> <a href="#">家庭影院</a>
</p>
</div>
<div class="item">
<h3><a href="#">大家電</a></h3>
<p>
<a href="#">平板電視</a> <a href="#">洗衣機</a> <a href="#">冰箱</a>
<a href="#">空調</a> <a href="#">煙機/灶具</a> <a href="#">熱水器</a>
<a href="#">冷櫃/酒櫃</a> <a href="#">消毒櫃</a> <a href="#">家庭影院</a>
</p>
</div>
</div>

</body>
</html>

兼容IE8+

8、設計一個帶商品計算功能網頁採用追加分數

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> 價格計算器 </TITLE>

</HEAD>

<style>

table, td{

border:1px solid #cccccc;

border-collapse:collapse;

}

</style>

<BODY>

var items = new Array();

//序號-名稱-單價-描述

var idx = 0;

var cd = 0;

items[idx++] = [cd++,'選擇商品','0',''];

items[idx++] = [cd++,'網線','1.5','超五類雙絞線'];

items[idx++] = [cd++,'水晶頭','0.5','純銅水晶頭'];

//選擇商品

function fnChange(row){

var cbo = document.getElementById('txtName'+row);

var item = items[cbo.value];

document.getElementById('txtPrice'+row).value = item[2];

document.getElementById('txtDes'+row).value = item[3];

fnCal(row);

}

//小計

function fnCal(row){

var _txtCount = document.getElementById('txtCount'+row);

var price = document.getElementById('txtPrice'+row).value;

var count = _txtCount.value;

if(count*1 > 0){

document.getElementById('txtSubTotal'+row).value = count * price;

}else{

_txtCount.value = '';

}

fnCalTotal();

}

//合計

function fnCalTotal(){

var subTotals = document.getElementsByName('txtSubTotal');

var total = 0;

for(var i=0; i<subTotals.length; i++){

total += subTotals[i].value * 1;

}

document.getElementById('txtTotal').value = total;

}

//添加方法

function addtr()

{

//var trid=0;

var tab=document.getElementById("tab");

//添加行

var newTR = tab.insertRow(tab.rows.length);

//trid++;

//獲取序號=行索引

var rowIdx=newTR.rowIndex.toString();

newTR.id = "tr" + rowIdx;

//添加列:序號

var newNameTD=newTR.insertCell(0);

newNameTD.innerHTML = rowIdx;

//添加列:名稱

var newNameTD=newTR.insertCell(1);

var _options = "";

for(var i=0; i<idx; i++){

_options += "<option value='"+items[i][0]+"'>"+items[i][1]+"</option>";

}

newNameTD.innerHTML = "<select name='txtName' id='txtName" + rowIdx + "' onchange='fnChange("+rowIdx+")'>" + _options + "</select>";

//添加列:單價

var newDesTD=newTR.insertCell(2);

newDesTD.innerHTML = "<input style='width:80px;' readonly='readonly' name='txtPrice' id='txtPrice" + rowIdx + "'/>";

//添加列:描述

var newDesTD=newTR.insertCell(3);

newDesTD.innerHTML = "<input style='width:100%;' name='txtDes' id='txtDes" + rowIdx + "'/>";

//添加列:數量

var newDesTD=newTR.insertCell(4);

newDesTD.innerHTML = "<input style='width:40px;' name='txtCount' id='txtCount" + rowIdx + "' onchange='fnCal("+rowIdx+")'/>";

//添加列:小計

var newDesTD=newTR.insertCell(5);

newDesTD.innerHTML = "<input style='width:80px;' readonly='readonly' name='txtSubTotal' id='txtSubTotal" + rowIdx + "'/>";

//添加列:刪除按鈕

var newDeleteTD=newTR.insertCell(6);

//添加列內容

newDeleteTD.innerHTML = "<div align='center' style='width:40px'><a href='javascript:;' onclick="deltr('tr" + rowIdx + "')">刪除</a></div>";

}

</script>

//刪除其中一行

function deltr(trid)

{ //alert(trid);

var tab=document.getElementById("tab");

var row=document.getElementById(trid);

var index=row.rowIndex;//rowIndex屬性為tr的索引值，從0開始

tab.deleteRow(index); //從table中刪除

//重新排列序號，如果沒有序號，這一步省略

var nextid;

for(i=index;i<tab.rows.length;i++){

tab.rows[i].cells[0].innerHTML = i.toString();

nextid=i+1;

remark=document.getElementById("remark"+nextid);

remark.id="remark";

}

fnCalTotal();

}

</script>

<body>

</tr>

</table>

價格合計:<input type="text" id="txtTotal"/>

</BODY>

</HTML>

9、Dreamweaver中怎麼製作一個商品展示頁面

Dreamweaver中製作一個商品展示頁面步驟：
第一、用ps製作出頁面圖稿。
第二、ps切圖，Dreamweaver軟體專布局，用div布局，css樣式美屬化。
只要有一定的網頁設計基礎，懂得寫代碼規則，製作一個頁面不是很難。

10、網店商品介紹頁面要怎麼設計

網店商品介紹頁面要怎麼設計如下：

詳情頁的描述基本遵循以下原則：引發興趣，激發潛在需求，從信任到信賴，替客戶做決定；

淘寶的消費者在搜索商品的時候，是先搜索，然後碰到自己喜歡的，就直接進入了寶貝詳情頁面，所以，寶貝詳情頁是提高轉化率的首要入口。

導航:首頁 > 萬維百科 > 商品網頁設計

商品網頁設計

與商品網頁設計相關的知識