Перейти к содержимому


Как Сделать Тень


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 43

#1 Andrew S.

Andrew S.

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 20 Апрель 2013 - 07:29

Чтобы отбрасывалась от основного body сайта на background? Чтобы это было закреплено за всем сайтом. Тень небольшую. Около 3-5 пикс. Можно это сделать?

#2 miyako

miyako

    Активный участник

  • Модератоpы
  • 5 372 сообщений

Отправлено 20 Апрель 2013 - 08:17

Просмотр сообщенияAndrew S. (20 Апрель 2013 - 07:29) писал:

Чтобы отбрасывалась от основного body сайта на background? Чтобы это было закреплено за всем сайтом. Тень небольшую. Около 3-5 пикс. Можно это сделать?

Найдите в файле main.css код:
.content {
max-width: 1240px;
min-width: 1000px;
margin: auto;
border: 1px solid #DCECF7;
background: #fff;
}
и замените на:
.content {
max-width: 1240px;
min-width: 1000px;
margin: auto;
border: 1px solid #DCECF7;
background: #fff;
-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
box-shadow: 0 0 10px rgba(0,0,0,0.5);
padding: 10px;
}
Вот пример - http://htmlbook.ru/css/box-shadow

#3 Andrew S.

Andrew S.

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 1 382 сообщений
  • ГородKhabarovsk

Отправлено 20 Апрель 2013 - 08:57

Просмотр сообщенияmiyako (20 Апрель 2013 - 08:17) писал:

Найдите в файле main.css код:
.content {
max-width: 1240px;
min-width: 1000px;
margin: auto;
border: 1px solid #DCECF7;
background: #fff;
}
и замените на:
.content {
max-width: 1240px;
min-width: 1000px;
margin: auto;
border: 1px solid #DCECF7;
background: #fff;
-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5);
-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5);
box-shadow: 0 0 10px rgba(0,0,0,0.5);
padding: 10px;
}
Вот пример - http://htmlbook.ru/css/box-shadow
Как это всё прикольно.. Только лиса тормозит :) Спасибо!!!

#4 OlgaS

OlgaS

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений

Отправлено 30 Октябрь 2013 - 09:48

не туда)

#5 ne_yana

ne_yana

    Активный участник

  • Модератоpы
  • 1 190 сообщений

Отправлено 30 Октябрь 2013 - 09:58

Просмотр сообщенияOlgaS (30 Октябрь 2013 - 09:48) писал:

не туда)
Здравствуйте, в файле main.css замените
#header {
position: relative;
width: 960px;
height: 190px;
margin: 0 auto;
background: white;
}
на
#header {
position: relative;
width: 960px;
height: 190px;
margin: 0 auto;
background: white;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

#content {
width: 960px;
margin: 0 auto;
background: url("http://s10669328.storeland.net/contentWrap_bg.jpg");
}
на
#content {
width: 960px;
margin: 0 auto;
background: url("http://s10669328.storeland.net/contentWrap_bg.jpg");
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}


#6 OlgaS

OlgaS

    Пользователь

  • Пользователи
  • PipPip
  • 42 сообщений

Отправлено 30 Октябрь 2013 - 18:24

Огромное спасибо

#7 Ibra

Ibra

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 191 сообщений

Отправлено 22 Февраль 2014 - 20:40

Просмотр сообщенияne_yana (30 Октябрь 2013 - 09:58) писал:

Здравствуйте, в файле main.css замените
#header {
position: relative;
width: 960px;
height: 190px;
margin: 0 auto;
background: white;
}
на
#header {
position: relative;
width: 960px;
height: 190px;
margin: 0 auto;
background: white;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

#content {
width: 960px;
margin: 0 auto;
background: url("http://s10669328.storeland.net/contentWrap_bg.jpg");
}
на
#content {
width: 960px;
margin: 0 auto;
background: url("http://s10669328.storeland.net/contentWrap_bg.jpg");
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

а на шаблон радость как это сделать

#8 support 2.0

support 2.0

    Активный участник

  • Модераторы
  • 4 950 сообщений

Отправлено 22 Февраль 2014 - 21:25

Просмотр сообщенияIbra (22 Февраль 2014 - 20:40) писал:

а на шаблон радость как это сделать
в main.css найдите строчку
#container{ width: 100%; overflow-x: hidden; position: relative; padding: 0; background: url('{ASSETS_IMAGES_PATH}leftcolum-bg.jpg') #fff left top repeat-y; -moz-border-radius: 0em 0em 10px 10px; -webkit-border-radius: 0em 0em 10px 10px; border-radius: 0em 0em 10px 10px;}
замените ее на
#container{ width: 100%; overflow-x: hidden; position: relative; padding: 0; background: url('{ASSETS_IMAGES_PATH}leftcolum-bg.jpg') #fff left top repeat-y; -moz-border-radius: 0em 0em 10px 10px; -webkit-border-radius: 0em 0em 10px 10px; border-radius: 0em 0em 10px 10px; -moz-box-shadow: 0 0 5px 6px rgba(111, 94, 94, 0.5); -webkit-box-shadow: 0 0 10px rgba(111, 94, 94, 0.5); box-shadow: 0 0 5px 6px rgba(111, 94, 94, 0.5); rgba(0,0,0,0.5);}


#9 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 09 Ноябрь 2014 - 14:46

Просмотр сообщенияne_yana (30 Октябрь 2013 - 09:58) писал:

Здравствуйте, в файле main.css замените
#header {
position: relative;
width: 960px;
height: 190px;
margin: 0 auto;
background: white;
}
на
#header {
position: relative;
width: 960px;
height: 190px;
margin: 0 auto;
background: white;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

#content {
width: 960px;
margin: 0 auto;
background: url("http://s10669328.storeland.net/contentWrap_bg.jpg");
}
на
#content {
width: 960px;
margin: 0 auto;
background: url("http://s10669328.storeland.net/contentWrap_bg.jpg");
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

Сделал тень такую, но она появляется в товарах и товаре как убрать от туда?

#10 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 09 Ноябрь 2014 - 15:00

Просмотр сообщенияUltraMag (09 Ноябрь 2014 - 14:46) писал:

Сделал тень такую, но она появляется в товарах и товаре как убрать от туда?
Здравствуйте, найдите в шаблоне Товары код
<div class="contentText">
замените на
<div class="contentText" style="box-shadow: none;">
далее найдите в шаблоне товар код
<div class="contentText" itemscope itemtype="http://schema.org/Product">
замените на
<div class="contentText" itemscope itemtype="http://schema.org/Product" style="box-shadow: none;">


#11 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 09 Ноябрь 2014 - 15:16

Просмотр сообщенияИрина345 (09 Ноябрь 2014 - 15:00) писал:

Здравствуйте, найдите в шаблоне Товары код
<div class="contentText">
замените на
<div class="contentText" style="box-shadow: none;">
далее найдите в шаблоне товар код
<div class="contentText" itemscope itemtype="http://schema.org/Product">
замените на
<div class="contentText" itemscope itemtype="http://schema.org/Product" style="box-shadow: none;">
Спасибо!

#12 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 09 Ноябрь 2014 - 15:25

А можно с правой стороны немного отступить?
В товарах и товаре блоки упираются в правую стенку.

#13 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 09 Ноябрь 2014 - 16:28

Просмотр сообщенияUltraMag (09 Ноябрь 2014 - 15:25) писал:

А можно с правой стороны немного отступить?
В товарах и товаре блоки упираются в правую стенку.
Найдите в шаблоне Товары код
<div class="contentText" style="box-shadow: none;">
замените на
<div class="contentText" style="box-shadow: none;margin-right: 19px;">

далее в файле стилей найдите
.main_general {
margin-bottom: 25px;
margin-left: 11px;
float: left;
display: -moz-inline-stack;
vertical-align: top;
position: relative;
width: auto;
}
замените на

.main_general {
margin-bottom: 25px;
margin-left: 6px;
float: left;
display: -moz-inline-stack;
vertical-align: top;
position: relative;
width: auto;
}


#14 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 09 Ноябрь 2014 - 16:52

Можно на всё сделать отступ? Много других рамок в корзине в товаре прижаты к правой стороне.

#15 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 09 Ноябрь 2014 - 17:01

Восстановил без изменений предыдущих. Стало хуже отображаться в малых разрешениях

#16 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 09 Ноябрь 2014 - 17:01

Просмотр сообщенияUltraMag (09 Ноябрь 2014 - 16:52) писал:

Можно на всё сделать отступ? Много других рамок в корзине в товаре прижаты к правой стороне.
Найдите
.container .twelve.columns {
width: 880px;
z-index: 1000000;
overflow: visible;
margin-top: 20px;

}
замените на


.container .twelve.columns {
width: 880px;
z-index: 1000000;
overflow: visible;
margin-top: 20px;
margin-right: 13px;
}



#17 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 09 Ноябрь 2014 - 17:04

Просмотр сообщенияИрина345 (09 Ноябрь 2014 - 17:01) писал:

Найдите
.container .twelve.columns {
width: 880px;
z-index: 1000000;
overflow: visible;
margin-top: 20px;

}
замените на


.container .twelve.columns {
width: 880px;
z-index: 1000000;
overflow: visible;
margin-top: 20px;
margin-right: 13px;
}

Вот так отлично!

#18 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 09 Ноябрь 2014 - 17:54

Как сделать отступ текста от правой и левой сторон?

на 5px

#19 Alekseys

Alekseys

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 2 355 сообщений

Отправлено 09 Ноябрь 2014 - 18:00

Просмотр сообщенияUltraMag (09 Ноябрь 2014 - 17:54) писал:

Как сделать отступ текста от правой и левой сторон?

на 5px
Здравствуйте. В main.css замените
.container .twelve.columns {
width: 880px;
z-index: 1000000;
overflow: visible;
margin-top: 20px;
margin-right: 13px;
}
на
.container .twelve.columns {
width: 880px;
z-index: 1000000;
overflow: visible;
margin-top: 20px;
margin-right: 3px;
padding: 0px 5px;
}


#20 admin

admin

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 504 сообщений
  • ГородСамара

Отправлено 10 Ноябрь 2014 - 18:24

Просмотр сообщенияИрина345 (09 Ноябрь 2014 - 15:00) писал:

Здравствуйте, найдите в шаблоне Товары код
<div class="contentText">
замените на
<div class="contentText" style="box-shadow: none;">
далее найдите в шаблоне товар код
<div class="contentText" itemscope itemtype="http://schema.org/Product">
замените на
<div class="contentText" itemscope itemtype="http://schema.org/Product" style="box-shadow: none;">

Много где встала тень где не надо. Можно её убрать везде,нужна она только по краям страницы.

Просмотр сообщенияAlekseys (09 Ноябрь 2014 - 18:00) писал:

Здравствуйте. В main.css замените
.container .twelve.columns {
width: 880px;
z-index: 1000000;
overflow: visible;
margin-top: 20px;
margin-right: 13px;
}
на
.container .twelve.columns {
width: 880px;
z-index: 1000000;
overflow: visible;
margin-top: 20px;
margin-right: 3px;
padding: 0px 5px;
}

Стало хуже,сместилось влево,откатил.




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных