ZorNet.Ru — сайт для вебмастера » HTML и CSS » Закругление углов изображение на сайте uCoz

Закругление углов изображение на сайте uCoz

Закругление углов изображение на сайте uCoz
Это больше к дизайн относиться, так как само закругление углов будет красиво. Вы устанавливаете свой размер на форум, а стили которые настроены, делают по другому. А точнее, если он к примеру в большой картинке идет и по умолчанию у системы свое стоит, чтоб при нажатие увеличить. То здесь вы по умолчанию сами выставите, и по краям будет идти темный бордюр в полупрозрачном виде. Просто все на скрине не показать, а нужно установить и видеть все. Есть такие, что ставят на свой размер и увеличение не работает. Здесь все работает стабильно, только как сказано, будет преподносится красивее.

Вы видите как на форуме это работает и под этот модуль, вам нужно прописать эти стили в CSS сайта.

Код
.posttdMessage img {  
  max-width:650px;  
  border-radius: 6px 6px 6px 6px;  
  box-shadow: 0 1px 5px rgba(250, 250, 250, 0.3);  
  margin:5 5px 5 5;  
  }


Но как же нам сделать, чтоб на всем сайте такой красивый эффект получился. И здесь на остальные каталоги как новостях/каталог файлов и другие идет стиль.

Код
.eMessage img {  
  max-width:650px;  
  border-radius: 6px 6px 6px 6px;  
  box-shadow: 0 1px 5px rgba(250, 250, 250, 0.3);  
  margin:5 5px 5 5;  
  }


Как видим, что ширина выставлена на 650px, и здесь вы можете уже сами решить, какой она будет.
08 Июня 2016 Просмотров: 1733 Комментариев: (10)

Поделиться в социальных сетях

Материал разместил

Оставь свой отзыв

Комментарии: 10
Scheme
Scheme 08 Июня 2016 21:421
0
А что только одна ширина указано, или по ней автоматически все будет определятся.
Сопрано
Сопрано 08 Июня 2016 21:452
0
Но если не устроит, попробуй длину выставить, хотя она там думаю не нужна, height="154" - но здесь кому как.
Angerfist
Angerfist 08 Июня 2016 22:575
0
Заметь что в коде написано не просто width а max-width:650px, или это ничего не говорит?
Kosten
Kosten 08 Июня 2016 21:573
0
Не знаю как вы длину будете ставить, но можно думаю, но поставив на темный дизайн, совершенно другой вид. Есть такое, что мобильные устройства не держат ширину и форум получается не такой, что картинки во всю ширину показываются, думаю здесь может такого как раз и не будет.
Angerfist
Angerfist 08 Июня 2016 22:464
0
Без обид, но зачем четыре раза писать радиус, а также отступы margin, пишется так если разные величины а тут одни) Один раз нужно, почему заметил, оглядываясь назад замечал за своими кодами лишние записи и потом упорото сокращал)))
Kosten
Kosten 08 Июня 2016 23:046
0
Angerfist, просвети, как нужно, может поделишься нужными стилями.
Angerfist
Angerfist 08 Июня 2016 23:117
0
Если отступы margin и padding то:
1-Отступы будут установлены одновременно от каждого края элемента.
2-Первое значение устанавливает отступ от верхнего и нижнего края, второе — от левого и правого.
3-Первое значение задает отступ от верхнего края, второе — одновременно от левого и правого края, а третье — от нижнего края.
4-Поочередно устанавливается отступ от верхнего, правого, нижнего и левого края.
Ну и радиус:
1-Радиус указывается для всех четырех уголков.
2-Первое значение задает радиус верхнего левого и нижнего правого уголка, второе значение — верхнего правого и нижнего левого уголка.
3- Первое значение задает радиус для верхнего левого уголка, второе — одновременно для верхнего правого и нижнего левого, а третье — для нижнего правого уголка.
4-По очереди устанавливает радиус для верхнего левого, верхнего правого, нижнего правого и нижнего левого уголка.
Сопрано
Сопрано 09 Июня 2016 00:348
0
Не чего не понял, по скопированному только нашел работу с текстом.
Angerfist
Angerfist 09 Июня 2016 01:179
0
Я имел ввиду если отступы margin: 5px; 1-значение в 5px стоит, значит отступаем от каждого края , Если же margin: 10px 5px; с 2-значениями: то 10px отступ от верха и низа задаём, а уже 5px отступаем от левого и правого края и так далее, и тот же принцип с радиусом.
Просто выше в списке под цифрами имеется ввиду сколько значений с параметрами в стиле, бывает так что надо радиус блока только внизу выставить, для этого мы пишем 4 цифры типа border-radius: 0 0 5px 5px; с одним,двумя или тремя бы так не вышло. Или отступы внутри блока для текста по бокам по 20px а верх и низ 5px то пишем в стилях margin: 5px 20px;

Кстати эти параметры общие не обязательно для текста,картинок.
Kosten
Kosten 09 Июня 2016 18:4210
0
Angerfist, а какие стили можно идеальные вывести на эту информацию.
avatar