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

RusFAQ.ru: Хитрости и секреты создания сайтов


Новое направление Портала RusFAQ.ru:
MosHoster.ru - Профессиональный хостинг

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

/ КОМПЬЮТЕРЫ И ПО / Интернет / Хитрости и секреты создания сайтов

Выпуск № 200
от 19.02.2008, 20:05

Администратор:Ерёмин А.А.
В рассылке:Подписчиков: 462, Экспертов: 49
В номере:Вопросов: 1, Ответов: 3

Нам важно Ваше мнение об этой рассылке.
Оценить этот выпуск рассылки >>


Вопрос № 123170: Здравствуйте! Вопросы: 1. Как сделать так, чтобы на странице одна текстовая ссылка отображалось одними цветами (не посещённая, посещённая, активная), а другая ссылка совершенно другими цветами? Я только знаю атрибуты vlink, alink и link у тег...

Вопрос № 123.170
Здравствуйте!
Вопросы:
1. Как сделать так, чтобы на странице одна текстовая ссылка отображалось одними цветами (не посещённая, посещённая, активная), а другая ссылка совершенно другими цветами? Я только знаю атрибуты vlink, alink и link у тега body, но они задаются для всего документа.
2. Как сделать так, чтобы текстовые ссылки не подчёркивались, в не зависимости от установок браузера пользователя?
3. Есть таблица в ней ещё две таблицы, а между этими двумя таблицами текст, как выровнять одну таблицу по левому краю и по верху, текст по центру, а вторую таблицу по правому краю и по низу?
Отправлен: 14.02.2008, 19:36
Вопрос задал: Kudryavyi (статус: 1-ый класс)
Всего ответов: 3
Мини-форум вопроса >>> (сообщений: 0)

Отвечает: Николай Владимирович / Н.В.
Здравствуйте, Kudryavyi!
2.
Средствами тегов HTML убрать подчеркивание у ссылок не представляется возможным. Поэтому для этой цели используются каскадные таблицы стилей (Cascading Style Sheets, CSS).

Одно из наиболее популярных применений CSS для ссылок — убирание у них подчеркивания. С позиции юзабилити не совсем верное решение, поскольку пользователь может сразу не догадаться, что текст, который он видит, является ссылкой. Все ведь уже привыкли — раз подчеркивание используется, значит это ссылка. Но при правильном применении отсутствие подчеркивания у ссылок может придать определенный эффект сайту. Часто делается, что при наведении курсора, ссылка становится подчеркнутой, меняет свой цвет, или используется и то и другое действие одновременно.

Подчеркивание прячется с помощью стилевого параметроа text-decoration: none, добавляя его к селектору A, как показано в примере 1.

Пример 1. Убирание подчеркивания у ссылки
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">
A {
text-decoration: none /* Убирает подчеркивание для ссылок */
}
A:hover {
text-decoration: underline; /* Добавляем подчеркивание при наведении курсора на ссылку */
color: red /* Ссылка красного цвета */
}
</style>
</head>
<body>
<a href="link.html">Наведи сюда курсор, увидишь результат</a>
</body>
</html>

(источник)


Удачи!
Ответ отправил: Николай Владимирович / Н.В. (статус: Профессионал)
Россия, Москва
WWW: nvsoft.org
ICQ: 420720
----
Ответ отправлен: 14.02.2008, 19:47

Отвечает: Web-Extrime
Здравствуйте, Kudryavyi!

Вот вам наглядный пример по вашим вопросам:

<HTML>
<HEAD>
<TITLE> </TITLE>

<STYLE type="text/css">
<!--
a:link { font-size:14px; text-decoration:none; color:#0000FF; }
a:active { font-size:14px; text-decoration:none; color:#FF0000; }
a:visited { font-size:14px; text-decoration:none; color:#CC00CC; }
a:hover { font-size:14px; text-decoration:none; color:#990000; }

#main_menu A:link { font-size:14px; text-decoration:none; color:#FF0000; }
#main_menu A:active { font-size:14px; text-decoration:none; color:#00FF00; }
#main_menu A:visited { font-size:14px; text-decoration:none; color:#0000FF; }
#main_menu A:hover { font-size:14px; text-decoration:none; color:#00FFFF; }
-->
</STYLE>

</HEAD>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" VLINK="#0099FF">

<A HREF="*.php">Ссылка</A><BR>
<A HREF="*.php">Ссылка</A><BR>
<A HREF="*.php">Ссылка</A><BR>
<A HREF="*.php">Ссылка</A><BR>
<A HREF="*.php">Ссылка</A><BR>

<SPAN ID="main_menu">
<A HREF="*.php">Ссылка</A><BR>
<A HREF="*.php">Ссылка</A><BR>
<A HREF="*.php">Ссылка</A><BR>
<A HREF="*.php">Ссылка</A><BR>
<A HREF="*.php">Ссылка</A><BR>
</SPAN>

<BR><BR>

<TABLE WIDTH="90%" BORDER="1" CELLSPACING="0" CELLPADDING="0">
<TR ALIGN="LEFT" VALIGN="TOP">
<TD WIDTH="30%" ALIGN="LEFT" VALIGN="TOP">

<TABLE WIDTH="50%" BORDER="1" CELLSPACING="0" CELLPADDING="0">
<TR ALIGN="LEFT" VALIGN="TOP">
<TD WIDTH="50%" ALIGN="LEFT" VALIGN="TOP">
Таблица 1 Выравниваем по правому верхнему краю.
</TD>
</TR>
</TABLE>

</TD>
<TD WIDTH="30%" ALIGN="CENTER" VALIGN="TOP">

Ваш текст Ваш текст Ваш текст Ваш текст Ваш текст
Ваш текст Ваш текст Ваш текст Ваш текст Ваш текст
Ваш текст Ваш текст Ваш текст Ваш текст Ваш текст
Ваш текст Ваш текст Ваш текст Ваш текст Ваш текст

</TD>
<TD WIDTH="30%" ALIGN="RIGHT" VALIGN="BOTTOM">

<TABLE WIDTH="50%" BORDER="1" CELLSPACING="0" CELLPADDING="0">
<TR ALIGN="LEFT" VALIGN="TOP">
<TD WIDTH="50%" ALIGN="LEFT" VALIGN="TOP">
Таблица 2 Выравниваем по нижнему левому краю.
</TD>
</TR>
</TABLE>

</TD>
</TABLE>

</BODY>
</HTML>


Удачи!

---------
Делай добро сам, и всегда помни что сделали для тебя!
Ответ отправил: Web-Extrime (статус: Практикант)
Ответ отправлен: 14.02.2008, 20:21

Отвечает: Стас Тельнов/[анти]КИЛЛЕР
Здравствуйте, Kudryavyi!
Ну мне остаётся разве что добавить более подробные комментарии к предыдущим ответам:
По 1-ому вопросу:
Вам эксперт Web-Extrime уже привёл хороший пример, могу только добавить, что:
а)
Можно написать в css файле что-то вроде
a.menu:link { font-size:14px; text-decoration:none; color:#FFFFFF; }
a.menu:active { font-size:14px; text-decoration:none; color:#FF0000; }
a.lnk:link { font-size:14px; text-decoration:none; color:#000000; }
a.lnk:active { font-size:14px; text-decoration:none; color:#0000FF; }

А в самом html коде
<a class="menu" href="str.html">к этой ссылке будет применятся только те стили, которые начинаются с "a.menu".</a>
<a class="lnk" href="str.html">к этой ссылке будет применятся только те стили, которые начинаются с "a.lnk".</a>

b)
Можно сделать тоже самое, но только не с "class" а с "id":
css файл:
# menu a:link { font-size:14px; text-decoration:none; color:#FFFFFF; }
# menu a:active { font-size:14px; text-decoration:none; color:#FF0000; }
# lnk a:link { font-size:14px; text-decoration:none; color:#000000; }
# lnk a:active { font-size:14px; text-decoration:none; color:#0000FF; }

А в самом html коде
<a id="menu" href="str.html">к этой ссылке будет применятся только те стили, которые начинаются с "# menu ".</a>
<a id ="lnk" href="str.html">к этой ссылке будет применятся только те стили, которые начинаются с "# lnk".</a>

Как видите, примеры отличаются не сильно, а только лишь способом выделения (через "class" или через "id"). Результат будет одинаковый.
Можно так же в css стилях прописать просто a:link, a:active, a:visited и т.д., без каких то дополнений - тогда они будут применятся ко всем остальным ссылкам, у которых не указан или указан не существующий "class" (или "id").
---------
Не стыдно не знать, стыдно не учиться
Ответ отправил: Стас Тельнов/[анти]КИЛЛЕР (статус: 5-ый класс)
Ответ отправлен: 14.02.2008, 20:57


Вы имеете возможность оценить этот выпуск рассылки.
Нам очень важно Ваше мнение!
Оценить этот выпуск рассылки >>

Отправить вопрос экспертам этой рассылки

Приложение (если необходимо):

* Код программы, выдержки из закона и т.п. дополнение к вопросу.
Эта информация будет отображена в аналогичном окне как есть.

Обратите внимание!
Вопрос будет отправлен всем экспертам данной рассылки!

Для того, чтобы отправить вопрос выбранным экспертам этой рассылки или
экспертам другой рассылки портала RusFAQ.ru, зайдите непосредственно на RusFAQ.ru.


Форма НЕ работает в почтовых программах The BAT! и MS Outlook (кроме версии 2003+)!
Чтобы отправить вопрос, откройте это письмо в браузере или зайдите на сайт RusFAQ.ru.


© 2001-2008, Портал RusFAQ.ru, Россия, Москва.
Авторское право: ООО "Мастер-Эксперт Про"
Техподдержка портала, тел.: +7 (926) 535-23-31
Хостинг: "Московский хостер"
Поддержка: "Московский дизайнер"
Авторские права | Реклама на портале
Версия системы: 4.70 от 17.01.2008
Яндекс Rambler's Top100
RusFAQ.ru | MosHoster.ru | MosDesigner.ru | RusIRC.ru
Kalashnikoff.ru | RadioLeader.ru | RusFUCK.ru

В избранное