fentg.com

ФОРУМЪТ на ФЕНОВЕТЕ на НТГ
Дата и час: Пет Май 14, 2021 1:35 pm

Часовете са според зоната UTC + 2 часа [ DST ]


Правила на форума


Натиснете за да видите правилата



Напиши нова тема Отговори на тема  [ 2 мнения ] 
Автор Съобщение
 Заглавие: Hover на линкове, HTML и CSS
МнениеПубликувано на: Вто Ное 03, 2009 9:44 pm 
Offline
НЕЧОВЕК
Аватар

Регистриран на: Нед Ное 02, 2008 5:04 pm
Мнения: 146
Местоположение: localhost
Айде Бат Емо... тествах го под FF 3.5 и под IE 6 => ще бачка и под IE 7 :D

Код:
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN'
   'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml'>
   <head>
      <title>Тест за Бат Емо</title>
      <meta http-equiv='Content-Type' content='text/html; charset="windows-1251"' />
      <style>
         #container {
            width:500px;
            margin:auto;
            
            /*1-во дължина от 500 пиксела,
            която е сбор от дължините на
            .left, .center и .right.
            2-ро margin:auto; за да се
            центрира по хоризонталата.  */
         }
         #container a:hover {
            background-color:red;
            /*
               При линк, чийто родител се явява
               дива с id container - се променя
               bg color-a на червен.
            */
         }
         .left {
            width:100px; /* Дължина 100 пиксела */
            float:left;  /* флоутваме всички елементи вляво, за да са на 1 ред. */
            text-align:left; /* подравняване на текста вляво. */
         }
         .center {
            width:300px; /* Дължина 100 пиксела */
            float:left;      /* флоутваме всички елементи вляво, за да са на 1 ред. */
            text-align:center;  /* подравняване на текста в центъра. */
         }
         .right {
            width:100px; /* Дължина 100 пиксела */
            float:left;  /* флоутваме всички елементи вляво, за да са на 1 ред. */
            text-align:right; /* подравняване на текста вдясно. */
         }
         .lnk{
            float:left; /* Флоутваме класа lnk */
         }
         .clr {clear:both;}
      </style>
      
   </head>
   <body>
      <div id="container">
         <a class="lnk" href="#">
            <div class="left">XXX</div>
            <div class="center">YYY</div>
            <div class="right">ZZZ</div>
         </a>
         <div class="clr"><!-- Tova e div za izchistvane na floata. --></div>
         <br/>
         
         <a class="lnk" href="#">
            <div class="left">AAA</div>
            <div class="center">BBB</div>
            <div class="right">CCC</div>
         </a>
         <div class="clr"><!-- Tova e div za izchistvane na floata. --></div>
         <br/>
         
         <a class="lnk" href="#">
            <div class="left">Георги</div>
            <div class="center">Хапчета против простуда</div>
            <div class="right">15.58 лв.</div>
         </a>
         <div class="clr"><!-- Tova e div za izchistvane na floata. --></div>
      </div>
   </body>
</html>

_________________
Изображение


Върнете се в началото
 Профил  
 
 Заглавие: Re: Hover на линкове, HTML и CSS
МнениеПубликувано на: Сря Ное 04, 2009 11:22 am 
Offline
Администратор
Аватар

Регистриран на: Нед Ное 02, 2008 5:30 pm
Мнения: 3550
Ето за това те обичам!

_________________
Изображение


Върнете се в началото
 Профил  
 
Покажи мненията от миналия:  Сортирай по  
Напиши нова тема Отговори на тема  [ 2 мнения ] 

Часовете са според зоната UTC + 2 часа [ DST ]


Кой е на линия

Потребители разглеждащи този форум: 0 регистрирани и 1 госта


Вие не можете да пускате нови теми
Вие не можете да отговаряте на теми
Вие не можете да променяте собственото си мнение
Вие не можете да изтривате собствените си мнения
Вие не можете да прикачвате файл

Иди на:  
cron
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
Превод: Ioan Filipov