Лана: другие произведения.

Оформление странички

Журнал "Самиздат": [Регистрация] [Найти] [Рейтинги] [Обсуждения] [Новинки] [Обзоры] [Помощь]
Peклaмa:
Конкурс фантастических романов "Утро. ХХII век"

Конкурсы романов на Author.Today
Женские Истории на ПродаМан
Рeклaмa
 Ваша оценка:
  • Аннотация:
    Добавляем картинку в аннотацию:

Как можно оформить свою страничку?

Фон и цвет шрифта.

Начнём с фона. Что здесь можно изменить? Разберём все изменения на примере моей странички. Здесь проводится замена самого фона (кроме двух участков со ссылками) заданием свойства background="адрес фона ", замена цвета текста text="#цифровой код ", и замена цвета ссылок:

link - цвет просто ссылки;
alink - цвет активной ссылки (нажатой);
vlink - цвет уже посещенной ссылки.

Все эти параметры прописываются внутри тега . На моей страничке (на текущий момент) этот тег имеет вид:

<body background="http://catsru.narod.ru/fons/sixtynin.jpg" link="#6F5B7B" vlink="#4F6949" alink="#AB1F5E" text="#4F6949">

Сформированный тег размещают в аннотации к "Сведения о разделе" и получают красиво не серую страничку.

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

 

Аватарка (фотография) .

На главную страничку вашего раздела можно поместить картинку, не превышающую 10 кБ. Что делать, если вам понравилась картинка большего объёма, например, с анимацией. Можно её разместить в сведениях об авторе, но тогда она не будет выводить посетителей в "информацию о владельце раздела". Для того, чтобы исправить эту неприятность, картинку надо оформить, как ссылку. Берёте адрес этой картинки (либо загрузив её предварительно на свою страничку, либо непосредственно с того сайта, где вы её нашли, например, http://veselble-kartinki.narod.ru/prividenija8.gif) и адрес странички, где у вас находится "информация о владельце раздела" (для примера, моя страничка: http://samlib.ru/s/sorrelx_a/about.shtml). И объединяете с помощью тегов в следующую конструкцию:

<a href=http://samlib.ru/editors/s/sorrelx_a/about.shtml><img src=http://veselble-kartinki.narod.ru/prividenija8.gif></a>

Дополнительно у меня используется тег <br> - позволяющий последующий текст, который вы захотите написать, начать с новой строки, ниже картинки. Остаётся только разместить всё это в "сведениях об авторе".

Как вставить картинку в аннотацию.

Выбираем картинку и копируем её адрес. Например, этот: http://liubavyshka.ru/_ph/19/2/636126127.gif.

Записываем конструкцию <img src=http://liubavyshka.ru/_ph/19/2/636126127.gif>

При желании можно добавить тег <br>, чтобы картинка встала с новой строки.

Загружаем полученную конструкцию в окошко "Аннотаци" и сохраням результат:

аннотация

Что получилось - видно в аннотации к этому файлу.

Как вставить на страничку ролик с Ютуба.

Разберём на примере этого ролика:
Копируем предлагаемый нам код HTML, переформируем его для наглядности:

<object width="640" height="385">
<param name="movie" value="http://www.youtube.com/v/13-7HlzFbjs&color1=0xb1b1b1&color2=0xd0d0d0&hl=ru_RU&feature=player_embedded&fs=1"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowScriptAccess" value="always"></param>
<embed src="http://www.youtube.com/v/13-7HlzFbjs&color1=0xb1b1b1&color2=0xd0d0d0&hl=ru_RU&feature=player_embedded&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="640" height="385"></embed>
</object>

Наша задача - избавится от тега <embed>, то есть убрать последние строки в общем коде. Для этого вносим внуть тега <object> элемент type="application/x-shockwave-flash", который ранее размещался внутри тега <embed>. И сюда же вписываем элемент data="http://www.youtube.com/v/13-7HlzFbjs" с адресом ролика (в примере оба элемента выделены красным, обратите внимание, поледний адрес берётся до символа &). Теперь удаляем весь код <embed> и получаем:

<object width="640" height="385" type="application/x-shockwave-flash"data="http://www.youtube.com/v/13-7HlzFbjs">
<param name="movie" value="http://www.youtube.com/v/13-7HlzFbjs&color1=0xb1b1b1&color2=0xd0d0d0&hl=ru_RU&feature=player_embedded&fs=1"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowScriptAccess" value="always"></param>
</object>

Результат:

Дополнительные украшательства.

Бегущая строка.

Бегущая строка в тексте документа является одним из легких способов оживить Web-страницу. Бегущие объекты всегда привлекают внимание, и пользователь обязательно прочтет что там написано. Так же бегущую строку можно применять, там где мало места. Но не следует злоупотреблять экономией места. Помните, что посетитель может просто не дождаться, когда в бегущей строке отобразится весь текст сообщения.

Бегущая строка создаётся с помощью контейнера тэгов <marquee>...</marquee> со следующими атрибутами:

  • width="..." - ширина бегущей строки в пикселях или процентах от ширины экрана.
  • height="..." - высота бегущей строки в пикселях или процентах. (Если вы делаете бегущую строку в одну строчку, то можно высоту не указывать, она сама подбирается под размер букв).
  • bgcolor="..." - определяет цвет фона бегущей строки.
  • behavior="..." задает тип движения (поведение) бегущей строки и имеет следующие значения:
    • scroll - циклическая прокрутка текста из одного конца в другой Бегущая строка
    • slide - текст появляется с одного края и останавливается у другого. Бегущая строка
    • alternate - текст перемещается от одного края к другому и обратно. Бегущая строка
  • direction="..." - определяет направление движения бегущей строки. Имеет следующие значения:
    • left - текст движется влево по строке Бегущая строка
    • right - текст движется вправо по строке Бегущая строка
    • up - вся строка перемещается снизу вверх Бегущая строка
    • down - строка движется сверху вниз Бегущая строка
  • scrollamount="..." - шаг перемещения в строке в пикселах, на который перемещается текст за заданный интервал времени. Например:
    Бегущая строка  - scrollamount="1"
    Бегущая строка  - scrollamount="2"
    Бегущая строка  - scrollamount="2"
  • scrolldelay="..." - Этот атрибут задаёт временной интервал между шагами бегущей строки в миллисекундах. Например:
    Бегущая строка  - scrolldelay="100"
    Бегущая строка  - scrolldelay="200"
    Бегущая строка  - scrolldelay="300"
  • loop="..." - задаёт число проходов текста бегущей строки. По умолчанию или при указании значения -1 (infinite) броузер будет прокручивать текст бесконечное число раз.
  • hspace="..." - Этот атрибут задает поле в пикселах справа и слева от бегущей строки.
    Бегущая строка  - hspace="10"
    Бегущая строка  - hspace="0"
  • vspace="..." - Этот атрибут задает отступ в пикселах выше и ниже бегущей строки.
    Бегущая строка  - hspace="0"
    Бегущая строка  - hspace="10"

Ниже приведен пример кода для бегущей строки размеро 50 пикселей в высоту и 250 пикселей в ширину. Определена бесконечная прокрутка текста, текст перемещается слева направо и имеет ярко-голубом фоне.

<marquee loop="infinite" behavior="altemate" 
        bgcolor="aqua" direction="right" height="50" width="250">
Пример берущей строки.
</marquee>

А так выглядит результат этого кода:
Пример берущей строки.


 Ваша оценка:

Популярное на LitNet.com Д.Деев "Я – другой 3"(ЛитРПГ) Д.Шерола "Черный Барон: Дети Подземелья"(Боевая фантастика) В.Василенко "Стальные псы 4: Белый тигр"(ЛитРПГ) М.Лунёва "Мигуми. По ту сторону Вселенной"(Любовное фэнтези) А.Дмитриев "Прокачаться до Живого"(ЛитРПГ) Е.Флат "Невеста из другого мира"(Любовное фэнтези) А.Эванс "Проданная дракону"(Любовное фэнтези) М.Атаманов "Искажающие реальность"(Боевая фантастика) С.Суббота "Наследница Драконов"(Любовное фэнтези) В.Старский ""Темный Мир" Трансформация 2"(Боевая фантастика)
Хиты на ProdaMan.ru Последняя Серенада. Нефелим (Антонова Лидия)Моя другая половина. Лолита МороПростить нельзя расстаться. Ирина ВагановаАномальная любовь. Елена ЗеленоглазаяКукла Его Высочества. Эвелина ТеньМенеджер олигарха и бессердечная я. Рита АгееваВедьма на пенсии. Каплуненко НаталияГорящая путевка, или Девяносто, помноженные на девяносто. Нина РосаВедьма из Ильмаса. КсенияВальпургиева ночь. Ксения Эшли
Связаться с программистом сайта.

Новые книги авторов СИ, вышедшие из печати:
С.Лыжина "Драконий пир" И.Котова "Королевская кровь.Расколотый мир" В.Неклюдов "Спираль Фибоначчи.Пилигримы спирали" В.Красников "Скиф" Н.Шумак, Т.Чернецкая "Шоколадное настроение"

Как попасть в этoт список
Сайт - "Художники" .. || .. Доска об'явлений "Книги"