導航:首頁 > 萬維百科 > 網頁設計網站cssdiv

網頁設計網站cssdiv

發布時間:2020-11-09 02:59:56

1、網頁設計作業div+css

我有大二時做的dreamweaver的網頁作業。有20份作業的源文件。任你挑選。
郵箱我就不單獨發回了,為了方便大家答下載參考。
我把網頁作業源文件打包上傳到我的百度網盤。可以直接下載,不需要注冊,也不需要積分。
網盤的下載地址,公布於本人的百度空間的文章中。
找不到或者有什麼問題的可以私信我
以上回答你滿意么?

2、網頁設計里的,html、css、div是什麼意思?

html就是做網頁頁面的標簽語言
css是控制顯示樣式的
div是層
psd格式的模板需要用Photoshop打開
====================================
PSD模板就整個頁面布局和樣式的設計原稿,需要切片才能應用到網頁上去

3、求一個網頁製作高手用div+css做一個網頁布局 急 謝謝!!!!!!!!!!!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標題文檔</title>
<style type="text/css">
#containt{ height:530px; width:400px; margin:0 auto; border:1px solid #000000;}
#top{ height:100px; width:380px; margin-top:7px; margin-left:9px;}
#top_left{ height:100px; width:138px; float:left; border:1px solid #000000; border-right:none;}
#top_right{ height:100px; width:238px; float:left; border:1px solid #000000;}
#content{ height:50px; width:380px; margin-top:5px; margin-left:9px; border:1px solid #000000;}
#bottom{ height:350px; width:380px; margin-top:5px; margin-left:9px;}
#bom_left{ height:350px; width:138px; float:left; border:1px solid #000000;}
#bom_right{ height:350px; width:235px; float:left; border:1px solid #000000; margin-left:3px;}
.b_r_div{ height:100px; width:68px; margin-left:6px; float:left; margin-top:5px; border:1px solid #000000;}
#b_r_bottom{ height:120px; width:225px; margin-left:5px; float:left; margin-top:5px; border:1px solid #000000;}
</style>
</head>
<body>
<div id="containt">
<div id="top">
<div id="top_left"></div>
<div id="top_right"></div>
</div>
<div id="content"></div>
<div id="bottom">
<div id="bom_left"></div>
<div id="bom_right">
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div class="b_r_div"></div>
<div id="b_r_bottom"></div>
</div>
</div>
</div>
</body>
</html>

4、在Dreamweaver中 怎樣用DIV+CSS來製作網頁

你主要是想問什麼?dreamweaver的操作還是不清楚div+css,或者說你不懂怎麼寫一個頁面,div+css也只是內一個思想,首先如果要寫容一個網頁的話,你根據需要,首先寫出結構,可以一部分一部分的實現,然後用css控制結構的樣式,達到你希望的樣子。
dreamweaver的操作的話,首先創建一個站點,(站點即是一個文件夾)然後根據需要在站點文件夾下創建相應的文件夾,比如存放圖片的文件夾,css樣式的文件夾,網頁的話,一般直接存放在站點文件夾最外面。

建議你問的更詳細點。

5、Div+css 網頁設計作業 求大神

我晚上或下午幫你寫吧
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
*{
margin: 0px;
padding: 0px;
}
.top,.bottom{
width: 100%;
height: 20%;
background-color: #ccc;
position: absolute;
}
.top{
top:0;
z-index: 1;
}
.bottom{
bottom: 0;
z-index: 1;
}
.content{
width:100%;
height: 60%;
background: #fff;
}
.fl{
background: red;
position: absolute;
width: 80%;
height:80%;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin:auto;
z-index: 2;
overflow: hidden;
}
.left{
width: 10%;
height:100%;
float: left;
background: red;
}
.right{
width: 10%;
height:100%;
float: left;
background: green;
}
.center{
width: 80%;
height: 100%;
float: left;
background:blue;
}
</style>
</head>
<body>
<div class="top">top</div>
<div class="content">
<div class="fl">
<div class="left">left</div>
<div class="center">center</div>
<div class="right">right</div>
</div>
</div>
<div class="bottom">bottom</div>
</body>
</html>
你最好自己先看一下 哪裡不理解 可以追問 直接寫解釋 我感覺並不好

6、網頁設計採用div+css有什麼好處?

網頁設計採用div+css的好處:
1、div+css有利於搜索引擎爬蟲:一般而言相同網頁頁面html文件table布局位元組大於div+css布局的位元組,所以可以節約搜索引擎爬蟲爬行下載頁面內容時間。
2、重構頁面修改方便(div+css改版方便):一般DIV+CSS頁面都是html和css文件分開的也就是說一個網頁的內容與表現形式的分離,一般修改小小部分的css文件里css樣式屬性就可以修改真站的樣式版面,如背景顏色、字體顏色、網站寬度等具有table不具備的方便性。
3、div+css頁面增加網頁打開速度:這里是特性決定了他們的性能,因為div+css頁面是div的html和css文件分開的,而瀏覽器打開該網頁的時候是同時下載html和css,所以可以提高網頁打開速度,而table還有個特性就是瀏覽器打開的時候必須是瀏覽器下載以<table>開始,並</table>結束後才顯示該塊的內容,而div的html是邊載入邊將內容呈現到瀏覽器上,div+css網站大大增強用戶體驗作用。大家都知道網頁多等1秒鍾都會降低瀏覽者的等待時間。

7、請問,網頁設計中怎樣用div+css進行如下圖的分塊,謝謝。

如果有成圖的話,可以考慮PS切圖

手寫的話,代碼就比較多了

<!DOCTYPE html>
<html>
<head>
<title>手寫代碼</title>
<meta charset="utf-8">
<style type="text/css">
*{padding:0;margin: 0;}
.w1260{width: 1260px;margin: 12px auto;margin-top: 0;}
.h-1{border: 1px solid #bbb;height: 120px;}
.h-2{border: 1px solid #bbb;height: 80px;}
.h-3{border: 1px solid #bbb;position: relative;overflow: hidden;}
.h-3 .h3-l{float: left;width: 33%;border-right: 1px solid #bbb;padding:1%;}
.h-3 .h3-l .h3-l1{border: 1px solid #bbb;height: 200px;}
.h-3 .h3-l .h3-l2{border: 1px solid #bbb;height: 200px;margin-top: 12px;}
.h-3 .h3-r{float: right;width: 62.6%;padding: 1%;padding-left: 0;}
.h-3 .h3-r .h3-r1{position: relative;width: 100%;border: 1px solid #bbb;overflow: hidden;}
.h-3 .h3-r .h3-r1 .h3-r1-l{float: left;height: 80px;border-right: 1px solid #bbb;width: 75%}
.h-3 .h3-r .h3-r1 .h3-r1-r{float: right;height: 80px;width: 24%;}
.h-3 .h3-r .h3-r2{position: relative;width: 100%;border: 1px solid #bbb;overflow: hidden;height: 100px;margin-top: 12px;}
.h-3 .h3-r .h3-r3{position: relative;width: 100%;border: 1px solid #bbb;overflow: hidden;margin-top: 12px;}
.h-3 .h3-r .h3-r3 .h3-r3-l{float: left;height: 200px;border-right: 1px solid #bbb;width: 75%}
.h-3 .h3-r .h3-r3 .h3-r3-r{float: right;height: 200px;width: 24%;}
.h-4{border: 1px solid #bbb;height: 80px;}
</style>
</head>
<body>
<div class="h-1 w1260"></div>
<div class="h-2 w1260"></div>
<div class="h-3 w1260">
<div class="h3-l">
<div class="h3-l1"></div>
<div class="h3-l2"></div>
</div>
<div class="h3-r">
<div class="h3-r1">
<div class="h3-r1-l"></div>
<div class="h3-r1-r"></div>
</div>
<div class="h3-r2"></div>
<div class="h3-r3">
<div class="h3-r3-l"></div>
<div class="h3-r3-r"></div>
</div>
</div>
</div>
<div class="h-4 w1260"></div>
</body>
</html>

8、div+css製作一個小網頁

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>
<style>
.selected{
background: #ffda44;
color: #fff;
}
</style>
</head>
<body>

<ul class="question1">
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>

<ul class="question2">
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>

<ul class="question3">
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>

<ul class="question4">
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>

<ul class="question5">
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>

<button>交卷</button>

<script>
$(function(){
// 正確答案
var answerArr = ["1","4","3","2","2"];
// 考生答案
var arr = ['','','','',''];
//選擇答案
$("ul li").click(function(event) {
//選中的答案添加樣式
$(this).addClass('selected').siblings().removeClass('selected');
//獲取題目的索引
var ulIndex = $(this).parent().index();
//獲取選中選項的索引並賦值到arr中
var selectedIndex = $("ul").eq(ulIndex).find("li.selected").index()+1;
arr[ulIndex] = selectedIndex;
});
$("button").click(function(event) {
//分數
var grade = 0;
//判斷答案是否正確, 正確加一分
var ulLength = $("ul").length;
for (var i = 0; i < ulLength; i++) {
if (arr[i]==answerArr[i]) {
grade++;

}
alert(grade);
});
})
</script>
</body>
</html>

看看合適不

與網頁設計網站cssdiv相關的知識