Отправляет email-рассылки с помощью сервиса Sendsay

RFpro.ru: Элементы HTML и CSS

  Все выпуски  

RFpro.ru: Элементы HTML и CSS


РАССЫЛКИ ПОРТАЛА RFPRO.RU

Лучшие эксперты в разделе

Коцюрбенко Алексей aka Жерар
Статус: Мастер-Эксперт
Рейтинг: 734
∙ повысить рейтинг »
Valery N
Статус: Мастер-Эксперт
Рейтинг: 22
∙ повысить рейтинг »
Марк Крейн
Статус: 5-й класс
Рейтинг: 20
∙ повысить рейтинг »

∙ HTML / DHTML / XML / CSS

Номер выпуска:551
Дата выхода:14.05.2017, 19:15
Администратор рассылки:Коцюрбенко Алексей aka Жерар (Мастер-Эксперт)
Подписчиков / экспертов:20 / 15
Вопросов / ответов:3 / 6

Консультация # 80099: Уважаемые коллеги! Сейчас стало очень модным в подписи на форумах размещать линеечку. Мне очень хочется организовать такой сервис! Пожалуйста, помогите! 1. Не знаю, как сделать "обратный отсчет" ("До моего д/р осталось ХХ дней"), да и обычный тоже :( 2. Не знаю, как заставить ползунок передвигаться по линее...
Консультация # 138041: Здравствуйте. Вопрос связан с позиционированием средствами CSS. Вроде бы строгое определение HTML не предполагает использование таблиц для позиционирования элементов. Попробовал добиться того же эффекта, который даёт таблица, средствами CSS - ничего не вышло, более того сложилось впечатление, что это впринципе невозможно... Развейте мои...
Консультация # 57604: Здравствуйте, уважаемые эксперты. Подскажите, пожалйуста, с помощью какого тега можно блокировать(убирать) баннеры на своем сайте, если он расположен на бесплатной площадке Заранее спасибо...

Консультация # 80099:

Уважаемые коллеги!

Сейчас стало очень модным в подписи на форумах размещать линеечку. Мне очень хочется организовать такой сервис! Пожалуйста, помогите!

1. Не знаю, как сделать "обратный отсчет" ("До моего д/р осталось ХХ дней"), да и обычный тоже :(
2. Не знаю, как заставить ползунок передвигаться по линеечке...
3. Не знаю, как накладывать текст на картинки!

Если что - я напишу уточнения в мини-форум!
Пишите как можно конкретней! Сервис мне очень нужен!

Заранее огромное спасибо!

Дата отправки: 28.03.2007, 13:54
Вопрос задал: Angel7
Всего ответов: 2
Страница онлайн-консультации »


Консультирует The Shadow:

Здравствуйте, Angel7!
Есть спецсайты, которые занимаются созданием собственных линеек, нужно лишь указать тематику, число и тип отчтета. Один из этих сайтов - http://line.romanticcollection.ru/.
Удачи!

Консультировал: The Shadow
Дата отправки: 28.03.2007, 14:12
Рейтинг ответа:

НЕ одобряю 0 одобряю!


Консультирует Алексеенко С.Ю. (Бакалавр):

Здравствуйте, Angel7!
Есть спец ресурсы, линеечки отсчета
http://www.akusherstvo.ru/lines/
и юзербары
http://userbars.ru/
там есть готовые

Если же хотите реализовать сами, то
1 ну это в принципе не сложно, дату и тип отсчета храним в базе. При обращении к скрипты вычисляем сколько прошло/осталось времени и на сколько соответственно продвинуть ползунок.
2 А и не нужно его передвигать, при помощи библиотеки GD загружаем рисунки ползунка, линейки и рисуем где нужно, все это есть в справке.
3 пишем на ней.

Приложение:

Консультировал: Алексеенко С.Ю. (Бакалавр)
Дата отправки: 28.03.2007, 17:42
Рейтинг ответа:

НЕ одобряю 0 одобряю!

Консультация # 138041:

Здравствуйте.
Вопрос связан с позиционированием средствами CSS.
Вроде бы строгое определение HTML не предполагает использование таблиц для позиционирования элементов. Попробовал добиться того же эффекта, который даёт таблица, средствами CSS - ничего не вышло, более того сложилось впечатление, что это впринципе невозможно...
Развейте мои сомнения
Заранее спасибо.

Дата отправки: 27.05.2008, 11:12
Вопрос задал: Dicot
Всего ответов: 1
Страница онлайн-консультации »


Консультирует Web-Extrime:

Здравствуйте, Dicot!

        Страницы сайта можно писать с использованием табличной или блочной верстки.
        Не совсем понятно что именно вы хотите получить, но что касается позиционирования, то HTML-разметки в рабочей области браузера можно разместить с точностью до пикселя.
        Позиционирование и его программирование на JavaScript - это сплошное "минное поле" между основными браузерами. При просмотре этих страниц следует отдавать отчет, что для каждого браузера загружается своя страница описания свойств.
        До появления CSS-P единственным средством точного позиционирования были таблицы. Они позволяли точно расположить компоненты страницы относительно друг друга. CSS-P описание позволяет точно разместить элемент разметки не только относительно других компонентов, но и относительно границ страницы.
        Кроме этого CSS-P добавляет странице еще одно измерение - элементы разметки могут "наезжать" друг на друга. Исходный код этого примера будет выглядеть вот так:

<p style=""border-width:1px;" font-size:20px; position:relative; top:0px; left:0px; height:20px; color:white; background-color:#990000;">
Первый слой, на который наедем другим.
</p>
<div style=""border-width:1px;" position:relative; top:-55px; left:10px; background-color:#009900; padding:0px; font-size:20px; height:20px; color:#FFFFFF;">
Второй слой, который наезжает на первый.
</div>


        При этом можно менять порядок "наезда" - "перекладывать" слои.
        Термин "слой" вместо "блочный элемент разметки" используется здесь по той причине, что он лучше отражает эффект, который достигается за счет позиционировани.
        Стандарт CSS-P позволяет с точностью до пикселя разместить блочный элемент разметки в рабочем поле окна браузера. При таком подходе возникает вопрос, как устроена система координат, в которой автор страницы производит размещение компонентов страницы.
        CSS-P определяет две системы координат: относительную и абсолютную. Это позволяет обеспечить гибкость размещения элементов как относительно границ рабочего поля окна браузера, так и относительно друг друга.
        Блоки - это не абстрактные точки, которые не занимают на плоскости cтраницы места. Блоки - прямоугольники, которые "заметают" площадь. Текст и другие компоненты страницы под блоком перестают быть доступными пользователю, поэтому линейные размеры блока имеют для создания HTML-страниц не меньшее значение, чем координаты блока.
        При использовании "абсолютных" координат точка отсчета помещается в верхний левый угол окна браузера, а оси X и Y направлены вправо по горизонтали и вниз по вертикали.
        Если в этой системе координат некоторый блочный элемент должен быть размещен на 10px ниже верхнего обреза рабочей области браузера и на 20px правее правого края рабочей области браузера, то его описание будет выглядеть следующим образом:

.example { position:absolute; top:10px; left:20px; }

        В данной записи тип системы координат задан атрибутом position (значение - absolute), координата X задана атрибутом left (значение - 20px), Y задана атрибутом top (значение - 10px).
        Атрибуты top и left определяют координаты верхнего левого угла блока в абсолютной системе координат.
        Значения координат могут быть и отрицательными. Для того, чтобы убрать из отображаемой области блок с линейными размерами 100px (высота) на 200px (ширина) достаточно отпозиционировать его следующим образом:

.example { position:absolute; top:-100px; left:-200px; width:200px; height:100px; }

        Абсолютное позиционирование применяется тогда, когда либо все содержание страницы должно быть доступно без скроллинга, либо когда элементы разметки находятся в начале страницы и их взаимное размещение важно с точки зрения дизайна.
        Относительная координатная система позволяет разместить блоки на странице в координатах охватывающего их блока. Преимущества наличия такой координатной системы очевидны. Она позволяет сохранять взаимное расположение элементов разметки при любом размере окна браузера.
        В качестве точки отсчета в этой системе координат выбрана точка размещения текущего блока по умолчанию. Ось X при этом направлена горизонтально вправо, а ось Y - вертикально вниз.
        Для задания координат блока в этой системе применяют запись типа:

<div style=""border-width:1px;" border-style:solid; width:80%; height:100px;">
<div style=""xposition:relative;" top:0px; left:0px; border-width:1px;">
Этот блок находится в точке отсчета относительных координат
</div>
<div style=""xposition:relative;" top:0px; left:50px; border-width:1px;">
А этот блок смещен вправо на 50px
</div>
</div>


        Для работы с относительной системой координат лучше пользоваться универсальными блоками DIV. Это связано с тем, что в NN, например, параграф не может содержать параграфов. Любой блок немедленно закрывает параграф, следовательно, вложить в него что-либо нельзя.
        Следует отметить, что NN вообще непредсказуем в работе с относительными координатами, поэтому в нем их следует избегать.
        В относительной системе координат можно пользоваться отрицательными смещениями:

<div style=""xposition:relative;" top:0; left:50; border-width:1px; border-style:solid; width:200px;">
<a class=doc href="javascript:
if(flag==0)
{window.document.layers[2].left=-50;flag=1;}
else
{window.document.layers[2].left=50;flag=0;}; void(0);">
Сдвинуть слой
</a>
</div>


        В примере слой, первоначально сдвинутый на 50 пикселей вправо, после нажатия на гипертекстовую ссылку смещается на 100 пикселей влево, получая отрицательную величину смещения по оси X (left:-50px). После повторного нажатия положение восстанавливается.
        Линейные размеры блока задаются двумя параметрами: шириной (width) и высотой (height) блока. В браузерах ширина и высота блока интерпретируется по разному.
        В NN к примеру ширина и высота блока - это рекомендуемые параметры. Если текст выходит за эти ограничения, то блок увеличивается до необходимых размеров, если текста нет вообще, то блок сжимается до маленького квадрата:

<p style=""width:200px;" height:100px; background-color:#0000FF; color:#FFFFFF;">
..
</p>


Приведенного в примере описания должно хватить для получения результата, но в NN для такого блока нужно применить некоторые дополнительные атрибуты:

<p style=""width:200px;" height:100px; background-color:#0000FF; color:#FFFFFF; border-width:1px; border-color:#FFFFFF;">
<span style=""color:#FFFFFF;">"
..
</span>
</p>


        Без границы блок не будет залит синим цветом, а без span текст будет отображаться цветом умолчания для данной страницы. Никакому разумному объяснению такое поведение браузера не поддается :), поэтому не стоит на этих атрибутах строить дизайн страниц.
        Абсолютное и относительное позиционирование блоков позволяют придать странице третье измерение. Координаты блока, а точнее левого верхнего угла прямоугольника блока, и его линейные размеры определяют место положение блока на плоскости. Так как блок не является абстрактной точкой, то прямоугольники блоков перекрываются. Порядок наложения блоков определяется атрибутом z-index.
        При позиционировании блоков и их наложении друг на друга возникают видимые и невидимые области блоков. CSS позволяет произвольно управлять видимостью прямоугольной части блока. За это в спецификации CSS-P отвечает атрибут clip.
        Если быть более точным, то блоки - это прямоугольные карточки, которые лежат на поверхности, перекрывая друг друга. Расстояние между ними задать нельзя, т.е. полноценного третьего измерения нет.
        Порядок перекрытия блоков определяется атрибутом z-index. Чем больше значение z-index, тем ближе к наблюдателю находится слой.
        При работе с атрибутом следует иметь в виду, что NN и IE применяют разные модели описания. В IE - это просто числовой параметр, который закреплен за блоком. В NN изменение параметра z-index одного блока влиет на значения этого параметра у других.

<div>
<div name=first style=""xposition:relative;" top:0; left:0; width:300px; height:224px;">
<img src="image1.gif" border=1 width=300 height=224>
</div>
<div name=second style=""xposition:relative;" top:-160; left:80; width:300px; height:224px;">
<img src="image2.gif" border=1 width=300 height=224>
</div>
</div>


        Ну и наконец советую вам почитать интересную книгу по блочной верстке страниц сайта. Выложил специально для вас минут 10 назад. smile Загрузить (700 Кб.) сможете по этой ссылке.

        Успехов!

Консультировал: Web-Extrime
Дата отправки: 27.05.2008, 20:38
Рейтинг ответа:

НЕ одобряю 0 одобряю!

Консультация # 57604:

Здравствуйте, уважаемые эксперты.
Подскажите, пожалйуста, с помощью какого тега можно блокировать(убирать) баннеры на своем сайте, если он расположен на бесплатной площадке

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

Дата отправки: 03.10.2006, 18:20
Вопрос задал: Serj-Djo
Всего ответов: 3
Страница онлайн-консультации »


Консультирует Н.В.:

Здравствуйте, Serj-Djo!
Такого тега не существует и не может существовать!
Все хостеры по-разному внедряют свою рекламу: некоторые роботом добавляют в начало всех Ваших html-файлов код с баннером, причём делают это с такой переодичностью, что Вы замучаетесь обновлять страницы ради того, чтоб убрать баннеры. Другие ничего в Ваши файлы не добавляют, а используют собой разработанные методы. Третьи говорят Вам, какой код и куда надо добавить на Вашу страницу.
Но все бесплатные хостеры, размещающие рекламу на Вашем сайте, одинаковы в одном: если Вы каким-либо образом будете её блокирова, то Ваш аккаунт закроют. Обычно, это написано в соглашении при регистрации.
Удачи!

Консультировал: Н.В.
Дата отправки: 03.10.2006, 18:27
Рейтинг ответа:

НЕ одобряю 0 одобряю!


Консультирует Munster:

Здравствуйте, Serj-Djo!
Кстати, по данной теме, заметил на народе. Если в том месте, где выскакивает реклама поместить флешку, то реклама будет за флешкой.
пример: http://metod3.narod.ru/

Консультировал: Munster
Дата отправки: 03.10.2006, 18:32
Рейтинг ответа:

НЕ одобряю 0 одобряю!


Консультирует Москвин Роман Валерьевич:

Здравствуйте, Serj-Djo!
С помощью одного конкретного скрипта данное деяние выполнить нельзя.
Описание того, что и как нужно модифицировать Вы можете прочитать здесь
http://www.diwaxx.ru/web/java-narod.php
P.S. Помните, что после этого в любой момент Ваш сайт могут удалить....
Всего доброго!

Консультировал: Москвин Роман Валерьевич
Дата отправки: 03.10.2006, 21:24
Рейтинг ответа:

НЕ одобряю 0 одобряю!


Оценить выпуск | Задать вопрос экспертам

главная страница  |  стать участником  |  получить консультацию
техническая поддержка

Дорогой читатель!
Команда портала RFPRO.RU благодарит Вас за то, что Вы пользуетесь нашими услугами. Вы только что прочли очередной выпуск рассылки. Мы старались. Пожалуйста, оцените его. Если совет помог Вам, если Вам понравился ответ, Вы можете поблагодарить автора - для этого в каждом ответе есть специальные ссылки. Вы можете оставить отзыв о работе портале. Нам очень важно знать Ваше мнение. Вы можете поближе познакомиться с жизнью портала, посетив наш форум, почитав журнал, который издают наши эксперты. Если у Вас есть желание помочь людям, поделиться своими знаниями, Вы можете зарегистрироваться экспертом. Заходите - у нас интересно!
МЫ РАБОТАЕМ ДЛЯ ВАС!


В избранное