Wygląda to następująco.
http://www.fejmpodziemia.za.pl/Cywil.html
kod całej strony:
Kod
<!DOCTYPE html>
<html xml:lang="pl" lang="pl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title>Fejm siła w podziemiu!</title>
<style type="text/css">
/* <![CDATA[ */
ul, ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
ul {
border-bottom: 1px solid #888;
float: left;
width: 100%;
padding-left: 20px;
}
ul li {
float: left;
margin-right: 10px;
}
ul a:link, ul a:visited {
text-decoration: none;
display: block;
background-color: #ccc;
color: #000;
padding: 5px 10px;
border: 1px solid #888;
position: relative;
top: 1px;
}
ul a:hover {
background-color: #fff;
border-bottom-color: #fff;
}
/* ]]> */
</style>
<link rel="stylesheet" href="colorbox.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="jquery.colorbox.js"></script>
<script>
$(document).ready(function(){
$(".youtube").colorbox({iframe:true, innerWidth:425, innerHeight:344});
$(".callbacks").colorbox({
onOpen:function(){ alert('onOpen: colorbox is about to open'); },
onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
});
$('.non-retina').colorbox({rel:'group5', transition:'none'})
$('.retina').colorbox({rel:'group5', transition:'none', retinaImage:true, retinaUrl:true});
//Example of preserving a JavaScript event for inline calls.
$("#click").click(function(){
$('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
return false;
});
});
</script>
<style type="text/css">
p { border-radius: 25px }
p { border-style: double }
p { border-color: black }
p { background-color: #CCCCCC }
p { width: 500px }
</style>
</head>
<body background="tlo.jpg" ondragstart="return false" ondrag="return false">
<center><img src="baner.jpg" alt="Fejm" /></center>
<hr />
<ul class="menu_poziome">
<li><a href="index.html">Home</a></li>
<li><a href="Muzyka.html">Muzyka</a></li>
<li><a href="Linki.html">Linki</a></li>
<li><a href="Kontakt.html">Kontakt</a></li>
<li><a href="http://www.youtube.com/subscription_center?add_user=fejmpodziemia">Subskrybuj</a></li>
</ul>
<br /><br /><br />
<center>Fan page Cywila znajdziecie w dziale linki.</center><br /><br /><br /><br /><br />
<center><b>Galeria Treści Niechcianych 2012</b></center><br /><br /><br />
<center>
<div class="a">
Cywil - Nienawiść
Nie może nas zniszczyć
<a class="youtube" href="http://www.youtube.com/embed/6bIqATz38T0"><img src="http://img.youtube.com/vi/6bIqATz38T0/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Lucky Loser
<a class="youtube" href="http://www.youtube.com/embed/Ojw0LSpUBT8"><img src="http://img.youtube.com/vi/Ojw0LSpUBT8/default.jpg" /></a>
</div>
<div class="a">Cywil - Przed wejściem
<a class="youtube" href="http://www.youtube.com/embed/9useoAzqLgM"><img src="http://img.youtube.com/vi/9useoAzqLgM/default.jpg" /></a>
</div>
<div class="a">Cywil - Galeria Treści Niechcianych
<a class="youtube" href="http://www.youtube.com/embed/YYWLN8DxbRg"><img src="http://img.youtube.com/vi/YYWLN8DxbRg/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Szczęśliwy
<a class="youtube" href="http://www.youtube.com/embed/BBXTTA7YM_g"><img src="http://img.youtube.com/vi/BBXTTA7YM_g/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Teraz wiem
<a class="youtube" href="http://www.youtube.com/embed/zXg7ci-wyNk"><img src="http://img.youtube.com/vi/zXg7ci-wyNk/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Proza życia
<a class="youtube" href="http://www.youtube.com/embed/ilvXOnB3yyc"><img src="http://img.youtube.com/vi/ilvXOnB3yyc/default.jpg" /></a>
</div>
<div class="a">Cywil - Nie ma już bohaterów
<a class="youtube" href="http://www.youtube.com/embed/AKHJLgx1nfc"><img src="http://img.youtube.com/vi/AKHJLgx1nfc/default.jpg" /></a>
</div>
<div class="a">Cywil - Po drugiej stronie
<a class="youtube" href="http://www.youtube.com/embed/knQU3ZJOa48"><img src="http://img.youtube.com/vi/knQU3ZJOa48/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Plac Zabaw
<a class="youtube" href="http://www.youtube.com/embed/hl2sxCvQuyM"><img src="http://img.youtube.com/vi/hl2sxCvQuyM/default.jpg" /></a>
</div>
</div>
<div class="a"><br />Cywil - Nasze ekipy
<a class="youtube" href="http://www.youtube.com/embed/xaxT1eG5L10"><img src="http://img.youtube.com/vi/xaxT1eG5L10/default.jpg" /></a>
</div>
</div>
<div class="a">Cywil - Chłopcy, mężczyźni
<a class="youtube" href="http://www.youtube.com/embed/T0y_NuMDLEo"><img src="http://img.youtube.com/vi/T0y_NuMDLEo/default.jpg" /></a>
</div>
</center>
<style type="text/css">
.a { float:left; width: 140px; text-align="left"}
</style>
</body>
</html>
<html xml:lang="pl" lang="pl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title>Fejm siła w podziemiu!</title>
<style type="text/css">
/* <![CDATA[ */
ul, ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
ul {
border-bottom: 1px solid #888;
float: left;
width: 100%;
padding-left: 20px;
}
ul li {
float: left;
margin-right: 10px;
}
ul a:link, ul a:visited {
text-decoration: none;
display: block;
background-color: #ccc;
color: #000;
padding: 5px 10px;
border: 1px solid #888;
position: relative;
top: 1px;
}
ul a:hover {
background-color: #fff;
border-bottom-color: #fff;
}
/* ]]> */
</style>
<link rel="stylesheet" href="colorbox.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="jquery.colorbox.js"></script>
<script>
$(document).ready(function(){
$(".youtube").colorbox({iframe:true, innerWidth:425, innerHeight:344});
$(".callbacks").colorbox({
onOpen:function(){ alert('onOpen: colorbox is about to open'); },
onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
});
$('.non-retina').colorbox({rel:'group5', transition:'none'})
$('.retina').colorbox({rel:'group5', transition:'none', retinaImage:true, retinaUrl:true});
//Example of preserving a JavaScript event for inline calls.
$("#click").click(function(){
$('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
return false;
});
});
</script>
<style type="text/css">
p { border-radius: 25px }
p { border-style: double }
p { border-color: black }
p { background-color: #CCCCCC }
p { width: 500px }
</style>
</head>
<body background="tlo.jpg" ondragstart="return false" ondrag="return false">
<center><img src="baner.jpg" alt="Fejm" /></center>
<hr />
<ul class="menu_poziome">
<li><a href="index.html">Home</a></li>
<li><a href="Muzyka.html">Muzyka</a></li>
<li><a href="Linki.html">Linki</a></li>
<li><a href="Kontakt.html">Kontakt</a></li>
<li><a href="http://www.youtube.com/subscription_center?add_user=fejmpodziemia">Subskrybuj</a></li>
</ul>
<br /><br /><br />
<center>Fan page Cywila znajdziecie w dziale linki.</center><br /><br /><br /><br /><br />
<center><b>Galeria Treści Niechcianych 2012</b></center><br /><br /><br />
<center>
<div class="a">
Cywil - Nienawiść
Nie może nas zniszczyć
<a class="youtube" href="http://www.youtube.com/embed/6bIqATz38T0"><img src="http://img.youtube.com/vi/6bIqATz38T0/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Lucky Loser
<a class="youtube" href="http://www.youtube.com/embed/Ojw0LSpUBT8"><img src="http://img.youtube.com/vi/Ojw0LSpUBT8/default.jpg" /></a>
</div>
<div class="a">Cywil - Przed wejściem
<a class="youtube" href="http://www.youtube.com/embed/9useoAzqLgM"><img src="http://img.youtube.com/vi/9useoAzqLgM/default.jpg" /></a>
</div>
<div class="a">Cywil - Galeria Treści Niechcianych
<a class="youtube" href="http://www.youtube.com/embed/YYWLN8DxbRg"><img src="http://img.youtube.com/vi/YYWLN8DxbRg/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Szczęśliwy
<a class="youtube" href="http://www.youtube.com/embed/BBXTTA7YM_g"><img src="http://img.youtube.com/vi/BBXTTA7YM_g/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Teraz wiem
<a class="youtube" href="http://www.youtube.com/embed/zXg7ci-wyNk"><img src="http://img.youtube.com/vi/zXg7ci-wyNk/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Proza życia
<a class="youtube" href="http://www.youtube.com/embed/ilvXOnB3yyc"><img src="http://img.youtube.com/vi/ilvXOnB3yyc/default.jpg" /></a>
</div>
<div class="a">Cywil - Nie ma już bohaterów
<a class="youtube" href="http://www.youtube.com/embed/AKHJLgx1nfc"><img src="http://img.youtube.com/vi/AKHJLgx1nfc/default.jpg" /></a>
</div>
<div class="a">Cywil - Po drugiej stronie
<a class="youtube" href="http://www.youtube.com/embed/knQU3ZJOa48"><img src="http://img.youtube.com/vi/knQU3ZJOa48/default.jpg" /></a>
</div>
<div class="a"><br />Cywil - Plac Zabaw
<a class="youtube" href="http://www.youtube.com/embed/hl2sxCvQuyM"><img src="http://img.youtube.com/vi/hl2sxCvQuyM/default.jpg" /></a>
</div>
</div>
<div class="a"><br />Cywil - Nasze ekipy
<a class="youtube" href="http://www.youtube.com/embed/xaxT1eG5L10"><img src="http://img.youtube.com/vi/xaxT1eG5L10/default.jpg" /></a>
</div>
</div>
<div class="a">Cywil - Chłopcy, mężczyźni
<a class="youtube" href="http://www.youtube.com/embed/T0y_NuMDLEo"><img src="http://img.youtube.com/vi/T0y_NuMDLEo/default.jpg" /></a>
</div>
</center>
<style type="text/css">
.a { float:left; width: 140px; text-align="left"}
</style>
</body>
</html>