Notice: Undefined variable: this in /home/dimarini/public_html/libraries/src/Application/CMSApplication.php on line 441

CSS Уеб страница

В долният пример е показано създаването на начална уеб страница с използване на свойството float. С помощта на същото свойство е реализирано хоризонтално меню с хипер връзки (виж примера в браузъра):


<!DOCTYPE html>
  <head>
    <style type="text/css">
          /*Контейнер, в който са разположени всички останали елементи*/
	  div.container  {
	  float:center
	  width:80%;
	  margin:100px;
	  border:1px solid gray;
	  line-height:150%;
	  } 
	  /*Горна и долна част на страницата*/
	  div.header,div.footer  {
	  padding:0.5em;
	  color:white;
	  background-color:gray;
	  }
	  /*Ляв сегмент на страницата*/
	  div.left  {
	  float:left;
	  width:160px;
	  height:190px;
	  margin:0;
	  padding:1em;
	  background-color:#b8b8b8;
	  }
	  /*Десен сегмент на страницата*/
	  div.content  {
	  margin-left:190px;/*Изместване в дясно*/
	  padding:1em;
	  height:190px;
	  background-image:url('subsidiary/abstract.jpg');
	  }
	  /*Изображение на логото*/ 
	  img.logo  {
	  float:right;
	  left:900px;/*Изместване в дясно*/ 
      top:250px;}/*Изместване на долу*/
	  }
	  /*Представяне на менюто като неномериран списък*/
	  ul  {
	  float:right;
	  width:100%;
	  padding:0px;
	  margin:0px 5px 0px 0px;/*Изместване в ляво*/ 
          list-style-type:none;}
	  }
	  a  {
	  float:right;
	  width:6em;
	  text-align:center;
	  color:white;
	  background-color:#480000;
	  margin: 0px 10px 0px 0px;
	  border-right:1px solid gray;
	  }     
	  a:hover {background-color:#B8B8B8;}
	  li {display:inline;}
	</style>
  </head>
  <body>
      <div class="container">
	  <div class="header">
	  <ul>
	    <li><a href="http://zdravoslovni-hrani.net/">Здравословно</a></li>
	    <li><a href="http://dimarini.net/xhtml">XHTML</a></li>
	    <li><a href="http://dimarini.net/css">CSS</a></li>
	    <li><a href="http://dimarini.net/contacts">КОНТАКТИ</a></li>
	  </ul>
	  <h1>Dimarini.net</h1>
	  </div>
	  <div class="left"> 
	  <p>"Корените на учението са горчиви, но плодовете — сладки."     
	  Леонардо да Винчи (1452-1519)</p>
	  </div>
	  <div class="content"> 
	  <h2><img class="logo" src="/subsidiary/logo.png" />Безплатни видео уроци за Joomla 1.5</h2>
	  <p>В сайта са дадени кратки ръководства за работа с HTML, CSS, JavaScript, PHP.</p> 
	  <p>Разгледани са и някои математически задачи.</p> 
	  </div>
	  <div class="footer">Никола Меранзов © 2010 </div> 
	  </div> 
  </body>
</html>

Ръководството е съставено от Никола Меранзов
0888 414 809
Този имейл адрес е защитен от спам ботове. Трябва да имате пусната JavaScript поддръжка, за да го видите.
http://dimarini.net