Қосымшалар
Сайттың алғашқы бетінің коды:
<html><head><title>Мұзарт</title>
<link href="style.css" type="text/css" rel="stylesheet" />
<link href="my.css" rel="stylesheet" type="text/css" />
<style>
* {
padding: 0;
margin: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
nav {
width: 90%;
margin: 100px auto;
overflow: hidden;
}
nav ul {
list-style: none;
overflow: hidden;
}
nav li a {
background: #444;
border-right: 1px solid #fff;
color: #fff;
display: block;
float: left;
font: 700 13px/1.4 'PT Serif', Helvetica, Verdana, Arial, sans-serif;
padding: 10px;
text-align: center;
text-decoration: none;
text-transform: uppercase;
width: 12.5%;
-webkit-transition: background 0.5s ease;
-moz-transition: background 0.5s ease;
-o-transition: background 0.5s ease;
-ms-transition: background 0.5s ease;
transition: background 0.5s ease;
}
nav li a:hover {
background: #222;
}
nav small {
font: 100 11px/1 Helvetica, Verdana, Arial, sans-serif;
text-transform: none;
color: #aaa;
}
nav li:last-child a {
border: none;
}
nav .blue {
margin-top: 50px;
}
.blue li a {
background: #75b1de;
}
.blue small {
color: white;
}
.blue li a:hover {
background: #444;
}
nav .red {
margin-top: 50px;
}
.red li a {
background: #5C0002;
}
.red small {
color: white;
}
.red li a:hover {
background: #a60306;
}
@media only screen and (max-width : 1220px),
only screen and (max-device-width : 1220px){
nav li a {
font: 700 10px/1.4 'PT Serif', Helvetica, Verdana, Arial, sans-serif;
}
nav small {
font: 100 10px/1 Helvetica, Verdana, Arial, sans-serif;
}
}
@media only screen and (max-width : 930px),
only screen and (max-device-width : 930px){
nav li a {
width: 25%;
border-bottom: 1px solid #fff;
font: 700 11px/1.4 'PT Serif', Helvetica, Verdana, Arial, sans-serif;
}
nav li:last-child a, nav li:nth-child(4) a {
border-right: none;
}
nav li:nth-child(5) a, nav li:nth-child(6) a, nav li:nth-child(7) a, nav li:nth-child(8) a {
border-bottom: none;
}
}
@media only screen and (max-width : 580px),
only screen and (max-device-width : 580px){
nav li a {
width: 50%;
font: 700 12px/1.4 'PT Serif', Helvetica, Verdana, Arial, sans-serif;
padding-top: 12px;
padding-bottom: 12px;
}
nav li:nth-child(even) a {
border-right: none;
}
nav li:nth-child(5) a, nav li:nth-child(6) a {
border-bottom: 1px solid #fff;
}
}
@media only screen and (max-width : 320px),
only screen and (max-device-width : 320px){
nav li a {
font: 700 11px/1.4 'PT Serif', Helvetica, Verdana, Arial, sans-serif;
}
}
</style>
</head>
<div class="container">
<header> </header>
<body bgcolor=#71624E text=000000 leftMargin=0 topMargin=0 marginwidth=0 marginheight=0>
<nav>
<ul>
<li>
<a href="index.html">Басты бет<br /> <small>МУЗАРТ</small></a></li>
<li><a href="top.html"> Мүшелері<br /> <small>МУЗАРТ</small></a></li>
<li><a href="tarihy.html">Тарихы<br /> <small>МУЗАРТ</small></a></li>
<li><a href="foto.html">Суреттер<br /> <small>МУЗАРТ</small></a></li>
<li><a href="audio.html"> Жайлы<br /> <small>АВТОР</small></a></li>
<li><a href="muz.html">Әндер<br /> <small>МУЗАРТ</small></a></li>
<li><a href="beinebayan.html">Бейнебаян<br /> <small>МУЗАРТ</small></a></li>
<li><a href="muzmatin.html"> Мәтіндері<br /> <small>ӘН</small></a></li>
</ul></nav>
<br>
<h2>Жаңалықтар</h2><br>
<hr width=960 size=5 color="black">
<br>
<h2>Музарттың сапарлары</h2><br>
<img width="300px" heght="300" class="img3" src="images/gost.jpg">
<p><strong>Оңтүстікке сапарлар:</strong>
<br><strong>Қызылорда қаласы:</strong> 12-13 қараша
<br><strong>Шымкент қаласы:</strong>14-15 қараша
<br><strong> Тараз қаласы:</strong> 18-19 қараша
<br><br><br><br><br><br><br><br><br><br><br><br><br>
<hr width=960 size=5 color="black">
<br>
<CENTER>
</div>
</body>
</html>