Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.88/8: Рейтинг темы: голосов - 8, средняя оценка - 4.88
 Аватар для sashok89
75 / 75 / 11
Регистрация: 04.08.2012
Сообщений: 526
Записей в блоге: 2

Сверстайте текст таким образом, чтоб он обтекал изображение

10.02.2014, 18:16. Показов 1606. Ответов 3
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Добрый день!!!
При собеседование на должность верстальщика мне дали тестовые задания!!!
Хочу поделиться интересными заданиями с сообществом и заодно разобрать как их делать!!!
Задача 1
Сверстайте текст таким образом, чтоб он обтекал изображение (палец вверх) так,
как показано в .psd макете. Шрифт стандартный (Arial), отступы, цвет, размер
берите из макета. Если увеличим (в разумных переделах) шрифт, то обтекание
должно остаться.
Кроссбраузерность: IE7+, Chrome25+, Safari5+, Firefox 19+, Opera 11+

Посидев и подумав я понял, что средствами html и css так не сделать!
У кого какие идеи?
0
Лучшие ответы (1)
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
10.02.2014, 18:16
Ответы с готовыми решениями:

Как сделать, чтобы текст "обтекал" изображение?
Я начинающий программист, помогите, пожалуйста, решить проблему. Создаю страницу, использую таблицу для выравнивания текста и изображения....

Преобразовать массив таким образом , чтоб сначала располагались отрицательные числа, а затем все остальные.
Задача 1 Преобразовать массив таким образом , чтоб сначала располагались отрицательные числа, а затем все остальные. Задача 2 Дана...

Сделать плейлист в listview таким образом, чтобы отображалось изображение мелодии?
Добрый время суток. Подскажите пожалуйста, как можно сделать плейлист в listview таким образом, чтобы отображалось изображение мелодии?

3
74 / 71 / 37
Регистрация: 10.09.2011
Сообщений: 169
10.02.2014, 19:51
Лучший ответ Сообщение было отмечено sashok89 как решение

Решение

Цитата Сообщение от sashok89 Посмотреть сообщение
Посидев и подумав я понял, что средствами html и css так не сделать!
Всегда легче сказать нельзя, чем сделать. http://www.csstextwrap.com/ + http://www.csstextwrap.com/example_for_demo.php
1
 Аватар для sashok89
75 / 75 / 11
Регистрация: 04.08.2012
Сообщений: 526
Записей в блоге: 2
10.02.2014, 22:19  [ТС]
Неплохое решение данной проблемы!
Но хотелось бы что-нибудь более элегантное!!!
0
Эксперт JSЭксперт HTML/CSS
2436 / 1115 / 312
Регистрация: 23.06.2011
Сообщений: 3,531
11.02.2014, 08:54
Цитата Сообщение от sashok89 Посмотреть сообщение
Но хотелось бы что-нибудь более элегантное!!!
Это все мертвая привязка, изменить сам текст, слова другой длины, изменить шрифт и/или его размер и все перекосит.

Думаю нужно скриптом считать сколько строк влезает в нужное место, зависит от высоты картинки, и нужно знать минимум и максимум возможной ширины, и саму кривую еще нужно знать, чтобы скрипту подсунуть нужное смещение в нужном месте, и исходя из этих данных генерить html код.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
11.02.2014, 08:54
Помогаю со студенческими работами здесь

Сформировать новый массив В таким образом, чтоб в него вошли те элементы массива А, которые по модулю меньше числа 12
В массиве С(57) лежат целые числа. Сформировать новый массив В таким образом, чтоб в него вошли те элементы массива А, которые по модулю...

Как переименовать во всем документе текст таким образом
Простите если публикую не в тот раздел, но не нашел другого подходящего. Помогите если кто может. Есть скрипт в текстовом...

Дано некоторый текст. Отредактировать его таким образом
Дано некоторый текст. Отредактировать его таким образом, чтобы все символы «.» были заменены на «...», символы «:» на «-», а символы...

Дан массив из N целых чисел.Изменить его таким образом чтоб его значения шли в обратном порядке.
Дан массив из N целых чисел.Изменить его таким образом чтоб его значения шли в обратном порядке.

Как в веб сервере Apache (ОС Linux Ubuntu) настроить логирование таким образом, чтоб при любом запросе веб-се
Помогите пожалуйста!!!Как в веб сервере Apache (ОС Linux Ubuntu) настроить логирование таким образом, чтоб при любом запросе веб-сервер...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
Модель ЗдрввоСохранения 7: больше работников, больше ресурсов.
anaschu 08.04.2026
работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ
Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики.
Hrethgir 07.04.2026
Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .
Горе от ума
kumehtar 07.04.2026
Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .
Использование значений реквизитов справочника в документе, с определенными условиями и правами
Maks 07.04.2026
1. Контроль срока действия договора Алгоритм из решения ниже реализован на примере нетипового документа "ЗаявкаНаРаботу", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если. . .
Доступность команды формы по условию
Maks 07.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: сделать доступной кнопку (команда формы "ЗавершитьСписание") при. . .
Уведомление о неверно выбранном значении справочника
Maks 06.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .
Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt
8Observer8 05.04.2026
Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .
AkelPad-скрипты, структуры, и немного лирики..
testuser2 05.04.2026
Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru