Форум программистов [Powered by Invision Power Board]

Код


<head>
<title> Мир океанов</title>
         
         <link rel="stylesheet" type="text/css" href="CSS index Ocean.css" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        
        
        <link href="css/bootstrap.css" rel="stylesheet"/>
        
       <script type="text/javascript" src="jquery-3.1.1.min.js"></script>
       <script src="js/bootstrap.min.js"></script>
       <script src="js/s3Slider.js" type="text/javascript"></script>


</head>
       <body>
      
    <div class = "container-fluid" > <!-соединяем все ниже шапки в единый контейнер>
           <div id = "header" class = "row"> 
           <div class = "img-responsive" "col-xs-12 col-sm-12 col-md-912col-lg-12">
           </div>
           <div class = "col-xs-4 col-sm-4 col-md-4 col-lg-4"><h3 align = "left"> Мир океанов</h3> 
           </div>
           </div>
           <div class = "row">
        <div id = "MenuOcean" class = "col-md-12 col-xs-12 col-sm-12 col-lg-12">
<ul>
        <li><a  href="">Главная</a> 
        </li><li><a  href="">Статьи </a>
        </li><li><a  href="">Фотографии</a></li>
        </ul>
        </div>
        </div>
        </div>

       </body>
       </html>

Код


#header {
    background-image:url(Head.JPG);
    height:40%;
    font-size: 20px;
    color: yellow;
    padding:25px;
    
    margin: 0px;
}

    #slide {
        background-image:url(fon4.jpg);
    }

    #MenuOcean ul {
        list-style: none;
        margin: 0px;
        padding:0px;
        background: linear-gradient(to top, #1E388F 20%,#6E84CE  50%, #1A3075 80%);
        text-align: center;
        
    }

    #MenuOcean > ul > li  {
        display: inline-block;
        margin:0px;
        
    }

    #MenuOcean> ul > li > a {
        display: block;
        padding: 20px 20px;
        text-decoration: none;
        color: #070719;
        line-height: 40px;
        font-size: 22px;
        font-style: ;
        font-weight: bold;
        margin: 0px;
        
    }
     #MenuOcean li a:hover {
    font-size:22px; 
    color:#CED8F6;
    }