Как сделать первую ссылку в таб меню активной по умолчанию без использования JavaScript?

Чтобы сделать первую ссылку в таб меню активной по умолчанию без использования JavaScript, можно использовать селектор :first-child для первого элемента таб меню и применить соответствующие стили. Например:

HTML:
```html
<ul class="tab-menu">
  <li><a href="#" class="active">Ссылка 1</a></li>
  <li><a href="#">Ссылка 2</a></li>
  <li><a href="#">Ссылка 3</a></li>
</ul>
```

CSS:
```css
.tab-menu li:first-child a {
  /* Стили активной ссылки */
  background-color: #f00;
  color: #fff;
  /* Другие стили */
}

.tab-menu li a {
  /* Стили неактивной ссылки */
  background-color: #ccc;
  color: #000;
  /* Другие стили */
}
```

Чтобы первый блок на сайте всегда оставался активным при первом открытии, но исчезал при переходе по другим ссылкам, можно использовать псевдокласс :target. При этом каждый блок на сайте нужно пометить уникальным идентификатором и добавить соответствующие ссылки с якорными ссылками. Например:

HTML:
```html
<a href="#block1">Ссылка 1</a>
<a href="#block2">Ссылка 2</a>
<a href="#block3">Ссылка 3</a>

<div id="block1" class="content active">Содержимое блока 1</div>
<div id="block2" class="content">Содержимое блока 2</div>
<div id="block3" class="content">Содержимое блока 3</div>
```

CSS:
```css
.content {
  display: none;
}

.content.active {
  display: block;
}
```

В данном примере блок с идентификатором "block1" будет отображаться по умолчанию при первой загрузке страницы, но после перехода по другим ссылкам он будет скрыт.

Если вы хотите создать табы без использования JavaScript, вы можете использовать чекбоксы и псевдоклассы. Вот пример простых табов на HTML и CSS:

```html

  

    Tab 1
    Tab 2
    Tab 3
  

  

    
    

      
Content for Tab 1
    

    
    

      
Content for Tab 2
    

    
    

      
Content for Tab 3
    
  

```

```css
.container {
  width: 800px;
  margin: 0 auto;
}

.tab {
  display: flex;
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

.tab label {
  display: block;
  float: left;
  padding: 14px 16px;
  cursor: pointer;
  width: 33.3%;
  text-align: center;
}

input {
  display: none;
}

.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}

input:checked + .tabcontent {
  display: block;
}
```

 

Пример простых табов на HTML и CSS:

```html

  

    Tab 1
    Tab 2
    Tab 3
  

  

    
    

      
Content for Tab 1
    

    
    

      
Content for Tab 2
    

    
    

      
Content for Tab 3
    
  

```

```css
.container {
  width: 800px;
  margin: 0 auto;
}

.tab {
  display: flex;
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

.tab label {
  display: block;
  float: left;
  padding: 14px 16px;
  cursor: pointer;
  width: 33.3%;
  text-align: center;
}

input {
  display: none;
}

.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
}

input:checked + .tabcontent {
  display: block;
}
```