сделать внешние элементы невидимыми, HTML CSS

<body> 
 
    <div class="white"> 
 
     <table class="circleDataBack"> 
 
      <tr> 
 
       <td> 
 
        <div class="circle">A</div> 
 
        <div class="circle">B</div> 
 
        <div class="circle marked">C</div> 
 
       </td> 
 
      </tr> 
 
     </table> 
 
    </div> 
 
</body>

И я должен сделать только те элементы, которые имеют класс

marked

и сделать невидимыми все внешние элементы. И элементы, у которых есть класс marked, должны сохранять свои позиции и оставаться видимыми

источник

2017-01-23 Aibol

Если я вас понял, вы можете использовать ': нет()' 'селектор - .circle: нет (.marked) {видимость: скрытый}' – Vucko

Спасибо за все. Решено решение с помощью Jquery: 'function showOnlyDots() { $ ('*'). Not ('td> div.circle.marked'). AddClass ('invis'); $ ('img'). Css ("display", "none"); $ ('div.circle'). Css ("border", "none"); } ' – Aibol

Используйте видимость.

.circle{ 
 
    visibility: hidden; 
 
} 
 
.circle.marked{ 
 
    visibility: visible; 
 
}

<body> 
 
    <div class="white"> 
 
     <table class="circleDataBack"> 
 
      <tr> 
 
       <td> 
 
        <div class="circle">A</div> 
 
        <div class="circle">B</div> 
 
        <div class="circle marked">C</div> 
 
       </td> 
 
      </tr> 
 
     </table> 
 
    </div> 
 
</body>

источник

2017-01-23 11:36:59 Tom

За 1 секунду до меня ...: D –

@ Спасибо за ваш ответ. Я попробовал код, но он сделал невидимыми только данные таблицы. Тем не менее, я избавляюсь от других блоков, которые не имеют отношения к tds. Я попытался с Jquery, как выбрать все отмеченные элементы exceptiong и сделать его невидимым: '$ (function() { $ ('*'). not ('td> div.circle.marked'). addClass ('invis'); }) '. Он также не работал – Aibol

Его таргетинг на что-либо с кругом классов. Поместите здесь весь свой HTML-код, и вам будет легче помочь. – Tom

.circle.marked {visibility:visible; } 
 
.circle{visibility:hidden;}

<body> 
 
    <div class="white"> 
 
     <table class="circleDataBack"> 
 
      <tr> 
 
       <td> 
 
        <div class="circle">A</div> 
 
        <div class="circle">B</div> 
 
        <div class="circle marked">C</div> 
 
       </td> 
 
      </tr> 
 
     </table> 
 
    </div> 
 
</body>

источник

2017-01-23 11:38:43

https://jsfiddle.net/0emw0kL6/ здесь просто CSS свойство, которое поможет вам.

<!-- CSS STARTS--> 
.circle{ 
    display:none; 
} 
.marked{ 
    display:block; 
} 
<!-- CSS STARTS--> 
<!-- HTML STARTS--> 
<body> 
    <div class="white"> 
     <table class="circleDataBack"> 
      <tr> 
       <td> 
        <div class="circle">A</div> 
        <div class="circle">B</div> 
        <div class="circle marked">C</div> 
       </td> 
      </tr> 
     </table> 
    </div> 
</body> 
<!-- HTML ENDS-->

источник

2017-01-23 11:40:14

.circle:not(.marked){ visibility: hidden; }

<div class="white"> 
 
     <table class="circleDataBack"> 
 
      <tr> 
 
       <td> 
 
        <div class="circle">A</div> 
 
        <div class="circle">B</div> 
 
        <div class="circle marked">C</div> 
 
       </td> 
 
      </tr> 
 
     </table> 
 
    </div>

источник

2017-01-23 11:42:30 Vky

спасибо за ваш ответ. Я попробовал ваш код css, он сделал невидимым только элементы внутри класса circle, остальные элементы вне класса «отмечены» остаются видимыми – Aibol

сделать внешние элементы невидимыми, HTML CSS

ответ

Смежные вопросы