Здравейте значи искам да си направя едно меню с картинки и отдолу на картинките съответно с текст. Значи стигнах до картинките обаче не знам как да вмъкна текста под картинките и да вървят заедно с картинките ето и кода:
HTML:
<!doctype html>
<html lang="en">
<HEAD>
<title>ЛИЧНО ПОРТФОЛИО ТАНЕР РЕДЖЕБ</title>
<meta charset="utf-8" />
<meta name ="description" content=" Лично Портфолио, Портфолио, Personal Portfolio, Portfolio" />
<meta name ="keywords" content=" Графичен Дизайн, Уеб Дизайн,Дизайн, Лично Портфолио, Портфолио, Portfolio, Personal Portfolio, Graphoc Design, Web Design" />
<meta name ="robots" content="index, follow" />
<link type="text/css" rel="stylesheet" href="scripts/css.css" />
<link rel="shortcut icon" href="img/favicon.ico">
</HEAD>
<BODY>
<div id="background">
<div id="menucont">
<ul class="menu">
<li><a href="#"><img src="img/home_button.png" title="#" /></a></li>
<li><a href="#"><img src="img/for me_button.png" title="#" /></a></li>
<li><a href="#"><img src="img/fotogaleria_button.png" title="#" /></a></li>
<li><a href="#"><img src="img/portfolio_button.png" title="#" /></a></li>
<li><a href="#"><img src="img/contact_button.png" title="#" /></a></li>
</ul>
</div>
</div>
</BODY>
</HTML>
CSS:
html, body { height:100%; background:#5b5b5b; color: #fff; font: 12px Arial; margin: 0; padding: 0; }
#background{ width: 521px; height: 699px; background: #909090; border-left: 1px solid white; border-right: 1px solid white; position: absolute; left: 624px;}
#menucont{width: 521px; height: 84px; position: absolute; left: -1px;}
.menu {list-style-type:none; }
.menu li{display:inline; margin-right: 39px; }
HTML:
<!doctype html>
<html lang="en">
<HEAD>
<title>ЛИЧНО ПОРТФОЛИО ТАНЕР РЕДЖЕБ</title>
<meta charset="utf-8" />
<meta name ="description" content=" Лично Портфолио, Портфолио, Personal Portfolio, Portfolio" />
<meta name ="keywords" content=" Графичен Дизайн, Уеб Дизайн,Дизайн, Лично Портфолио, Портфолио, Portfolio, Personal Portfolio, Graphoc Design, Web Design" />
<meta name ="robots" content="index, follow" />
<link type="text/css" rel="stylesheet" href="scripts/css.css" />
<link rel="shortcut icon" href="img/favicon.ico">
</HEAD>
<BODY>
<div id="background">
<div id="menucont">
<ul class="menu">
<li><a href="#"><img src="img/home_button.png" title="#" /></a></li>
<li><a href="#"><img src="img/for me_button.png" title="#" /></a></li>
<li><a href="#"><img src="img/fotogaleria_button.png" title="#" /></a></li>
<li><a href="#"><img src="img/portfolio_button.png" title="#" /></a></li>
<li><a href="#"><img src="img/contact_button.png" title="#" /></a></li>
</ul>
</div>
</div>
</BODY>
</HTML>
CSS:
html, body { height:100%; background:#5b5b5b; color: #fff; font: 12px Arial; margin: 0; padding: 0; }
#background{ width: 521px; height: 699px; background: #909090; border-left: 1px solid white; border-right: 1px solid white; position: absolute; left: 624px;}
#menucont{width: 521px; height: 84px; position: absolute; left: -1px;}
.menu {list-style-type:none; }
.menu li{display:inline; margin-right: 39px; }