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


Как Сделать Прозрачность (Как-Будто На Стекле)

Автор odissei, 22 дек. 2012 02:29

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

#1 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 22 Декабрь 2012 - 02:29

Примерно как здесь:
http://инфэшн.рф/

Полностью окантовка всей станицы. И по краям этой таблицы (окантовки, обрамления как назвать) виден даже эффект преломления.
Вижу что она целостная и больше стандартной, через что сделать подобное? На каком нить примере покажите плз.

P.S. Дизайн копировать не собираюсь, плюс направление у меня совсем другое.

#2 Vaccina

Vaccina

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

  • Модераторы
  • 24 353 сообщений

Отправлено 22 Декабрь 2012 - 04:49

Вам необходимо в файле стилей main.css раздела редактора тем - найти

#container {
	margin: 0 auto;
	max-width: 1000px;
	width: 1000px;
}

и заменить на

#container {
	background-color: rgba(255, 255, 255, 0.5);
	box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
	margin: 0 auto;
	max-width: 1000px;
	width: 1000px;
}

далее вам понадобиться задать общий фон. Это вы можете сделать в классе

#backtop {
	background: url("/web/upload/assets/images/145/144230/bgout.jpg") repeat scroll center bottom transparent;
}

вам необходимо или изменить изображение "bgout.jpg" в разделе редактора тем, или же прописать в данном классе другое изображение.

Возможно вам так же понадобиться убрать белый фон у общего контента. Это может сделать в классе

#cntrobj {
	background: url("/web/upload/assets/images/145/144230/conteiner-bg-y.jpg") repeat-y scroll 0 0 transparent;
}

просто заменив его на

#cntrobj {
	background: transparent;
}

#3 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 22 Декабрь 2012 - 09:42

Спасибо, есть с чем играться ближайшее время))

#4 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 22 Декабрь 2012 - 12:15

Еще вопросик:
А где увеличить ширину этого самого прозрачного поля, чтобы края были не в притык к левой и правой стороне контента, а чуть больше? Как на том же инфэшн?



Цитата

#container {         background-color: rgba(255, 255, 255, 0.5);         box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);         margin: 0 auto;         max-width: 1000px;         width: 1000px; }
Пробовал тут менять, увеличивать. Тогда все ломается: левая граница прижимается, а с права появляется место.

Подскажите какой класс ковырять? где выставить center, если надо?

#5 support 2.0

support 2.0

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

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

Отправлено 22 Декабрь 2012 - 12:35

Просмотр сообщенияodissei (22 Декабрь 2012 - 12:15) писал:

Еще вопросик:
А где увеличить ширину этого самого прозрачного поля, чтобы края были не в притык к левой и правой стороне контента, а чуть больше? Как на том же инфэшн?




Пробовал тут менять, увеличивать. Тогда все ломается: левая граница прижимается, а с права появляется место.

Подскажите какой класс ковырять? где выставить center, если надо?

Меняйте размер именно параметров, выделенных красным цветом. Контент будет прижиматься вправо потому, что у него по умолчанию стоит параметр по правому краю. Скажите какой размер этого полупрозрачного фона Вам нужны и мы напишем Вам код для вставки в стили

#6 miyako

miyako

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

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

Отправлено 22 Декабрь 2012 - 12:38

Просмотр сообщенияodissei (22 Декабрь 2012 - 12:15) писал:

Еще вопросик:
А где увеличить ширину этого самого прозрачного поля, чтобы края были не в притык к левой и правой стороне контента, а чуть больше? Как на том же инфэшн?




Пробовал тут менять, увеличивать. Тогда все ломается: левая граница прижимается, а с права появляется место.

Подскажите какой класс ковырять? где выставить center, если надо?

Замените код :
#container {
background-color: rgba(255, 255, 255, 0.5);
box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
margin: 0 auto;
max-width: 1000px;
width: 1000px;
}
на этот:
#container {
background-color: rgba(255, 255, 255, 0.5);
box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
margin: 0 auto;
max-width: 1000px;
width: 1000px;
padding-left: 10px;
padding-right: 10px;
}

#7 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 23 Декабрь 2012 - 01:59

support 2.0, я не мог представить размеры, по разному посмотрел, понял сколько это в пикселях)

miyako, спс, то что надо.


И надеюсь последний вопрос по этой теме:

Как сделать чтобы эта "окантовка стеклянная" еще и подвал захватила? Т.е. у подавала фон также оставляем, но добавляется эффект преломления, и низ этого "стекла" чтобы был с округленными краями и проходил под футером - как на том же инфэшн. И второй вариант, тут же, что бы это "стекло" шло вниз до конца сайта - в этом случае скругленные углы не нужны.

1 вариант:
Без-имени-1.jpg

2 вариант:
Без-имени-2.jpg

#8 Koderhan

Koderhan

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

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

Отправлено 24 Декабрь 2012 - 07:16

Просмотр сообщенияodissei (23 Декабрь 2012 - 01:59) писал:

support 2.0, я не мог представить размеры, по разному посмотрел, понял сколько это в пикселях)

miyako, спс, то что надо.


И надеюсь последний вопрос по этой теме:

Как сделать чтобы эта "окантовка стеклянная" еще и подвал захватила? Т.е. у подавала фон также оставляем, но добавляется эффект преломления, и низ этого "стекла" чтобы был с округленными краями и проходил под футером - как на том же инфэшн. И второй вариант, тут же, что бы это "стекло" шло вниз до конца сайта - в этом случае скругленные углы не нужны.

1 вариант:
Прикрепленный файл Без-имени-1.jpg

2 вариант:
Прикрепленный файл Без-имени-2.jpg
На вашем сайте стеклянная окантовка распростроняется так же на подвал. Я так понимаю вопрос уже не актуален?
Если вы хотите оставить фон на footer то можно в файл main.csstemplate добавить следующий код.
#footer {
	background:#485d63;
	color:white;
	border-top:4px solid #64828b;
	margin:20px 0 17px 0;
	border-radius: 0px 0px 10px 10px;
}
#footer #main .menufooter ul li a {
	color:white;
}
Изображение

#9 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 24 Декабрь 2012 - 08:21

Цитата

На вашем сайте стеклянная окантовка распростроняется так же на подвал. Я так понимаю вопрос уже не актуален?
Если вы хотите оставить фон на footer то можно в файл main.csstemplate добавить следующий код.

На нем надо сделать. Вопрос актуален.
А инфэшн (где как раз все работает) - это я для примера приводил.

Помогите плиз с этими двумя вариантами, два разных кода.

#10 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 24 Декабрь 2012 - 11:16

апну тему, а то вдруг потерялась))

Решение ведь не сложное полагаю (ведь есть образец).

Еще раз вопрос:
Помогите пожалуйста кодом, для двух вариантов указанных в сообщении
http://forum.storela...кле/#entry36240

Заранее спасибо.

#11 Koderhan

Koderhan

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

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

Отправлено 24 Декабрь 2012 - 12:14

Просмотр сообщенияodissei (24 Декабрь 2012 - 11:16) писал:

апну тему, а то вдруг потерялась))

Решение ведь не сложное полагаю (ведь есть образец).

Еще раз вопрос:
Помогите пожалуйста кодом, для двух вариантов указанных в сообщении
http://forum.storela...кле/#entry36240

Заранее спасибо.
В файле main.csstemplate.
Найти код:
#bottobj { background:url({ASSETS_IMAGES_PATH}conteiner-bg.png) 0 -11px no-repeat; width:1000px; height:11px; margin:0 auto; }
Заменить:
#bottobj {width:1000px; height:11px; margin:0 auto; }
В файле HTML.
Найти и удалить код:
<!-- Подвал -->
<div id="footer">
<div id="main">
<div class="menufooter">
	 <ul>
	 {% FOR menu %}
		 {% FOR footer %}
		 {% FOR links %}<li {% IF menu.footer.links.first %}class="main"{% ENDIF %} ><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="current"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
		 {% ENDFOR %}
	 {% ENDFOR %}
	 </ul>
</div>
<div class="copyring">
	 <p>&copy; {DATE_YEAR} {SETTINGS_STORE_NAME}. {SETTINGS_STORE_ORG_NAME}. Все права защищены.</p>
</div>
</div>
</div>
<!-- Подвал-Конец -->
Найти код:

			 {% IF news_list_articles.SHOW_TIME %}
				 <div class="statedate fnt12 fnt11n txtalgnlft">
				 {news_list_articles.TIME | date("d.m.Y")}
				 </div>
			 {% ENDIF %}
			 </div>
		 {% ENDFOR %}
		 </div>
		 <div class="blockbottom"></div>
	 </div>
	 {% ENDIF %}
	 <!-- END Если есть список статей и если в тарифном плане подключен модуль новостей -->
{% ENDIF %}
</div>
ScreenShot 285.jpg
И вставить после:
<!-- Подвал -->
<div id="footer">
<div id="main">
<div class="menufooter">
	 <ul>
	 {% FOR menu %}
		 {% FOR footer %}
		 {% FOR links %}<li {% IF menu.footer.links.first %}class="main"{% ENDIF %} ><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="current"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
		 {% ENDFOR %}
	 {% ENDFOR %}
	 </ul>
</div>
<div class="copyring">
	 <p>&copy; {DATE_YEAR} {SETTINGS_STORE_NAME}. {SETTINGS_STORE_ORG_NAME}. Все права защищены.</p>
</div>
</div>
</div>
<!-- Подвал-Конец -->
ScreenShot 284.jpg

Для добавления эффекта закругления углов.
В файле main.csstemplate.
Найти код:
#container {
background-color: rgba(255, 255, 255, 0.5);
box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
margin: 0 auto;
max-width: 1000px;
width: 1000px;
padding-left: 15px;
padding-right: 15px;
}
Заменить:
#container {
background-color: rgba(255, 255, 255, 0.5);
box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
margin: 0 auto;
max-width: 1000px;
width: 1000px;
padding-left: 15px;
padding-right: 15px;
border-radius: 10px;
}

#12 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 24 Декабрь 2012 - 12:27

Сделал как писали, как то все поломалось.

Что не так?

#13 Koderhan

Koderhan

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

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

Отправлено 24 Декабрь 2012 - 14:21

попробуйте восстановить шаблон из резервной копии и заново повторить эти же действия.

#14 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 25 Декабрь 2012 - 02:04

Хм, не получается.

По порядку:
1.Делаю изменения в стилях, приведенные в посте (или посту :)) № 11 даннной темы.
Тут все просто и ясно.

2. По коду HTML начинается путанится у меня:
2.1. Найти и удалить код:
<!-- Подвал -->
<div id="footer">
<div id="main">
<div class="menufooter">
		 <ul>
		 {% FOR menu %}
				 {% FOR footer %}
				 {% FOR links %}<li {% IF menu.footer.links.first %}class="main"{% ENDIF %} ><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="current"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
				 {% ENDFOR %}
		 {% ENDFOR %}
		 </ul>
</div>
<div class="copyring">
		 <p>&copy; {DATE_YEAR} {SETTINGS_STORE_NAME}. {SETTINGS_STORE_ORG_NAME}. Все права защищены.</p>
</div>
</div>
</div>
<!-- Подвал-Конец -->

Здесь надо удалить код подвала.
А ниже, надо вставить код (другой) после кода подвала.

Если удалить код подвала, то подвал просто исчезнет.

Потому я решил что конечный код, должен соответствовать вашим скриншотам (рисункам) кода (именно последнему):
Получается по тому рисунку надо было сделать так:
Найти следующий код, и вставить его после подвала:
<div class="clear"></div>
</div>
</div>
<div id="bottobj"></div>

В итоге мы имеем следующий код:
{% IF news_list_articles.SHOW_TIME %}
				 <div class="statedate fnt12 fnt11n txtalgnlft">
				 {news_list_articles.TIME | date("d.m.Y")}
				 </div>
			 {% ENDIF %}
			 </div>
		 {% ENDFOR %}
		 </div>
		 <div class="blockbottom"></div>
	 </div>
	 {% ENDIF %}
	 <!-- END Если есть список статей и если в тарифном плане подключен модуль новостей -->
{% ENDIF %}
</div>
<!-- Подвал -->
<div id="footer">
<div id="main">
<div class="menufooter">
		 <ul>
		 {% FOR menu %}
				 {% FOR footer %}
				 {% FOR links %}<li {% IF menu.footer.links.first %}class="main"{% ENDIF %} ><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="current"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
				 {% ENDFOR %}
		 {% ENDFOR %}
		 </ul>
</div>
<div class="copyring">
		 <p>&copy; {DATE_YEAR} {SETTINGS_STORE_NAME}. {SETTINGS_STORE_ORG_NAME}. Все права защищены.</p>
</div>
</div>
</div>
<!-- Подвал-Конец -->

<div class="clear"></div>
</div>
</div>
<div id="bottobj"></div>

Который соответствует коду, который приведен на вашем последнем скриншоте.

Получилось вот так:1.jpg
Я со страницы убрал все, чтобы она в один скрин влезла.

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

В принципе это соответствует 1му варинту из сообщения №7 данной темы. Но не много не то (там я рисовал что стекло проходит под футером, а не как окантовка только по бокам). (возможно код представить как это сделать, пример все тот же инфэшн.рф)

Если немного изменить, то это будет соответствовать варианту 2 из 7 поста. Только надо чтобы оконтовка из стекла по бокам, была на протяжении всей страницы (т.е. начало с самого вверха, как и есть счас, и заканчивалась в самом низу страници, ниже футера). Если это довольно трудно (громоздить всякой фигни придется) то можно сделать, опять же, как на том эе инфэшн.рф, - стекло начинается к верхнему краю впритык, а внизу заканчивается под футером, немного не доходя нижнего края страницы. Важное условие: под футером все должно быть под стеклом (не только бока).

Для наглядности привожу скриншоты:
1. Надо чтобы было вот так:
3.jpg
Оно же, с вашего поста:
4.png

2. Или, хотя бы, вот так:
2.jpg

Ресурс : bel-mag.ru

Еще раз спасибо за помощь, большое.
Надеюсь не сильно одолел уже)

#15 miyako

miyako

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

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

Отправлено 25 Декабрь 2012 - 07:18

Просмотр сообщенияodissei (25 Декабрь 2012 - 02:04) писал:

Хм, не получается.

По порядку:
1.Делаю изменения в стилях, приведенные в посте (или посту :)) № 11 даннной темы.
Тут все просто и ясно.

2. По коду HTML начинается путанится у меня:
2.1. Найти и удалить код:
<!-- Подвал -->
<div id="footer">
<div id="main">
<div class="menufooter">
		 <ul>
		 {% FOR menu %}
				 {% FOR footer %}
				 {% FOR links %}<li {% IF menu.footer.links.first %}class="main"{% ENDIF %} ><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="current"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
				 {% ENDFOR %}
		 {% ENDFOR %}
		 </ul>
</div>
<div class="copyring">
		 <p>&copy; {DATE_YEAR} {SETTINGS_STORE_NAME}. {SETTINGS_STORE_ORG_NAME}. Все права защищены.</p>
</div>
</div>
</div>
<!-- Подвал-Конец -->

Здесь надо удалить код подвала.
А ниже, надо вставить код (другой) после кода подвала.

Если удалить код подвала, то подвал просто исчезнет.

Потому я решил что конечный код, должен соответствовать вашим скриншотам (рисункам) кода (именно последнему):
Получается по тому рисунку надо было сделать так:
Найти следующий код, и вставить его после подвала:
<div class="clear"></div>
</div>
</div>
<div id="bottobj"></div>

В итоге мы имеем следующий код:
{% IF news_list_articles.SHOW_TIME %}
				 <div class="statedate fnt12 fnt11n txtalgnlft">
				 {news_list_articles.TIME | date("d.m.Y")}
				 </div>
			 {% ENDIF %}
			 </div>
		 {% ENDFOR %}
		 </div>
		 <div class="blockbottom"></div>
	 </div>
	 {% ENDIF %}
	 <!-- END Если есть список статей и если в тарифном плане подключен модуль новостей -->
{% ENDIF %}
</div>
<!-- Подвал -->
<div id="footer">
<div id="main">
<div class="menufooter">
		 <ul>
		 {% FOR menu %}
				 {% FOR footer %}
				 {% FOR links %}<li {% IF menu.footer.links.first %}class="main"{% ENDIF %} ><a href="{menu.footer.links.URL}" {% IF menu.footer.links.SELECTED %}class="current"{%ENDIF%} {% IF menu.footer.links.TITLE %}title="{menu.footer.links.TITLE}"{% ENDIF %}>{menu.footer.links.NAME}</a></li>{% ENDFOR %}
				 {% ENDFOR %}
		 {% ENDFOR %}
		 </ul>
</div>
<div class="copyring">
		 <p>&copy; {DATE_YEAR} {SETTINGS_STORE_NAME}. {SETTINGS_STORE_ORG_NAME}. Все права защищены.</p>
</div>
</div>
</div>
<!-- Подвал-Конец -->

<div class="clear"></div>
</div>
</div>
<div id="bottobj"></div>

Который соответствует коду, который приведен на вашем последнем скриншоте.

Получилось вот так:Прикрепленный файл 1.jpg
Я со страницы убрал все, чтобы она в один скрин влезла.

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

В принципе это соответствует 1му варинту из сообщения №7 данной темы. Но не много не то (там я рисовал что стекло проходит под футером, а не как окантовка только по бокам). (возможно код представить как это сделать, пример все тот же инфэшн.рф)

Если немного изменить, то это будет соответствовать варианту 2 из 7 поста. Только надо чтобы оконтовка из стекла по бокам, была на протяжении всей страницы (т.е. начало с самого вверха, как и есть счас, и заканчивалась в самом низу страници, ниже футера). Если это довольно трудно (громоздить всякой фигни придется) то можно сделать, опять же, как на том эе инфэшн.рф, - стекло начинается к верхнему краю впритык, а внизу заканчивается под футером, немного не доходя нижнего края страницы. Важное условие: под футером все должно быть под стеклом (не только бока).

Для наглядности привожу скриншоты:
1. Надо чтобы было вот так:
Прикрепленный файл 3.jpg
Оно же, с вашего поста:
Прикрепленный файл 4.png

2. Или, хотя бы, вот так:
Прикрепленный файл 2.jpg

Ресурс : bel-mag.ru

Еще раз спасибо за помощь, большое.
Надеюсь не сильно одолел уже)

В панели управления магазином, в разделе "Сайт" > "Редактор тем" в блоке "Стили и скрипты" находим файл main.csstemplate, открываем его и вставляем следующий код:
#container {
background-color: rgba(255, 255, 255, 0.5);
box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
margin: 0 auto;
max-width: 1000px;
width: 1000px;
padding-left: 15px;
padding-right: 15px;
border-radius: 10px;
}
И замените его на:
#container {
background-color: rgba(255, 255, 255, 0.5);
box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
margin: 0 auto;
max-width: 1000px;
width: 1000px;
padding-left: 15px;
padding-right: 15px;
border-radius: 10px;
height:100%;
}

#16 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 25 Декабрь 2012 - 08:12

И замените его на:
#container {
background-color: rgba(255, 255, 255, 0.5);
box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
margin: 0 auto;
max-width: 1000px;
width: 1000px;
padding-left: 15px;
padding-right: 15px;
border-radius: 10px;
height:100%;
}
----
Сделал так, чет ничего не меняется?
Несколько раз пробовал ( к примеру скругление углов убираем или ставим обратно - все изменения видно). А height:100% как-то не проявляет себя совсем.

В чем проблема может быть?

#17 miyako

miyako

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

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

Отправлено 25 Декабрь 2012 - 08:30

Просмотр сообщенияodissei (25 Декабрь 2012 - 08:12) писал:

И замените его на:
#container {
background-color: rgba(255, 255, 255, 0.5);
box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
margin: 0 auto;
max-width: 1000px;
width: 1000px;
padding-left: 15px;
padding-right: 15px;
border-radius: 10px;
height:100%;
}
----
Сделал так, чет ничего не меняется?
Несколько раз пробовал ( к примеру скругление углов убираем или ставим обратно - все изменения видно). А height:100% как-то не проявляет себя совсем.

В чем проблема может быть?

Сейчас на ваш сайт выглядит так, как на приведенном ниже скриншоте.
Что конкретно вы хотите изменить?

Прикрепленные изображения

  • Безымянный_2.png

#18 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 25 Декабрь 2012 - 09:00

Вы наверное уже думаете что я малость слабоумный :))

Но это не так.

Плюс я упустил возможную проблему отображения в разных браузерах.
Привожу скриншоты отображения в браузерах:
1. Opera v.10.00:
opera.jpg

2. Firefox v.17.0.1:
ff.jpg

3. Internet Explorer v. 9.0:
ie.jpg


Собсно в опере еще куда не шло, в ФФ и ИЕ неудовлетворительно.
Хром не установлен, но хоть радует что в хроме все неплохо.
Вот об этом я и говорю.
Как решить проблему?

#19 odissei

odissei

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

  • Пользователи
  • PipPipPipPip
  • 382 сообщений
  • ГородАм. Область

Отправлено 25 Декабрь 2012 - 10:01

Вопрос впринципе решен, понял куда смотреть далее (наладить совместимость и играться с параметрами).
Почувствовал себя днищем:)))
Вот код:

Цитата

#container {
background-color: rgba(255, 255, 255, 0.5);
box-shadow: 3px 3px 15px rgba(1, 3, 1, 0.75);
margin: 0 auto;
max-width: 1000px;
width: 1000px;
padding:0px 15px 20px;
border-radius: 15px;
}
Соответственно: высота, лево и право, низ.

Спасибо за помощь всем.

#20 miyako

miyako

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

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

Отправлено 25 Декабрь 2012 - 10:17

Просмотр сообщенияodissei (25 Декабрь 2012 - 09:00) писал:

Вы наверное уже думаете что я малость слабоумный :))

Но это не так.

Плюс я упустил возможную проблему отображения в разных браузерах.
Привожу скриншоты отображения в браузерах:
1. Opera v.10.00:
Прикрепленный файл opera.jpg

2. Firefox v.17.0.1:
Прикрепленный файл ff.jpg

3. Internet Explorer v. 9.0:
Прикрепленный файл ie.jpg


Собсно в опере еще куда не шло, в ФФ и ИЕ неудовлетворительно.
Хром не установлен, но хоть радует что в хроме все неплохо.
Вот об этом я и говорю.
Как решить проблему?

Для решения проблемы в Ie в Редакторе тем в шаблоне HTML перед строкой вставьте следующий код:  
  <!--[if lt IE 9]>
  <style type="text/css">
   #container {
	background-color: #F7FBFF; /*подберите нужный вам цвет*/
	filter: alpha(Opacity=70); /* Прозрачность в IE */
   }
  </style>
  <![endif]-->

Обратно в Изменение общей стилистики


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

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

  1. Форум владельцев интернет-магазинов
  2. → Вопросы работы сервиса StoreLand
  3. → Дизайн
  4. → Шаблон Пластик
  5. → Изменение общей стилистики
  6. Privacy Policy