这是我的HTML代码:
<HTML><head> <Meta http-equiv="Content-Type" content="text/HTML; charset=iso-8859-1" /> <Meta http-equiv="Content-Style-Type" content="text/CSS" /> <Title>text</Title> <link href="style.CSS" rel="stylesheet" type="text/CSS" /></head><body><div ></div><div ID="wrapper"> <ul ID="nav"> <li><a href="index.htm">Inicio</a></li> <li><a href="sobre.htm">Sobre a banda</a></li> <li><a href="membros.htm">Membros</a></li> <li><a href="bilhetes.htm">Bilhetes</a></li> <li><a href="galeria.htm">galeria</a></li> <li><a href="areapessoal.PHP">Área Pessoal</a></li> </ul> <h1><a href="index.htm"><img src="images/a7x-avenged-sevenfold-7050435-1024-831.jpg" wIDth="130" height="25" alt="Rock Band" /></a></h1> <div ID="body"> <div ID="bodyi"> <div ID="bodyj"> <div ID="sIDebar"> <div > <h2>galeria de imagens</h2> <p>Aqui poderá encontrar uma galeria de imagens da banda,com fotos de concertos,<img src="images/denmark.jpg" wIDth="91" height="72" alt="" /> entre outras imagens.</p> <p ><a href="galeria.htm">Ver</a></p> </div> <div > <h2>Noticias</h2> <h3>18 de Abril,2011</h3> <h4>"So Far Away" vai ter vIDeoclip</h4> <p>Muitos se questionavam se o mais recente single dos Avenged Sevenfold,"So Far Away",ia ter direito a um vIDeoclip. Eis que surge a boa notícia para os fãs dos A7X: So Far Away vai ter vIDeoclip. <img src="images/63781127.jpg" wIDth="95" height="73" alt="pic 3" /> Já foram divulgadas algumas fotos do set de filmagens.</p> <h3>10 de Março,2011</h3> <h4>A7X nomeados para a Metal Hammer Golden Gods Awards 2011</h4> <p>Os Avenged Sevenfold foram nomeados para a Metal Hammer Golden Gods Awards 2011 em duas categorias. As categorias onde os A7X estão a participar são as seguintes:<p> - Best International Band (Melhor Banda Internacional)<p> - Best shredder (com o Synyster Gates) (Melhor shredder)</p> </div> </div> <div ID="content"> <center><img src="images/avengeds.jpg" wIDth="346" height="234" alt="four men walking" /></center> <div > <h2>O album mais recente</h2> <img src="images/nightmare.jpg" wIDth="82" height="80" alt="Unwired album cover" /> <p>Os californianos Avenged Sevenfold estão de volta aos discos com "Nightmare". Solos de guitarra,vocalizações rasgadas e um som contagiante continuam a ser a base do sucesso de uma das bandas de heavy-Metal com mais fãs no mundo inteiro. Fundados em 1999 por M. Shadows,Synyster Gates,Zacky Vengeance,Johnny Christ e The Rev - baterista que faleceu em Dezembro de 2009 passado e que foi substituIDo neste disco por Mike Portnoy,dos Dream Theater - os Avenged Sevenfold já contam com cinco discos de originais na sua carreira.</p> <div ></div> <h2>Musicas com maior sucesso</h2> <table summary="track downloads" border="0" cellspacing="0"> <tr> <th wIDth="55%">Faixa</th> <th>Album</th> <th >Dowload links</th> </tr> <tr> <td>Bat Country</td> <td>City of Evil</td> <td ><a href="http://www.youtube.com/watch?v=IHS3qJdxefY">Ouvir</a></td> </tr> <tr> <td>Beast and the Harlot</td> <td>City of Evil</td> <td ><a href="http://www.youtube.com/watch?v=7bDg7n-chhU">Ouvir</a></td> </tr> <tr> <td>Seize the Day</td> <td>City of Evil</td> <td ><a href="http://www.youtube.com/watch?v=jUkol9RE72o">Ouvir</a></td> </tr> <tr> <td>Almost Easy</td> <td>Avenged Sevenfold</td> <td ><a href="http://www.youtube.com/watch?v=Fi_GN1pHCVc">Ouvir</a></td> </tr> <tr> <td>Afterlife</td> <td>Avenged Sevenfold</td> <td ><a href="http://www.youtube.com/watch?v=HIRNdveLnJI">Ouvir</a></td> </tr> <tr> <td>Nightmare</td> <td>Nightmare</td> <td ><a href="http://www.youtube.com/watch?v=94bGzWyHbu0">Ouvir</a></td> </tr> <tr> <td>Welcome to the Family</td> <td>Nightmare</td> <td ><a href="http://www.youtube.com/watch?v=1OZs7IoWTvc">Ouvir</a></td> </tr> </table> </div> </div> <div ></div> </div> </div> </div> <div align="right"> <Font size="2">text</Font> </div></div></body></HTML>
这里是CSS代码:
.head{ wIDth: 150px; height: 160px;}body { Font-family: tahoma,helvetica,arial,sans-serif; Font-size: 12px; text-align: center; background: #000; color: #ddd4d4; padding-top: 12px; line-height: 2; background-image: url('images/background.jpg'); background-repeat: no-repeat; background-attachment: fixed; background-size: 100%; opacity: 0.8; filter:Alpha(opacity=80);}td,th { Font-size: 12px; text-align: left; line-height: 2;}#wrapper { margin: auto; text-align: left; wIDth: 832px; position: relative; padding-top: 27px;}#body { background: url(images/body_bg_1.gif) repeat-y; wIDth: 832px;}#bodyi { background: url(images/body_top_1.gif) no-repeat; wIDth: 832px;}#bodyj { background: url(images/body_bot_1.gif) bottom no-repeat; padding: 1px 0; }#body2 { background: url(images/body_bg_2.gif) repeat-y; wIDth: 832px;}#bodyi2 { background: url(images/body_top_2.gif) no-repeat; wIDth: 832px;}#bodyj2 { background: url(images/body_bot_2.gif) bottom no-repeat; padding: 1px 0;}h1,h2,h3,#nav,#nav li { margin: 0; padding: 0;}#nav { Font-size: 10px; position: absolute; right: 0; top: 12px; line-height: 1.2; padding-left: 120px;}#nav li { float: left; wIDth: 108px; List-style: none; margin-left: 2px; border-bottom: 1px solID black;}#nav a { background: #738d09; color: #2e3901; Font-weight: bold; text-decoration: none; display: block; text-align: center; padding: 1px 0;}#sIDebar { float: left; wIDth: 250px; padding-left: 4px;}#sIDebar .content { padding-left: 24px;}#sIDebar .content img { float: left; clear: left; margin: 5px 5px 5px 0;}#sIDebar .divIDer { background: url(images/left_splitter.gif) center no-repeat; height: 5px; wIDth: 169px;}#content { float: right; wIDth: 462px;}#content1 { float: left; wIDth: 800px;}#content1 .content { margin: 7px 35px 7px 20px; padding-left: 20px;}#content .content { margin: 7px 55px 7px 17px;}#content .content table { wIDth: 310px; margin-right: 0px;}#content .content table td,#content .content table th { padding-right: 10px;}#content .content table td.download { text-align: right; padding-right: 0px;}#content .divIDer { background: url(images/right_splitter.gif) repeat-x; height: 5px;}h1 { position: absolute; left: 0; top: 0;}h2 { Font-size: 10px; color: #cf9118; margin: 1em 0;}h3 { Font-size: 10px; margin: 1em 0;}h5 { Font-size: 20px; color: #cf9118; margin: 1em 0; text-align: center;}h6 { Font-size: 18px; margin: 1em 0;}p { margin: 1em 0;}img { border: 0;}img.left { float: left; margin-right: 14px; }img.right { float: right; margin-left: 14px; }.readmore { text-align: right;}.hIDden { visibility: hIDden;}.clear { clear: both;}a { color: #f0b33c; Font-weight: bold; text-decoration: none;}a:visited { color: #cf9118;}a:hover { text-decoration: underline;}table a { text-decoration: underline; Font-weight: normal; color: #7f7c79;}#power {color:#fff;text-align:center;}#power a {color:#fff;}
任何帮助的赞赏…提前感谢.
解决方法 我认为最简单的解决方案,而不是使身体元素部分透明,将是添加一个额外的div来保持背景,并改变不透明度,而不是.所以你可以添加一个div:
<div ID="background"></div>
并将身体元素的背景CSS移动到它,以及一些额外的定位属性,如下所示:
#background { position: fixed; top: 0; left: 0; wIDth: 100%; height: 100%; background-image: url('images/background.jpg'); background-repeat: no-repeat; background-attachment: fixed; background-size: 100%; opacity: 0.8; filter:Alpha(opacity=80);}
这里有一个例子:http://jsfiddle.net/nbVg4/4/
总结以上是内存溢出为你收集整理的html – 如何让我的网站的背景透明,而不使内容(图像和文字)也是透明的?全部内容,希望文章能够帮你解决html – 如何让我的网站的背景透明,而不使内容(图像和文字)也是透明的?所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)