Как сделать в центре

@entric · Регистрация: 23.07.2012

Студворк — интернет-сервис помощи студентам

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
  <div class="tabsLink">
        <a href="#tab1"><center>Вкладка 1</center></a>
        <a href="#tab2">Вкладка 2</a>
        </div>
        
        <br>
        <a class="tabs" id="tab1"></a>
        <div class="tab">
        Вкладка 1 <br>
        </div>
        
        <a class="tabs" id="tab2"></a>
        <div class="tab">
    Вкладка 2 <br>
        </div>

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
.tabs {
    opacity: 0;  /* Прозрачность */
    visibility: hidden; /* Изначально - спрятан */
}
.tab{
    position:absolute; /* Абсолютное позиционирование */
    visibility: hidden;    /* Изначально - спрятан */
    z-index: 10;    /* z-index */
 /* Цвет */
    font: bold 12pt "Trebuchet MS", tahoma, verdana, arial narrow, arial; /* Толщина, размер и семейство шрифта */
}
.tabs:target+.tab {
    opacity: 1; /* Убирает прозрачность */
    visibility: visible; /* Делает видимым */
}

ps. тегом <center> не получается

@Taatshi · 05.08.2012, 11:14

CSS
1
#tabsLink{margin: 0 auto;}

Это принцип выравнивания. Но у Вас там внутри абсолютные позиции, поэтому этот код сработает только если задать диву явную ширину.

CSS
1
#tabsLink {margin: 0 auto; width: 200px;}

@entric · 05.08.2012, 11:39 **[ТС]**

не что то не получается

Добавлено через 1 минуту
Вот полный код

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<html>
 <head>
 <title>Kiko46</title>
 <link rel="stylesheet" type="text/css" href="box.css">
 <link rel="stylesheet" type="text/css" href="tab.css">
 <script src="abc.js"></script>
 <style>
 h2 {
    font-size: 1.1em;
    color: #800040;
    margin-top: 0;
   }
 </style>
</head>
 <body><center>
  <div id="conteiner">
   <div id="log"><center><a href ="index.html"><img src="log.png"></a></div>
   <div id="content"><br>
    <div class="tabsLink">
     <a href="#tab1"><img title="Обо мне" src="user_anonymous_64.png"></a>
     <a href="#tab2"><img title="Гостевая Книга" src="document_pencil_64.png"></a>
     <a href="#tab3"><img title="Программы" src="settings_64.png"></a>
     <br>
     <a class="tabs" id="tab1"></a>
      <div class="tab">
       <p>Я Андрей  Мне 12  Я увлекаюсь компьютерами и фотографиями<br>
       Если что-то не получается то я помогу - dis777888@gmail.com</p><br>
      </div>        
     <a class="tabs" id="tab2"></a>
      <div class="tab">
       Гостевая книга
      </div>
     <a class="tabs" id="tab3"></a>
      <div class="tab">
       <center>Программы</center>
      </div></div>
   </div>
 </body>
<html>

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
.tabs {
    opacity: 0;  /* Прозрачность */
    visibility: hidden; /* Изначально - спрятан */
}
.tab{
    position:absolute; /* Абсолютное позиционирование */
    visibility: hidden;    /* Изначально - спрятан */
    z-index: 10;    /* z-index */
 /* Цвет */
    font: bold 12pt "Trebuchet MS", tahoma, verdana, arial narrow, arial; /* Толщина, размер и семейство шрифта */
}
.tabs:target+.tab {
    opacity: 1; /* Убирает прозрачность */
    visibility: visible; /* Делает видимым */
}
.tabsLink{margin: 0 auto;}

Добавлено через 5 минут
а как тогда можно вкладки сделать

Добавлено через 10 минут

и что вы мне не поможете ?!

Добавлено через 3 минуты

@Taatshi · 05.08.2012, 11:47

http://www.alexilin.ru/tabs-with-pure-css/
http://kobzarev.com/makeup/tabs-in-pure-css.html

@entric · 05.08.2012, 11:48 **[ТС]**

сейчас проверю

@EPMAK · 05.08.2012, 19:10

по центру примерно так:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<html>
 <head>
 <title>Kiko46</title>
 <link rel="stylesheet" type="text/css" href="box.css">
 <link rel="stylesheet" type="text/css" href="tab.css">
 <script src="abc.js"></script>
 <style>
 h2 {
    font-size: 1.1em;
    color: #800040;
    margin-top: 0;
   }
   
.tabs {
    opacity: 0;  /* Прозрачность */
    visibility: hidden; /* Изначально - спрятан */
}
.tab{
    position:absolute; /* Абсолютное позиционирование */
    visibility: hidden;    /* Изначально - спрятан */
    z-index: 10;    /* z-index */
    font: bold 12pt "Trebuchet MS", tahoma, verdana, arial narrow, arial; /* Толщина, размер и семейство шрифта */
    width: 100%;
    text-align: center;}
 
.tabs:target+.tab {
    opacity: 1; /* Убирает прозрачность */
    visibility: visible; /* Делает видимым */
}
.tabsLink{ background-color: red; margin: 0 auto;}   
 </style>
</head>
 <body><center>
  <div id="conteiner">
   <div id="log"><center><a href ="index.html"><img src="log.png"></a></div>
   <div id="content"><br>
    <div class="tabsLink">
     <a href="#tab1"><img title="Обо мне" src="user_anonymous_64.png"></a>
     <a href="#tab2"><img title="Гостевая Книга" src="document_pencil_64.png"></a>
     <a href="#tab3"><img title="Программы" src="settings_64.png"></a>
     <br>
     <a class="tabs" id="tab1"></a>
      <div class="tab">
       <p>Я Андрей  Мне 12  Я увлекаюсь компьютерами и фотографиями<br>
       Если что-то не получается то я помогу - dis777888@gmail.com</p><br>
      </div>        
     <a class="tabs" id="tab2"></a>
      <div class="tab">
       Гостевая книга
      </div>
     <a class="tabs" id="tab3"></a>
      <div class="tab">
       <center>Программы</center>
      </div></div>
   </div>
 </body>
<html>

@entric · 06.08.2012, 11:39 **[ТС]**

не он не по центру

Добавлено через 1 час 5 минут

блин ну к тоне буть поможет

@EPMAK · 06.08.2012, 14:02

Сообщение от entric

не он не по центру

сопсна мой пример центрирует по центру скрытый текст.

Добавлено через 1 час 5 минут

блин ну к тоне буть поможет

никто. так как непонятно что там не по центру.
потрудись яснее мысль изложить

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .

@Taatshi Почетный модератор 12274 / 5340 / 268 Регистрация: 05.04.2011 Сообщений: 14,086 Записей в блоге: 2
	05.08.2012, 11:47
	http://www.alexilin.ru/tabs-with-pure-css/ http://kobzarev.com/makeup/tabs-in-pure-css.html 0

@entric 0 / 0 / 0 Регистрация: 23.07.2012 Сообщений: 29
	05.08.2012, 11:48 [ТС]
	сейчас проверю 0

@entric 0 / 0 / 0 Регистрация: 23.07.2012 Сообщений: 29
	06.08.2012, 11:39 [ТС]
	не он не по центру Добавлено через 1 час 5 минут блин ну к тоне буть поможет 0