Разметка
#1
Отправлено 27 Август 2013 - 15:35
И еще как сделать 1 заглавную букву в ссылках , сделать другой шрифт . и войти в лк подвинуть к правому краю.
#3
Отправлено 27 Август 2013 - 16:35
что бы делать какие либо действия с ними есть два варианта.
Первый - вы просто продолжаете так же менять вашу шапку в каком-нибудь графическом редакторе (т.е. в фотошопе например делаете вашу разметку для картинок и снова грузите на сайт)
Второй - вы вырезаете отдельно каждую иконку соц.сети и делаете средствами css блок с иконками которому задаете нужный фон и необходимые эффекты.
касательно первой заглавной - у вас сейчас все указанные ссылки написаны строчными буками, уточните вы хотите изменить их написание на прописные буквы и каждому начальному слову оставить заглавную ?
шрифт вы можете менять в файле Main.css (админка магазина, вкладка САйт - Редактор шаблонов- файл main.css)
Найдите код
#mainmenu li a{ font: bold 12px/40px Helvetica, Tahoma, Arial, sans-serif; color: #FFF; display: block; float: left; ..... ...... ......
и меняйте в нем параметр
font: bold 12px/40px Helvetica, Tahoma, Arial, sans-serif; где Helvetica, Tahoma, Arial - это названия шрифтов
подробней об этом параметре можно почитать тут
что бы сдвинуть пункты меню правее добавьте в коней файла main.css код
#top-menu .pad-box { margin-left: 100px; }
меняйте значение этого параметра на нужное вам.
#4
Отправлено 27 Август 2013 - 17:25
Taisia (27 Август 2013 - 16:35) писал:
Сейчас ваши иконки соц.сетей это часть одной картинки шапки - можно убедиться пройдя http://sballs.storel...er_page.png"]по ссылке[/url]
что бы делать какие либо действия с ними есть два варианта.
Первый - вы просто продолжаете так же менять вашу шапку в каком-нибудь графическом редакторе (т.е. в фотошопен апример делаете вашу разметку для картинок и снова грузите на сайт)
Второй - вы вырезаете отдельно каждую иконку соц.сети и делаете средствами css блок с иконками которому задаете нужный фон и необходимые эффекты.
касательно первой заглавной - у вас сейчас все указанные ссылки написаны строчными буками, уточните вы хотите изменить их написание на прописные буквы и каждому начальному слову оставить заглавную ?
шрифт вы можете менять в файле Main.css (админка магазина, вкладка САйт - Редактор шаблонов- файл main.css)
Найдите код
[/background] [background=rgba(255,255,255,0)]#mainmenu li a{[/background] [background=rgba(255,255,255,0)] font: bold 12px/40px Helvetica, Tahoma, Arial, sans-serif;[/background] [background=rgba(255,255,255,0)] color: #FFF;[/background] [background=rgba(255,255,255,0)] display: block;[/background] [background=rgba(255,255,255,0)] float: left;[/background] [background=rgba(255,255,255,0)].....[/background] [background=rgba(255,255,255,0)]......[/background] [background=rgba(255,255,255,0)]......[/background] [background=rgba(255,255,255,0)]
и меняйте в нем параметр
font: bold 12px/40px Helvetica, Tahoma, Arial, sans-serif; где Helvetica, Tahoma, Arial - это названия шрифтов
подробней об этом параметре можно почитать http://htmlbook.ru/css/font"]тут [/url]
что бы сдвинуть пункты меню правее добавьте в коней файла main.css код
[/background] [background=rgba(255,255,255,0)]#top-menu .pad-box {[/background] [background=rgba(255,255,255,0)] margin-left: 100px;[/background] [background=rgba(255,255,255,0)]}[/background] [background=rgba(255,255,255,0)]
меняйте значение этого параметра на нужное вам.
С последним кодом разобрался.
Далее, разметка я не знал что в фотографе можно делать разметку, если только мы не говорим о двух разных вещах. Я. Имел ввиду разметку и добавление туда ссылки. У меня есть код
<map name="#headmap"> <area shape="rect" alt="https://twitter.com/SBalls_ru" title="" coords="1357,35,1411,87" href="https://twitter.com/SBalls_ru" target="_blank" /> <area shape="rect" alt="" title="" coords="1301,34,1355,89" href="https://www.facebook.com/pages/Sballsru/550454738343130" target="_blank" /> <area shape="rect" alt="https://www.Sballs.ru" title="" coords="1239,34,1299,89" href="http://www.odnoklassniki.ru/profile/554893614704" target="_blank" /> <area shape="rect" alt="https://www.Sballs.ru" title="" coords="1189,35,1239,86" href="http://sballs.storeland.ru/feedback" target="_blank" /> <area shape="rect" alt="https://www.Sballs.ru" title="" coords="1132,34,1188,89" href="https://www.vk.com/" target="_blank" /> <area shape="rect" alt="Корзина" title="" coords="844,28,913,90" href="http://sballs.storeland.ru/cart" target="" /> <!-- Created by Online Image Map Editor (http://www.maschek.hu/imagemap/index) --></map>
я думал его куда то пристроить. Подойдет ли он или нет?
Kасательно первой заглавной, если они все сейчас строчные то нужно сделать 1 букву прописной.
Шрифт Поменял на aria.
#5
Отправлено 27 Август 2013 - 17:30
<!-- Корзина --> <div id="cartInfo"> <a href="{CART_URL}">в корзине товаров на</a>: <span id="cartSum"> {% IF cart_count_empty %} <span>0</span> {CURRENCY_NAME} {% ELSE %} {% FOR cart_sum %} <span class="num">{cart_sum.NOW | money_format}</span><br /> {% ENDFOR %} {% ENDIF %} </span> </div> <!-- end Корзина -->
и замените на код
<!-- Корзина --> <div id="cartInfo"> <span>Товаров в <a href="{CART_URL}" class="underline"> корзине</a>:</span> <span> {% IF cart_count_empty %} <span class="red">0</span> шт. {% ELSE %} {% FOR cart_count %} {cart_count.COUNT}{cart_count.MEASURE_NAME}{% IFNOT cart_count.last %},{% ENDIF %} {% ENDFOR %} {% ENDIF %} </span> </div> <!-- end Корзина -->
далее в файле main.css найдите код
#cartInfo { position:absolute; font-size: 13px; top: 54px; left: 380px; white-space:nowrap; overflow:hidden; height:20px; width: 340px; }
и замените на код
#cartInfo { position:absolute; font-size: 13px; top: 54px; left: 445px; white-space:nowrap; overflow:hidden; height:20px; width: 240px; }
там же найдите код
#cartInfo a { color:#000; text-transform: uppercase; padding:5px 0px 5px 45px; }
и замените на код
#cartInfo a { color:#000; padding:5px 0px 5px 5px; }
#6
Отправлено 27 Август 2013 - 17:39
что бы оставить прописной только первую букву найдите в файле main.css код
#mainmenu li a{ font: bold 12px/40px Arial, Tahoma, sans-serif; color: #FFF; display: block; float: left; padding-right: 15px; padding-left: 15px; text-transform: uppercase; ....... ...... ........
и замените в нем параметр
text-transform: uppercase;
на такой
text-transform: none;
Тоже самое и для правой колонки найдите код
.leftmenu li h2 { font: bold 17px/20px Helvetica, "Trebuchet MS", Arial, sans-serif; color: #069; text-transform: uppercase; }
и редактируйте параметр
text-transform: uppercase;
#7
Отправлено 27 Август 2013 - 17:41
#8
Отправлено 27 Август 2013 - 17:47
Taisia (27 Август 2013 - 17:39) писал:
что бы оставить прописной только первую букву найдите в файле main.css код
#mainmenu li a{ font: bold 12px/40px Arial, Tahoma, sans-serif; color: #FFF; display: block; float: left; padding-right: 15px; padding-left: 15px; text-transform: uppercase; ....... ...... ........
и замените в нем параметр
text-transform: uppercase;
на такой
text-transform: none;
Тоже самое и для правой колонки найдите код
.leftmenu li h2 { font: bold 17px/20px Helvetica, "Trebuchet MS", Arial, sans-serif; color: #069; text-transform: uppercase; }
и редактируйте параметр
text-transform: uppercase;
#9
Отправлено 27 Август 2013 - 17:55
Fobas (27 Август 2013 - 17:41) писал:
Найдите в MAin.css код
#cartInfo { position:absolute; font-size: 13px; top: 54px; left: 445px; white-space:nowrap; overflow:hidden; height:20px; width: 240px; }
и замените на код
#cartInfo { position:absolute; font-size: 13px; top: 47px; left: 445px; white-space:nowrap; overflow:hidden; height: 32px; width: 240px; }
там же найдите код
.red {color:red;}
и замените на код
.red {color:red; font-size:25px;}
#10
Отправлено 27 Август 2013 - 18:02
#11
Отправлено 27 Август 2013 - 18:06
Цитата
Далее, разметка я не знал что в фотографе можно делать разметку, если только мы не говорим о двух разных вещах. Я. Имел ввиду разметку и добавление туда ссылки. У меня есть код
<map name="#headmap">
<area shape="rect" alt="https://twitter.com/SBalls_ru" title="" coords="1357,35,1411,87" href="https://twitter.com/SBalls_ru" target="_blank" />
<area shape="rect" alt="" title="" coords="1301,34,1355,89" href="https://www.facebook...50454738343130" target="_blank" />
<area shape="rect" alt="https://www.Sballs.ru" title="" coords="1239,34,1299,89" href="http://www.odnoklass...e/554893614704" target="_blank" />
<area shape="rect" alt="https://www.Sballs.ru" title="" coords="1189,35,1239,86" href="http://sballs.storel...nd.ru/feedback" target="_blank" />
<area shape="rect" alt="https://www.Sballs.ru" title="" coords="1132,34,1188,89" href="https://www.vk.com/" target="_blank" />
<area shape="rect" alt="Корзина" title="" coords="844,28,913,90" href="http://sballs.storeland.ru/cart" target="" />
<!-- Created by Online Image Map Editor (http://www.maschek.hu/imagemap/index) --></map>
я думал его куда то пристроить. Подойдет ли он или нет?
тег Map задается для изображения которое вставлено через тег <img>
Изображение вашей шапки выводится на сайт как свойство background тега <div>
что бы применить тег map к изображению вам нужно его вырезать и вставить в на сайт в теги <img>
Fobas (27 Август 2013 - 18:02) писал:
там же в коде
.red {color:red; font-size:25px;}
замените параметр color:red; на color:black;
#12
Отправлено 27 Август 2013 - 18:22
#13
Отправлено 27 Август 2013 - 19:36
в конец файла main.css добавьте код
#sots { position: absolute; top: 12px; left: 651px; width: 300px; height: 100px; } #vkc { width: 57px; height: 54px; position: absolute; } div#vkc:hover { background-color: rgba(255, 255, 255, 0.3); } div#fc:hover { background-color: rgba(255, 255, 255, 0.3); } div#od:hover { background-color: rgba(255, 255, 255, 0.3); } div#gm:hover { background-color: rgba(255, 255, 255, 0.3); } div#tw:hover { background-color: rgba(255, 255, 255, 0.3); } #svks { height: 57px; position: absolute; top: 22px; z-index: 9999; } #gms { height: 57px; position: absolute; top: 16px; } #gm { width: 51px; height: 54px; left: 57px; position: absolute; top: 6px; } #odc { height: 57px; position: absolute; top: 16px; left: 51px; } #od { width: 61px; height: 54px; left: 57px; position: absolute; top: 6px; } #fcc { height: 57px; position: absolute; top: 16px; left: 51px; } #fc { width: 55px; height: 54px; left: 118px; position: absolute; top: 6px; } #twc { height: 57px; position: absolute; top: 16px; left: 51px; } #tw { width: 55px; height: 54px; left: 174px; position: absolute; top: 6px; }
в коде файла html найдите
</div> <!-- end Корзина -->
и после него вставьте код
<div id="sots"><a id="svks" href="https://www.vk.com/" target="_blank"><div id="vkc"> </div></a><a id="gms" href="http://sballs.storeland.ru/feedback" target="_blank"><div id="gm"> </div></a><a id="odc" href="http://www.odnoklassniki.ru/profile/554893614704" target="_blank"><div id="od"> </div></a><a id="fcc" href="https://www.facebook.com/pages/Sballsru/550454738343130" target="_blank"><div id="fc"> </div></a><a id="twc" href="https://www.facebook.com/pages/Sballsru/550454738343130" target="_blank"><div id="tw"> </div></a></div>
#14
Отправлено 27 Август 2013 - 20:08
#15
Отправлено 27 Август 2013 - 21:07
<div id="cartInfo">
ПЕРЕД ним вставьте код
<a id="kor" href="http://sballs.storeland.ru/cart" class="underline"> </a>
далее в файле main.css в конец вставьте код
#kor { position: absolute; width: 60px; height: 50px; top: 35px; left: 370px; z-index: 9999; }
#17
Отправлено 27 Август 2013 - 21:26
Fobas (27 Август 2013 - 21:19) писал:
либо это тот фон в уменьшенном размере либо баг. Можно ли его убрать тоже?
#kor:hover { text-decoration: none; }
#18
Отправлено 27 Август 2013 - 22:13
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных