導航:首頁 > 萬維百科 > 網頁設計修改背景

網頁設計修改背景

發布時間:2020-08-28 15:51:24

1、製作網頁如何改變背景顏色?

打開Adobe Dreamweaver,新建一個HTML網頁文件.

網頁的一般結構,首先是DOCTYPE聲明,然後是頭部標簽<head>...</head>,文檔的主體<body>..</body>標簽,我們需要設置網頁背景,直接設置<body>標簽的背景就行了。

點擊右邊的所有規則,新建一條規則,在彈出的界面,選擇器類型為標簽選擇器,選擇器名稱為body,然後點擊確認。

在CSS規則裡面選擇背景,在「background-color」裡面選擇一種顏色作為網頁背景色,然後點擊確認。

然後點擊在瀏覽器調試,查看網頁背景,詳細代碼如下:

<!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=utf-8" />

<title>無標題文檔</title>

<style type="text/css">

body {

background-color: #FC6;

}

</style>

</head>

<body>

</body>

</html>

網頁不僅僅可以用顏色作為背景,還可以用圖片作為網頁背景,打開剛才新建的規則,繼續選擇背景,「background-image」選項後面有瀏覽按鈕,將作為背景的圖片選擇好,然後點擊確認。

然後在調試網頁,查看網頁的背景,圖片已經作為網頁的背景顏色了。代碼如下:

<!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=utf-8" />

<title>無標題文檔</title>

<style type="text/css">

body {

background-image: url(10/38.png);

}

</style>

</head>

<body>

</body>

</html>

2、製作網頁如何改變背景顏色

<head>
<title></title>
<style type="text/css">
body{background-color:#000;}
</style>
</head>
這是整體改變背景顏色,單獨改某個區域的話,用bgcolor這個

3、製作網頁的時候怎麼設置背景?

設置背景,請在<body>標簽里增加一個class類,這個類寫入background-image標簽。
例如:{background-image:pictrue.jpg}
pictrue.jpg就是你背景圖片的地址,改一下

4、怎麼修改網頁背景代碼

1、用記事本或者Dreamweaver打開.html格式文件就能看到源碼
2、ctrl+F搜索background就能找到背景部分的代碼
3、修改代碼,是要換顏色還是加圖片還是背景圖片位置這些都可以百度出修改代碼

5、html網頁製作中如何更改背景圖片大小

因背景圖片是在css樣式裡面寫的,所以修改的時候只要對應著引入css背景圖片的那個樣式名,調整背景圖片寬度用width:**px; 高度用:height:**px; 多少像素根據你自己的需求來設置;
如果還有其他疑問,請繼續追問我;

6、html 網頁製作 如何設置網頁背景色

首先打開電腦上自帶的記事本程序,然後輸入html網頁基本結構語句。<html><body></body></html>

由於css樣式必須在標簽<head></head>之間,因此我們點擊<html>後面,輸入<head></head>標簽。

在head標簽之間輸入樣式標簽<style></style>,然後定義一些屬性,例如

<style type="text/css">

body {background-color: yellow} 定義網頁背景色為黃色;

h1 {background-color: #00ff00} 定義h1標簽背景色為#00ff00;

h2 {background-color: transparent} 定義h2標簽背景色為透明;

p {background-color: rgb(250,0,255)} 定義p標簽背景色為rgb值;

p.no2 {background-color: gray; padding: 20px;} 這個定義class屬性為no2的p標簽背景色為灰色,並且邊距為20px;

</style>

然後點擊body標簽後面輸入正文標簽內容,例如

<h1>這是KING</h1>

<h2>這是KING</h2>

<p>這是KING</p>

<p class="no2">這個KING設置20內邊距。</p>

點擊記事本菜單中的文件,選擇另存為,把內容保存為html網頁格式。雙擊打開預覽效果。

我們可以發現代碼中兩個同樣的<p>標簽顯示的css樣式卻不同,區別就在於樣式中定義的p.no2,這就是正文代碼中class="no2"的優勢所在,可以定義個性風格。

7、html網頁製作中如何設置背景圖片(如何引用)

1、首先打開Atom編輯器導入項目文件夾,先創建一個index.html的文件。定義一下html文件的主信息:

2、然後填寫自己的網頁內容, 設置一下樣式,直接在body後面加上background="圖片名字"即可插入圖片:

3、最後來到瀏覽器,刷新一下網頁,這樣就會顯示背景了:

8、html網頁製作,如何設置網頁背景色?

首先打開電腦上自帶的記事本程序,然後輸入html網頁基本結構語句。<html><body></body></html>

由於css樣式必須在標簽<head></head>之間,因此我們點擊<html>後面,輸入<head></head>標簽。

在head標簽之間輸入樣式標簽<style></style>,然後定義一些屬性,例如

<style type="text/css">

body {background-color: yellow} 定義網頁背景色為黃色;

h1 {background-color: #00ff00} 定義h1標簽背景色為#00ff00;

h2 {background-color: transparent} 定義h2標簽背景色為透明;

p {background-color: rgb(250,0,255)} 定義p標簽背景色為rgb值;

p.no2 {background-color: gray; padding: 20px;} 這個定義class屬性為no2的p標簽背景色為灰色,並且邊距為20px;

</style>

然後點擊body標簽後面輸入正文標簽內容,例如

<h1>這是KING</h1>

<h2>這是KING</h2>

<p>這是KING</p>

<p class="no2">這個KING設置20內邊距。</p>

點擊記事本菜單中的文件,選擇另存為,把內容保存為html網頁格式。雙擊打開預覽效果。

我們可以發現代碼中兩個同樣的<p>標簽顯示的css樣式卻不同,區別就在於樣式中定義的p.no2,這就是正文代碼中class="no2"的優勢所在,可以定義個性風格。

9、網頁設計如何設置網頁整體背景(要在背景上編輯網頁的)急急急!

很簡單,直接定義body的css樣式,代碼如下:

body{
background:url(images/001.jpg) no-repeat top center;
}

/*images/001.jpg 此為圖片的相對路徑*/

10、DW網頁設計如何設置背景圖片問題

要把圖像放入背景,需要使用 background-image 屬性。background-image 屬性的默認值是 none,表示背景上沒有放置任何圖像。

如果需要設置一個背景圖像,必須為這個屬性設置一個 URL 值:
body {background-image: url(/i/eg_bg_04.gif);}

大多數背景都應用到 body 元素,不過並不僅限於此。

下面例子為一個段落應用了一個背景,而不會對文檔的其他部分應用背景:
p.flower {background-image: url(/i/eg_bg_03.gif);}

您甚至可以為行內元素設置背景圖像,下面的例子為一個鏈接設置了背景圖像:
a.radio {background-image: url(/i/eg_bg_07.gif);}

理論上講,甚至可以向 textareas 和 select 等替換元素的背景應用圖像,不過並不是所有用戶代理都能很好地處理這種情況。

另外還要補充一點,background-image 也不能繼承。事實上,所有背景屬性都不能繼承。

背景重復

如果需要在頁面上對背景圖像進行平鋪,可以使用 background-repeat 屬性。

屬性值 repeat 導致圖像在水平垂直方向上都平鋪,就像以往背景圖像的通常做法一樣。repeat-x 和 repeat-y 分別導致圖像只在水平或垂直方向上重復,no-repeat 則不允許圖像在任何方向上平鋪。

默認地,背景圖像將從一個元素的左上角開始。請看下面的例子:

body
{
background-image: url(/i/eg_bg_03.gif);
background-repeat: repeat-y;
}

與網頁設計修改背景相關的知識