Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Форум программистов и сисадминов Киберфорум > Форум вебмастеров > HTML, CSS
Войти
Регистрация
Восстановить пароль
Карта форума Темы раздела Блоги Социальные группы Поиск Сообщения за день Заказать работу  
 
Рейтинг 4.99/144: Рейтинг темы: голосов - 144, средняя оценка - 4.99
12 / 13 / 1
Регистрация: 23.12.2009
Сообщений: 399
1

Как сдвинуть логотип?

30.05.2010, 12:45. Показов 27380. Ответов 16
Метки нет (Все метки)
Author24 — интернет-сервис помощи студентам
На сайте нужно поднять логотип. В css я управлял высотой логотипа:
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

/* begin Logo */
.logo
{
    display : block;
    position: absolute;
    left: 10px;
    top: -8px;
    width: 1150px;
}
 
h1.logo-name
{
    display: block;
    text-align: center;
}
 
h1.logo-name, h1.logo-name a, h1.logo-name a:link, h1.logo-name a:visited, h1.logo-name a:hover
{
    font-family: "Comic Sans MS", Tahoma, Arial, Sans-Serif;
    font-size: 36px;
    font-style: normal;
    font-weight: bold;
    text-decoration: none;
    padding:0;
    margin:0;
    color: #1E3C43 !important;
}
 
.logo-text
{
    display: block;
    text-align: center;
}
 
.logo-text, .logo-text a
{
    font-family: "Comic Sans MS", Tahoma, Arial, Sans-Serif;
    font-size: 18px;
    font-style: normal;
    font-weight: normal;
    padding:0;
    margin:0;
    color: #1E3C43 !important;
}
/* end Logo */
Беда в том что логотип поднимается вместе с названием сайта, а название как раз трогать не нужно.

Вот ещё php-код выводящий логотип, слоган и название сайта:
PHP
1
2
3
4
5
6
7

<div class="logo">
    <?php 
        if (!empty($site_name)) { echo '<h1 class="logo-name"><a href="'.check_url($base_path).'" title = "'.$site_name.'">'.$site_name.'</a></h1>'; }
        if (!empty($site_slogan)) { echo '<div class="logo-text">'.$site_slogan.'</div>'; }
        if (!empty($logo)) { echo '<div class="logo-image"><img src="'. check_url($logo) .'" alt="'. $site_title .'" id="logo-image" /></div>'; }
    ?>    
 </div>
Как мне можно сдвинуть один логотип без названия сайта?
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
 30.05.2010, 12:45
Ответы с готовыми решениями:

Как сдвинуть меню ниже, чтобы было больше места под логотип?
Уважаемые форумчане выручайте))не получается подвинуть меню вниз,хочется добавить логотип,и нужно...

Как поставить логотип в шапку
Помоги те поставить логотип в шапку. Место выделено на скрине http://bontyre-stalker.ru/

Сделать Логотип как ссылка
Добрый времени суток! Редко прошу помощи на форуме, но тут такая ситуация что нужна помощь:cry:...

Как правильно сделать логотип ?
Как правильно сделать вот это ? Пробовал по всякому но текст или под картинкой или ещё как криво...

16
1957 / 796 / 89
Регистрация: 03.11.2009
Сообщений: 3,066
Записей в блоге: 2
30.05.2010, 12:59 2
Код
/* begin Logo */
.logo
{
        display : block;
        position: absolute;
        left: 10px;
        top: -8px;
        width: 1150px;
}
 
h1.logo-name
{
        display: block;
        text-align: center;
}
 
h1.logo-name, h1.logo-name a, h1.logo-name a:link, h1.logo-name a:visited, h1.logo-name a:hover
{
        font-family: "Comic Sans MS", Tahoma, Arial, Sans-Serif;
        font-size: 36px;
        font-style: normal;
        font-weight: bold;
        text-decoration: none;
        padding:0;
        margin:0;
        color: #1E3C43 !important;
}
 
.logo-text
{
        display: block;
        text-align: center;
}
 
.logo-text, .logo-text a
{
        font-family: "Comic Sans MS", Tahoma, Arial, Sans-Serif;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        padding:0;
        margin:0;
        color: #1E3C43 !important;
}
.logo-image
{
   margin-top: 0px;
   padding-top: 0px;
}
/* end Logo */
Так пробовали?
0
12 / 13 / 1
Регистрация: 23.12.2009
Сообщений: 399
30.05.2010, 13:09  [ТС] 3
Высоту менял там где выделено жирным шрифтом:

Код
/* begin Logo */
.logo
{
        display : block;
        position: absolute;
        left: 10px;
    top: -8px;
        width: 1150px;
}
0
1957 / 796 / 89
Регистрация: 03.11.2009
Сообщений: 3,066
Записей в блоге: 2
30.05.2010, 13:34 4
Ну так, на сколько я понял, .logo это класс для дива, который и объединяет логотип, слоган и название. Нужно не в нем указывать высоту, т.к. оно распространяется на вложенные в него элементы
0
12 / 13 / 1
Регистрация: 23.12.2009
Сообщений: 399
30.05.2010, 13:59  [ТС] 5
А где можно высоту задать?
0
1957 / 796 / 89
Регистрация: 03.11.2009
Сообщений: 3,066
Записей в блоге: 2
30.05.2010, 14:06 6
Цитата Сообщение от UHSF Посмотреть сообщение
А где можно высоту задать?
height что ли? в диве с логотипом.
0
12 / 13 / 1
Регистрация: 23.12.2009
Сообщений: 399
30.05.2010, 15:35  [ТС] 7
Каким образом то хоть это можно сделать?
0
1957 / 796 / 89
Регистрация: 03.11.2009
Сообщений: 3,066
Записей в блоге: 2
30.05.2010, 15:46 8
Код
.logo-image
{
   margin-top: 0px;
   padding-top: 0px;
   height: 100px;
}
/* end Logo */
0
12 / 13 / 1
Регистрация: 23.12.2009
Сообщений: 399
30.05.2010, 19:10  [ТС] 9
Добавил я ваш код. Ничего не меняется.
0
работяга
368 / 368 / 52
Регистрация: 23.05.2010
Сообщений: 947
31.05.2010, 00:49 10
html код дал бы, а так непонятно к чему стили привязаны.

вообще если поднять логотип, то там не высоту править нужно, а отступ от картинки до границы (margin или padding). Либо попробуй поиграть с параметрами top, bottom
0
12 / 13 / 1
Регистрация: 23.12.2009
Сообщений: 399
01.06.2010, 15:13  [ТС] 11
PHP
1
2
3
4
5
6
7

<div class="logo">
    <?php 
        if (!empty($site_name)) { echo '<h1 class="logo-name"><a href="'.check_url($base_path).'" title = "'.$site_name.'">'.$site_name.'</a></h1>'; }
        if (!empty($site_slogan)) { echo '<div class="logo-text">'.$site_slogan.'</div>'; }
        if (!empty($logo)) { echo '<div class="logo-image"><img src="'. check_url($logo) .'" alt="'. $site_title .'" id="logo-image" /></div>'; }
    ?>    
 </div>
HTML5
1
2

<div class="logo">
    <h1 class="logo-name"><a href="/site/" title = "site">site</a></h1><div class="logo-image"><img src="/site/sites/default/files/acrylic_logo.gif" alt="" id="logo-image" /></div> </div>
Высоту менял параметром top.

Добавлено через 20 часов 25 минут
Ничего не получается. Двигается всё вместе, и логотип и название.
Наверное надо что-то с выводом делать:
PHP
1
2
3
4
5
6
7
8
9
10
11

<div class="Header">
    <div class="Header-jpeg"></div>
<div class="logo">
    <?php 
        if (!empty($site_name)) { echo '<h1 class="logo-name"><a href="'.check_url($base_path).'" title = "'.$site_name.'">'.$site_name.'</a></h1>'; }
        if (!empty($site_slogan)) { echo '<div class="logo-text">'.$site_slogan.'</div>'; }
        if (!empty($logo)) { echo '<div class="logo-image"><img src="'. check_url($logo) .'" alt="'. $site_title .'" id="logo-image" /></div>'; }
    ?>    
 </div>
 
</div>
0
работяга
368 / 368 / 52
Регистрация: 23.05.2010
Сообщений: 947
01.06.2010, 15:27 12
попробуй добавь стиль
.logo-image {position:relative; top:-20px}
1
1957 / 796 / 89
Регистрация: 03.11.2009
Сообщений: 3,066
Записей в блоге: 2
01.06.2010, 15:32 13
Цитата Сообщение от UHSF Посмотреть сообщение
Наверное надо что-то с выводом делать:
PHP тут не причем.
HTML5
1
2
3
4
5
6

<div class="logo">
   <h1 class="logo-name">
     <a href="/site/" title = "site">site</a>
   </h1>
   <div class="logo-image"></div>
</div>
Код
.logo
{
   position: absolute;
   margin: 0px;
   padding: 0px;
}
.logo-image
{
   background: url(/site/sites/default/files/acrylic_logo.gif) no-repeat top;
   position: inherit;
   top: 0px;      /* Что бы уже на верняк не было отступов:) */
   margin: 0px;
   padding: 0px;
}
попробуйте так.
1
12 / 13 / 1
Регистрация: 23.12.2009
Сообщений: 399
01.06.2010, 15:41  [ТС] 14
Поэкспериментируя, сделал так:
Вынес логотип в отдельный див:
PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<div class="Header">
    <div class="Header-jpeg"></div>
<div class="logo">
    <?php 
        if (!empty($site_name)) { echo '<h1 class="logo-name"><a href="'.check_url($base_path).'" title = "'.$site_name.'">'.$site_name.'</a></h1>'; }
        if (!empty($site_slogan)) { echo '<div class="logo-text">'.$site_slogan.'</div>'; }
        ?>    
 </div>
 
</div>
<div class="logo-image">
   <?php
       if (!empty($logo)) { echo '<div class="logo-image"><img src="'. check_url($logo) .'" alt="'. $site_title .'" id="logo-image" /></div>'; }
   ?>
</div>
и
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

/* begin Logo */
div.logo-image
{
    display : block;
    position: absolute;
    left: 10px;
    top: 25px;
    width: 1150px;
}
 
.logo
{
    display : block;
    position: absolute;
    left: 10px;
    top: 13px;
    width: 1150px;
}
 
h1.logo-name
{
    display: block;
    text-align: center;
       
}
 
h1.logo-name, h1.logo-name a, h1.logo-name a:link, h1.logo-name a:visited, h1.logo-name a:hover
{
    font-family: "Comic Sans MS", Tahoma, Arial, Sans-Serif;
    font-size: 36px;
    font-style: normal;
    font-weight: bold;
    text-decoration: none;
    padding:0;
    margin:0;
    color: #1E3C43 !important;
}
 
.logo-text
{
    display: block;
    text-align: center;
}
 
.logo-text, .logo-text a
{
    font-family: "Comic Sans MS", Tahoma, Arial, Sans-Serif;
    font-size: 18px;
    font-style: normal;
    font-weight: normal;
    padding:0;
    margin:0;
    color: #1E3C43 !important;
}
 
/* end Logo */
Получилось что в .logo двигается всё вместе, а в div.logo-image двигается только логотип.
Как хотелось отрегулировал высоту логотипа и названия сайта.

Добавлено через 4 минуты
Всем большое спасибо за, так сказать, сотрудничество!!!
0
0 / 0 / 0
Регистрация: 21.05.2010
Сообщений: 5
14.03.2011, 07:39 15
(margin-top: -20px; ) попробуй поиграться с отрицательным маргином.
0
13208 / 6596 / 1041
Регистрация: 10.01.2008
Сообщений: 15,069
14.03.2011, 18:15 16
zael, Вам не кажется, что июнь прошлого года - это уже не совсем актуально?
0
0 / 0 / 0
Регистрация: 21.05.2010
Сообщений: 5
15.03.2011, 06:54 17
Vovan-VE, простите, не обратил внимания.
0
15.03.2011, 06:54
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
 15.03.2011, 06:54
Помогаю со студенческими работами здесь

Как правильно оформить логотип
Доброго времени суток. Пытаюсь оформить шапку сайта и столкнулся с определенными трудностями....

Как запилить логотип на страницу ?!
Страница с фоном - картинкой. Поверх мне нужно поставить логотип сайта, причём таким образом чтобы...

Как наложить логотип на меню?
Пытаюсь сделать подобное: ...

Как изменить логотип по центру
Здравствуйте подскажите пожалуйста как изменить логотип что-бы он был по центру function...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
17
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Поддержать - Реклама - Обратная связь
Powered by vBulletin
Copyright ©2000 - 2024, CyberForum.ru