Картинка по середине экрана на CSS

@Максим14 · Регистрация: 11.06.2012

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

В заголовке всё сказано, пробывал:

CSS
1
2
3
4
#logo {
width:400px;
margin:0 auto;
}

и вот это:

CSS
1
2
3
4
#logo {
width:400px;
margin: auto;
}

@Taatshi · 09.11.2012, 20:35

Максим14, полный код html и css надо

@koza4ok · 09.11.2012, 20:48

нету float?
Есть diplay:block?

@Максим14 · 09.11.2012, 21:04 **[ТС]**

CSS
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
* {
margin:0;
padding:0;
}
 
body {
width:100%;
background:#eee;
}
 
#content {
width:650px;
margin:0 auto;
background:#fff;
padding:10px;
}
 
#logo {
width:400px;
margin-left:0 auto;
margin-right:0 auto;
}
 
#main, #photos, #call, #news
{
    padding-left:40px;
    padding-right:45px;        
}
 
#txt, #logo
{
    text-align:center;
}

html:

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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
    <head>
        <title>Заголовок</title>
 
        <link rel="stylesheet" href="style.css" />
 
    </head>
    <body>            
<div id="content">
 
<a id="main" href="">
    Главная
    </a>
<a id="photos" href="">
    Портфолио
    </a>
    <a id="news" href="">
    Новости
    </a>
<a id="call" href="">
    Обратная связь
    </a>
 
 
    <br />
 
<img alt="" id="logo" src="images/vphoto.jpg"/>
 
<div id="txt">
текст
</div>
 
</div>
 
</body>
 
</html>

@VictorDax · 09.11.2012, 21:27

В CSS пишите:

CSS
1
2
3
4
5
6
display: block;
position: fixed;
top: 50%;
left: 50%;
margin-left: -320px; /* ширина картинки */
margin-top: -320px; /* высота картинки */

если будет не по центру поиграйте с margin-top и margin-left
возможно нужно вводить половину ширины и длины, не помню...

@newJS · 10.11.2012, 07:17

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

если будет не по центру поиграйте с margin-top и margin-left
возможно нужно вводить половину ширины и длины, не помню...

Не нужно играть, это обязательное условие, плюс padding, если есть тоже половину. Если по вертикали/горизонтали padding разный, то соответственно.

@VictorDax · 10.11.2012, 11:44

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

Не нужно играть, это обязательное условие

Я ясно выразился, что не помню что нужно вводить - половину значений ширины и длины или целые.

Новые блоги и статьи Все статьи Все блоги /
Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .	Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL3_image 8Observer8 27.01.2026 Содержание блога SDL3_image - это библиотека для загрузки и работы с изображениями. Эта пошаговая инструкция покажет, как загрузить и вывести на экран смартфона картинку с альфа-каналом, то есть с. . .	влияние грибов на сукцессию anaschu 26.01.2026 Бифуркационные изменения массы гриба происходят тогда, когда мы уменьшаем массу компоста в 10 раз, а скорость прироста биомассы уменьшаем в три раза. Скорость прироста биомассы может уменьшаться за. . .
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .	Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .	Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .

@Taatshi Почетный модератор 12274 / 5340 / 268 Регистрация: 05.04.2011 Сообщений: 14,086 Записей в блоге: 2
	09.11.2012, 20:35
	Максим14, полный код html и css надо 0

@koza4ok 632 / 440 / 67 Регистрация: 19.09.2012 Сообщений: 1,632
	09.11.2012, 20:48
	нету float? Есть diplay:block? 0