在2个类的li中选择一个类(HTML,CSS)

时间:2017-07-21 06:46:55

标签: html css class html-lists

HTML:

    <div id="calendar">
        <li class="day">
            <div class="date">4</div>
            <div class="event">
                <div class="event-description">
                    Concert
                </div>
            </div>
        </li>
    </div>

的CSS:

#calendar .days li:hover {
    text-decoration: underline;
}

我希望文字下划线4,但它只强调音乐会.. 当我将鼠标悬停在li ??

上时,我怎么能只用下划线4而不是下划线音乐会

4 个答案:

答案 0 :(得分:1)

试试这个

CSS

#calendar li.day:hover .date{text-decoration:underline;}

Working Fiddle

希望这会有所帮助..

答案 1 :(得分:0)

最简单的解决方法是在具有类:“date”的div中添加execute pathogen#infect() execute pathogen#helptags() syntax on " set [normal],rc open up the vimrc in a new buffer let mapleader = "," nmap <leader>rc :tabedit $MYVIMRC <CR> " Stock Configurations set laststatus=2 set nu set t_Co=256 set autoread set background=dark set shiftwidth=4 set tabstop=4 set autoindent set noswapfile set nocompatible set nowrap set syntax colorscheme solarized " Autoclose YouCompleteMe Documentation Preivew after inserting let g:ycm_autoclose_preview_window_after_insertion = 1 " Set the powerline fonts let g:airline_powerline_fonts = 1 。但如果你没有^^

,你应该在样式表中这样做

答案 2 :(得分:0)

使用以下内容:

{{#compare jobTitle.length '>' 20}}
  {{#compare jobTitle.length '<=' 100}}
    <p>Greater than 20 and less than or equal 100</p>
  {{else}}
    <p>Greater than 100</p>
  {{/compare}}
{{else}}
  <p>Less than or equal to 20</p>
{{/compare}}

答案 3 :(得分:0)

使用:

 #calendar .day:hover > .date {
    text-decoration: underline;
}

 #calendar .day:hover > .date {
    text-decoration: underline;
}
    <div id="calendar">
        <li class="day">
            <div class="date">4</div>
            <div class="event">
                <div class="event-description">
                    Concert
                </div>
            </div>
        </li>
    </div>