Выводятся записи из рубрики «HTML»

CSS: какая разница между visibility:hidden и display:none?

Вопрос

И свойство visibility:hidden, и display:none скрывают отображение элемента на экране. Получается, что эти свойства работают идентично?

DIV с прозрачной картинкой не позволяет кликнуть по дочерним элементам, закрывая их

Вопрос

У меня на HTML-странице есть DIV с прозрачной фоновой картинкой, который позиционирован абсолютно, и он закрывает собою много всяких элементов, в том числе ссылок, кнопок и т.п.

Если я кликаю за пределами этого DIV, всё работает нормально. Но я никак не могу кликнуть по элементах, которые расположены за этим DIV. Получается, что он как бы замещает, или точнее сказать закрывает собою всё, что под ним (хотя он прозрачный и элементы видны).

Я хочу, чтобы появилась возможность кликать по них при любых обстоятельствах. Возможно ли сделать это, желательно кроссбраузерно?

Как сделать HTML-таблицу с фиксированными заголовками (закрепить их)?

Вопрос

Существует ли какой-нибудь кроссбраузерная CSS/JavaScript метод отобразить длинную HTML-таблицу, чтобы её заголовки оставались зафиксированными и не прокручивались вместе с телом таблицы?

Я бы хотел, чтобы посетитель мог выполнять прокрутку контекста в таблице, но при этом заголовки оставались всегда видны сверху, чтобы ему было легче ориентироваться.

Несколько фоновых изображений на CSS

Вопрос

Подскажите пожалуйста, возможно ли назначить одному элементу 2 фоновых изображения? Мне бы хотелось, чтобы одна картинка повторялась по горизонтали, а другая - через всю страницу и при этом была позади той, которая повторяется по-горизонтали.

Сейчас я делаю так: одну картинку назначаю фоновой для тега html, а другую для тега body.

html {
    background: url(images/bg.png);
}
body {
    background: url(images/bgtop.png) repeat-x;
}

Является ли такой подход правильным? Что, если я захочу 3 картинки? Возможно, есть метод получше?

Как запретить выделение текста на HTML-странице?

Вопрос

В моем проекте используются разные интерактивные элементы, которые являются кнопками, но сделаны на основе DIV-вов и т.п. Эти элементы выглядят не очень, когда текст в них выделен (это может случиться, если пользователь, к примеру, дважды кликнет по такой кнопке - поведение по умолчанию для большинства браузеров).

Я ищу какое-нибудь универсальное решение для запрета выделения текста, желательно конечно, чтобы использовались только CSS и HTML, однако если это не возможно, то пусть тогда будет JavaScript.

CSS: как убрать промежуток между двумя элементами inline-block?

Вопрос

Есть следующий HTML:

<div>
    <span class="in-line">Первый</span>
    <span class="in-line">Второй</span>
</div>

И этот CSS:

.in-line { 
    display:inline-block;
    width:100px;
}

Вот как это выглядит:

Пример
Первый
Второй

Я понимаю, почему это происходит, и что если я поставлю элементы в HTML в один ряд, то промежуток исчезнет:

<div>
    <span class="in-line">Первый</span><span class="in-line">Второй</span>
</div>

Но мне не очень удобно следить за HTML-разметкой и постоянно удалять эти отступы. Поэтому я надеюсь, что в CSS есть другое, более подходящее решение этой проблемы.

CSS: Поддержка скругления углов (“border-radius”) в IE

Вопрос

Как обстоят дела в IE с поддержкой CSS-атрибута "border-radius", отвечающего за скругление углов?

Как преобразовать таблицу Excel в HTML?

Вопрос

Мне нужно экспортировать таблицу из Microsoft Excel в HTML, сохранив при этом только данные из этой таблицы. Когда я делаю это через меню «Сохранить как», я получаю на выходе файл, в котором содержится куча всякого хлама, а сама таблица вместе и её ячейками сопровождается дополнительными атрибутами типа cellspacing, cellpadding, border, height и т.п.

Можно ли как-то конвертировать Excel в HTML без всего лишнего, только основные теги, стили я уже назначу сам?

HTML/CSS. Возможно ли позиционирование “float: bottom”?

Вопрос

Предположим, что есть следующий HTML:

<div id="container">
  <!-- Здесь другие элементы -->
  <div id="copyright">
    Copyright
  </div>
</div>

Я бы хотел сделать так, чтобы с id ‘copyright’ «прилипал» внизу контейнера div, можно ли этого добиться без использования абсолютного позиционирования? Если бы в свойства «float» была поддержка значения «bottom», это было бы то, что мне нужно. Но к сожалению, такого значения нет.

CSS. Word-wrap в таблице

Вопрос

Раньше я использовал word-wrap: break-word для переноса текста в DIV-ах и SPAN-ах, но похоже, что это не работает для ячеек таблицы. У меня таблица шириной 100%, в ней один ряд и 2 столбика. Хотя тексту в столбиках и назначено это свойство, он не переносится на новую строчку и выходит за пределы ячейки.

Есть какие-то предложения, как это исправить? Такое происходит в FF, Chrome и IE. Вот так выглядит исходник:

Оооооооооооооооооооочень длинное слово
Слово

Текст «ооооооооооооо...чень длинный», он даже длиннее, чем страница, но он не разрывается. Я пробовал задать text-wrap:suppress и text-wrap:normal, но это также не помогло.

Вперёд, в прошлое