Мобильный LiveInternet Мой анализ предложенного ранее скелетика рамочки

Авторизация

Дневник tomishka Лента друзей - Дневник - Полная версия

Мой анализ предложенного ранее скелетика рамочки 06-02-2024 09:11 к комментариям - к полной версии - понравилось!

...Здесь будет ваша запись...

<center><table style="background-image: url('***ОБВОДКА1***'); border-radius: 25px; box-shadow: 0px 0px 20px black; margin-center: 150px;" cellpadding="0" cellspacing="0"><tr><td style="padding: 2px;"><table style="background-image: url('***ФОН1***'); border-radius: 25px;" cellpadding="0" cellspacing="0"><tr><td style="padding: 2px;"><table style="background-image: url('***ОБВОДКА2***'); border-radius: 25px;" cellpadding="0" cellspacing="0"><tr><td style="padding: 2px;"><table style="background-image: url('***ФОН2***'); background-color: #000000; border-radius: 25px; box-shadow: inset 1px 1px 10px #00fe00;" cellpadding="0" cellspacing="0"><tr><td style="padding: 50px;"><table style="background-image: url('***ОБВОДКА3***'); border-radius: 25px; box-shadow: 1px 1px 10px #00fe00;" cellpadding="0" cellspacing="0"><tr><td style="padding: 3px;"><table style="background-image: url('***ФОН для ТЕКСТА***');  background-color: #000000; border: hidden 1px solid; border-radius: 25px; box-shadow: inset 0px 0px 30px #000000;" cellspacing="0" cellpadding="0" width="610"><tr><td style="padding:10px" zzz="zzz" align="center"><center><span style="font-family: Arial; color: #00fe00;font-size:20px">...Здесь будет ваша запись...<br /><br /><br /><br /><center><a title="Ваше Имя" href="httpАдрес" target="_blank"><img src="http:Картинки" border="0" width="***" height="***" alt="" align="center" /></a></center></span></center></td></tr></table></td></tr></table></td></tr></table></td></tr></table></td></tr></table></td></tr></table></center>

Скелетик, похоже, универсальный, попытаемся разобраться, что в нем и зачем (для наглядности я заменила фиолетовый цвет зеленым). Уберем ссылку на дневник автора. Для этого аккуратно выделим и сотрем всё указанное в окне.

У Наташи (Vi-Natalka) есть пост https://www.liveinternet.ru/users/vi-natalka/post491104664/, где она вообще рекомендует из кода рамочки эту часть убирать. Уберем лишние переходы на следующую строку после текста, оставив только один. Теперь начнем рассматривать предложенный код.

...Здесь будет ваша запись...

<center><table style="background-image: url('***ОБВОДКА1***'); border-radius: 25px; box-shadow: 0px 0px 20px black; margin-center: 150px;" cellpadding="0" cellspacing="0"><tr><td style="padding: 2px;"><table style="background-image: url('***ФОН1***'); border-radius: 25px;" cellpadding="0" cellspacing="0"><tr><td style="padding: 2px;"><table style="background-image: url('***ОБВОДКА2***'); border-radius: 25px;" cellpadding="0" cellspacing="0"><tr><td style="padding: 2px;"><table style="background-image: url('***ФОН2***'); background-color: #000000; border-radius: 25px; box-shadow: inset 1px 1px 10px #00fe00;" cellpadding="0" cellspacing="0"><tr><td style="padding: 50px;"><table style="background-image: url('***ОБВОДКА3***'); border-radius: 25px; box-shadow: 1px 1px 10px #00fe00;" cellpadding="0" cellspacing="0"><tr><td style="padding: 3px;"><table style="background-image: url('***ФОН для ТЕКСТА***');  background-color: #000000; border: hidden 1px solid; border-radius: 25px; box-shadow: inset 0px 0px 30px #000000;" cellspacing="0" cellpadding="0" width="610"><tr><td style="padding:10px" zzz="zzz" align="center"><center><span style="font-family: Arial; color: #00fe00;font-size:20px">...Здесь будет ваша запись...<br /></span></center></td></tr></table></td></tr></table></td></tr></table></td></tr></table></td></tr></table></td></tr></table></center>

Рамочка имеет шесть слоёв, каждый с закруглением в 25px. Вполне возможно, что раньше достаточно было указать только border-radius: 25px, но сейчас не все браузеры выполнят закругление, поэтому надо указывать еще дополнительно -moz-border-radius: 25px; -webkit-border-radius: 25px; -khtml-border-radius: 25px; для каждого слоя. Последнее дополнение встречается редко. Каждый слой содержит три тега ( table, tr, td ), но атрибуты разные. В принципе, один или несколько слоев можно удалить и посмотреть, как изменится вид рамочки. Я хочу подобрать обводки и фоны для шестислойной рамочки. Хочется еще отметить, что широкая полоска и фон под текст могут быть заданы двумя разными способами. Если используются оба, то преимущество имеет способ, задаваемый через адрес. Если хотите задать, например, фон под текст через код цвета, то надо аккуратно выделить и затем удалить ***ФОН для ТЕКСТА***, а предложенный черный цвет заменить нужным. Вот подобранные мной фоны.

А вот такой получилась рамочка.

...Здесь будет ваша запись...

<center><table style="background-image: url('https://img0.liveinternet.ru/images/attach/d/4/161/719/161719508_b0.jpg'); border-radius: 25px;-moz-border-radius: 25px; -webkit-border-radius: 25px; -khtml-border-radius: 25px; box-shadow: 0px 0px 20px black; margin-center: 150px;" cellpadding="0" cellspacing="0"><tr><td style="padding: 2px;"><table style="background-image: url('//img0.liveinternet.ru/images/attach/d/4/161/719/161719510_f1.jpg'); border-radius: 25px;-moz-border-radius: 25px; -webkit-border-radius: 25px; -khtml-border-radius: 25px;" cellpadding="0" cellspacing="0"><tr><td style="padding: 2px;"><table style="background-image: url('https://img0.liveinternet.ru/images/attach/d/4/161/719/161719508_b0.jpg'); border-radius: 25px;-moz-border-radius: 25px; -webkit-border-radius: 25px; -khtml-border-radius: 25px;" cellpadding="0" cellspacing="0"><tr><td style="padding: 2px;"><table style="background-image: url('//img1.liveinternet.ru/images/attach/d/4/161/719/161719513_f2.jpg'); background-color: #000000; border-radius: 25px;-moz-border-radius: 25px; -webkit-border-radius: 25px; -khtml-border-radius: 25px; box-shadow: inset 1px 1px 10px #000000;" cellpadding="0" cellspacing="0"><tr><td style="padding: 50px;"><table style="background-image: url('//img1.liveinternet.ru/images/attach/d/4/161/719/161719517_b1.png'); border-radius: 25px;-moz-border-radius: 25px; -webkit-border-radius: 25px; -khtml-border-radius: 25px; box-shadow: 1px 1px 10px #000000;" cellpadding="0" cellspacing="0"><tr><td style="padding: 3px;"><table style="background-image: url('//img1.liveinternet.ru/images/attach/d/4/161/719/161719537_f3.jpg');  background-color: #000000; border: hidden 1px solid; border-radius: 25px;-moz-border-radius: 25px; -webkit-border-radius: 25px; -khtml-border-radius: 25px; box-shadow: inset 0px 0px 30px #000000;" cellspacing="0" cellpadding="0" width="610"><tr><td style="padding:10px" zzz="zzz" align="center"><center><span style="font-family: Arial; color: #00fe00;font-size:20px">...Здесь будет ваша запись...<br /></span></center></td></tr></table></td></tr></table></td></tr></table></td></tr></table></td></tr></table></td></tr></table></center>

вверх^ к полной версии понравилось! в evernote

Комментарии (11):

Елена_Краева 06-02-2024-11:19 удалить

Лидочка, вы такая молодец!!! Удачи вам!!!!

Обратиться - Ответить - К полной версии

tomishka 06-02-2024-11:24 удалить

Ответ на комментарий Елена_Краева # Да какая молодец, если на предыдущий скелетик рамочки потратила день, но так и не смогла понять, что же за рамочку хотел автор сделать. Брала разные бордюры, но все впустую.

Обратиться - Ответить - К полной версии

E-Ledi 06-02-2024-12:35 удалить

Лидочка, доброго дня!
Не устаю восхищаться Вашим трудолюбием, настойчивостью в достижении цели,фантазией, терпением, желанием дойти до самой сути.
Теперь у нас - желторотиков - есть надёжное плечо, опора.
Спасибо за то, что Вы есть.
С огромной благодарностью цитирую.

Обратиться - Ответить - К полной версии

tomishka 06-02-2024-12:49 удалить

Ответ на комментарий E-Ledi # Леночка, спасибо прежде всего за цитирование. Похоже, единственное место, где не обвинят в воровстве, это уроки. Однако, и здесь могут придраться из-за того, что адреса кодов не отвечают авторским, ведь я все делаю через прикрепленные файлы, чтобы ничего не исчезало. В дневнике я практически все восстановила, остался один урок, где есть парочка квадратиков. Надо довести до ума в ближайшее время. Спасибо еще раз, и дай бог вам здоровья.

Обратиться - Ответить - К полной версии

tomishka 06-02-2024-13:35 удалить

Ответ на комментарий E-Ledi # Леночка, при переходе на страницу комментарий исчезает, поэтому отвечаю здесь. Поясню, к какому выводу я пришла, занимаясь разгадыванием скелетика. Если фон с боковым бордюром, то это в рамочке никак не отражается. Текст потом может наезжать на бордюр но это дело поправимое. А вот если бордюр будет сверху, то в рамочке без текста вверху будет большой отступ, а потом при заполнении текста он сойдет на нет. Я потом сделала рамочки с боковым бордюром, но без использования высоты.

Обратиться - Ответить - К полной версии

E-Ledi 06-02-2024-13:54 удалить

Ответ на комментарий tomishka # Ага....понятненько. )
Более глубоко разберусь ближе к вечеру.
Ещё раз примите мои восхищения и благодарность.

Обратиться - Ответить - К полной версии

Елена_Краева 07-02-2024-11:35 удалить

Ответ на комментарий tomishka # Да вы скоро программистом работать сможете

Обратиться - Ответить - К полной версии

tomishka 07-02-2024-11:46 удалить

Ответ на комментарий Елена_Краева # Когда мы учились, то работы выполняли на первой машине Урал-1, 100 операций в секунду. Информация набивалась на перфокарты, а нынешняя молодежь современную ЭВМ в руке носит. Леночка, а вы пробовали программы ИИ?

Обратиться - Ответить - К полной версии

Елена_Краева 08-02-2024-08:31 удалить

Ответ на комментарий tomishka # Мы работали на Наири. Тоже перфокарты. Но я уже вообще ничего не помню, что там было)))
Сейчас даже, наверное, проще. Все программы и коды за тебя составили)) Я даже и не пытаюсь. Разобралась по мелочи, где какой слой в рамочках, где пробел, где цвет текста)))

Обратиться - Ответить - К полной версии

Елена_Краева 08-02-2024-08:32 удалить

Ответ на комментарий Елена_Краева # Зато разобралась с программой в электронной вязальной машине)))

Обратиться - Ответить - К полной версии

tomishka 08-02-2024-08:55 удалить

Ответ на комментарий Елена_Краева # Да, здесь у вас конкурентов нет. Да и с анимацией, если брать лирушников, то практически только у вас картинки не расплываются. А я только недавно разобралась с поворотом. Все методом тыка, без знания английского.

Обратиться - Ответить - К полной версии

Комментарии (11): вверх^

Вы сейчас не можете прокомментировать это сообщение.

Дневник Мой анализ предложенного ранее скелетика рамочки | tomishka - Дневник tomishka | Лента друзей tomishka / Полная версия Добавить в друзья Страницы: раньше»