Кластың барлық элементтеріне жылжу әсерін қосыңыз

I made a simple website, it looks like this: enter image description here

Бірақ, көрініп тұрғандай, әуе қозғалысы тек тінтуірдің нақты жерде жұмыс істейді! (мұнда ipsum) Бірақ менің мақсатым - барлық элементтерге арналған жүгірткі! Сонымен, мен hover әсерімен p.hov: hover деген сыныпты қосқандықтан, өзіңіз көріп отырсыз:


  

Lorem

ipsum

dolor

sit

amen

  

 p {    
color:#f2f2f2;
background:#ff4a4a;
font-size: 75px;
line-height: 74px;
font-weight:700;
margin: 0 5px 24px;
float:left;
padding: 10px;
margin: 0 5px 24px;
font-family: 'Route', serif;
   }

  p.hov:hover {box-shadow: 
 1px 1px #666,
 2px 2px #666,
 3px 3px #666;}

Менің ағылшын тілім үшін кешірім сұраймын! Ал рахмет!

2
Айтпақшы, толтырғыш мәтіні «amet» ішінде аяқталады.
қосылды автор Chris, көзі

10 жауаптар

Барлық блоктардың көлеңке болуын қаласаңыз, әуенді басты элементке қойыңыз:

blockquote:hover p.hov {
    box-shadow: 
    1px 1px #666,
    2px 2px #666,
    3px 3px #666;
}
4
қосылды
Иә жұмыс істеді! Рахмет
қосылды автор Em Sta, көзі

Барлық блоктардың көлеңке болуын қаласаңыз, әуенді басты элементке қойыңыз:

blockquote:hover p.hov {
    box-shadow: 
    1px 1px #666,
    2px 2px #666,
    3px 3px #666;
}
4
қосылды
Иә жұмыс істеді! Рахмет
қосылды автор Em Sta, көзі

Мұны көріңіз

blockquote:hover p.hov 

DEMO

3
қосылды
түрлендірілген нұсқасы, бұл ағындық әсері әлі де сөздер арасында орналасқан: jsfiddle
қосылды автор aaronjbaptiste, көзі

Instead use

tag for each one why wont use them all? Here an example:

HTML


   

Lorem

ipsum

dolor

sit

amen


CSS

blockquote:hover p.hov {
    box-shadow: 
    1px 1px #666,
    2px 2px #666,
    3px 3px #666;
}
3
қосылды
сонда бос орын жоғалтады.
қосылды автор J. Ghyllebert, көзі
иә, бірақ сіздің CSS дұрыс емес. Бұл блоккуотаның астындағы көлеңкеді көрсететіндіктен (және, сонымен бірге, бос кеңістікте де).
қосылды автор J. Ghyllebert, көзі
Мен қызыл блоктар арасындағы бос орынды білдіреді.
қосылды автор J. Ghyllebert, көзі
Оңай түзетуге рұқсат етіңіз, маған дауыс беріңіз :)
қосылды автор copypaste, көзі
Қазір жақсы ... ??
қосылды автор copypaste, көзі
Сіз бәрібір & nbsp; қосуыңызға болады.
қосылды автор copypaste, көзі
Менің досымның өткір көзі :)
қосылды автор copypaste, көзі

Instead use

tag for each one why wont use them all? Here an example:

HTML


   

Lorem

ipsum

dolor

sit

amen


CSS

blockquote:hover p.hov {
    box-shadow: 
    1px 1px #666,
    2px 2px #666,
    3px 3px #666;
}
3
қосылды
сонда бос орын жоғалтады.
қосылды автор J. Ghyllebert, көзі
Мен қызыл блоктар арасындағы бос орынды білдіреді.
қосылды автор J. Ghyllebert, көзі
иә, бірақ сіздің CSS дұрыс емес. Бұл блоккуотаның астындағы көлеңкеді көрсететіндіктен (және, сонымен бірге, бос кеңістікте де).
қосылды автор J. Ghyllebert, көзі
Қазір жақсы ... ??
қосылды автор copypaste, көзі
Оңай түзетуге рұқсат етіңіз, маған дауыс беріңіз :)
қосылды автор copypaste, көзі
Менің досымның өткір көзі :)
қосылды автор copypaste, көзі
Сіз бәрібір & nbsp; қосуыңызға болады.
қосылды автор copypaste, көзі

Бұл әрекетті көріңіз, менің ойымша, бұл сіз үшін жұмыс істейтін болады

.hov:hover{
    -moz-box-shadow:    3px 3px  #666; /*For Mozilla*/
    -webkit-box-shadow: 3px 3px  #666; /*For Chrome & safari*/
    box-shadow:         3px 3px  #666; /*For other*/   
}
2
қосылды
#motha:hover p{
    box-shadow: 
       1px 1px #666,
       2px 2px #666,
       3px 3px #666;
}
2
қосылды
#motha:hover p{
    box-shadow: 
       1px 1px #666,
       2px 2px #666,
       3px 3px #666;
}
2
қосылды

Сіздің жауабыңыз:

HTML

  
  

Lorem

ipsum

dolor

sit

amen

  

CSS

p {    
color:#f2f2f2;
background:#ff4a4a;
font-size: 75px;
line-height: 74px;
font-weight:700;
margin: 0 5px 24px;
float:left;
padding: 10px;
margin: 0 5px 24px;
font-family: 'Route', serif;
   }

.highlight {box-shadow: 
 1px 1px #666,
 2px 2px #666,
 3px 3px #666;}

Сценарий (jQuery қосыңыз):

$(".hov").mouseover(function(){
    $(".hov").addClass("highlight");
});

$(".hov").mouseout(function(){
    $(".hov").removeClass("highlight");
});
1
қосылды
Сіздікі жөн. Сіздің жауабыңызды ғана көрдім. әлдеқайда жақсы
қосылды автор Bilal Fazlani, көзі
Неліктен jquery?
қосылды автор J. Ghyllebert, көзі

Барлық элементтерге ата-аналық элементтерді апару стильдерін беруге тырысуға болады.

#motha:hover p{
    box-shadow: 
     1px 1px #666,
     2px 2px #666,
     3px 3px #666;
}

егер сіз тек .hov бар элементтерге мақсаттар қоюды қаласаңыз, бұл css-ні де пайдалана аласыз

#motha:hover .hov{
    box-shadow: 
     1px 1px #666,
     2px 2px #666,
     3px 3px #666;
}
1
қосылды