導航:首頁 > 萬維百科 > 網頁設計導航條圖片透明

網頁設計導航條圖片透明

發布時間:2020-12-15 01:02:59

1、那位大神可以告訴在下網頁設計中的導航圖片變色怎麼做?

你確定不是copy背景變色?
滑鼠經過是這樣的
背景顏色:
div a { display:block; width:100px; height:30px; background:#fff;}
div a:hover { background:#999;}

背景圖片:
div a { display:block; width:100px; height:30px; background:url(../images/1.jpg) no-repick;}
div a:hover { background:url(../images/2.jpg) no-repick;}

沒理解可以繼續問,望採納,謝謝!

2、網頁製作中,導航條通常包括幾種狀態。分別是什麼

1.滑鼠經過
2.滑鼠按下
3.滑鼠松開
4.滑鼠離開

3、網頁設計設置導航裡面這個漸變透明背景怎麼弄?求解。。。

可以用PNG格式的文件

4、網頁製作-導航條背景圖片

<li class="title">Service</li>
<li class="back" style="background:url(添加你得漸變背景,是整個的背景。)">
<ul>
<li>Language Services</li>
<li>Market Research</li>

<li>Software Development</li>

<li>Corporate Training</li>

</ul>

</li>

5、網站網頁設計中,下拉導航條會被網站上的其它圖片擋住。怎解?30分求解

怎麼這么熟悉的模板?蘭亭集序的?
基本上出現這種情況是由於z-index的優先順序別問題。
用火狐fixbug查看一下,圖片或者放置圖片容器的z-index是不是要比下拉菜單來的高。

6、網頁設計 製作導航條 如何製作

一, 鍵盤上可以直接輸 |
二, 如果是一條虛線的話, 那麼是這樣做的:
用Fireoworks新建一個1*3PX的圖片, 在中間畫一個點,然後將其導出,再在DW里建一個單元格,將其背景設為這個圖片(注意,讓它垂直方向重復,水平方向不重復 -- CSS),大功告成
三,CSS
<a href="#" style="border-right:1px solid #000">鏈接</a>

7、用HTML製作網頁,往導航欄中的每個標簽加一個背景圖片,為什麼顯示不出來呢?

你問的問題不明白,製作導航欄也可以用很多方法,你該把代碼發上來給大家看看吧。
我之前製作的導航欄是用<ul><li>製作,剛開始也是背景無法顯示,後來設置了<ul>的高度就好了。

8、網頁設計`:導航條」存在幾種狀態,分別是什麼?

滑鼠經過

滑鼠按下

滑鼠松開

滑鼠離開

9、網頁設計導航條

下面的代碼,你去看看,不好用再說。
<!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: #0099FF;
}
#navigation {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
#navigation ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
#navigation li {
border-bottom-style: none;
border-bottom-color: #ed9f9f;
border-top-style: none;
border-right-style: none;
border-left-style: none;
border-top-color: #ed9f9f;
border-right-color: #ed9f9f;
border-left-color: #ed9f9f;
float: left;
}
#navigation li a {
text-decoration: none;
display: block;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 0.5em;
border-right-width: 1px;
border-left-width: 12px;
border-right-style: solid;
border-left-style: solid;
border-right-color: #711515;
border-left-color: #711515;
border-top-style: none;
border-bottom-style: none;
width: 50px;
text-align: center;
margin: 0px;
}
#navigation li a:link, #navigation li a:visited {
color: #FFFFFF;
background-color: #c11136;
}
#navigation li a:hover {
color: #ffff00;
background-color: #990020;
}
#navigation ul li:hover ul,#navigation ul a:hover ul {
visibility: visible;
}
#navigation ul ul {
visibility: hidden;
}
#navigation ul ul li {
clear: both;
}
#navigation ul ul li a {
border: 1px solid #CCCCCC;
}
#navigation ul ul li a:link, #navigation ul ul li a:visited {
color: #000000;
background-color: #FFCC66;
}
#navigation ul ul li a:hover {
color: #006699;
background-color: #99CC00;
}
.nav {
border: 1px solid #0099CC;
position: absolute;
width: 357px;
left: 112px;
top: 34px;
}
.nav ul {
margin: 0px;
padding: 0px;
list-style-type: none;
font-size: 12px;
}
.nav li {
float: left;
}
.nav li a {
border: 1px solid #FF3333;
display: block;
padding: 5px;
background-color: #FFCC33;
text-decoration: none;
}
-->
</style>
</head>

<body>
<div id="navigation">
<ul>
<li><a href="#">首頁</a></li>
<li><a href="#">關於我們</a></li>
<li><a href="#">產品展示</a>
<div>
<ul>
<li><a href="#">產品1一</a></li>
<li><a href="#">產品2一</a></li>
<li><a href="#">產品3一</a></li>
<li><a href="#">產品4一</a></li>
<li><a href="#">產品5一</a></li>
<li><a href="#">產品6一</a></li>
</ul>
</div>
</li>
<li><a href="#">聯系電話</a>
<div>
<ul>
<li><a href="#">產品1一</a></li>
<li><a href="#">產品2一</a></li>
<li><a href="#">產品3一</a></li>
<li><a href="#">產品4一</a></li>
<li><a href="#">產品5一</a></li>
<li><a href="#">產品6一</a></li>
</ul>
</div>
</li>
<li><a href="#">公司介紹</a></li>
</ul>
</div>

</body>
</html>

與網頁設計導航條圖片透明相關的知識