Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В. PHP 5/6. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. C++. Мастер-класс в задачах и примерах. Авторы: Кузнецов М.В., Симдянов И.В. Объектно-ориентированное программирование на PHP. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: соприкосновение картинок и вставка текста на неё
 
 автор: atew   (30.01.2011 в 11:03)   письмо автору
 
 

1. как соединить две картинки в одну т.е. что бы они соприкасались
2. как вставить текст на картинку
желательно в примерах.....заранее спасибо!!

  Ответить  
 
 автор: elenaki   (30.01.2011 в 18:05)   письмо автору
 
   для: atew   (30.01.2011 в 11:03)
 

воспользуйтесь таблицами с нулевыми отступами. текст на картинку - просто слой поверх картинки. можно и картинки "склеить" без таблиц, одними слоями. но я бы таблицей сделала.


<div style="position: absolute; top: 150px; left: 0px; z-index: 100;">

<div style="float: left; width: 200px; height: 200px; border: #000 1px solid; cursor: pointer;"><img src="images/map.gif" width="200" height="200"></div>
<div style="float: left; background: url('images/postit.png') no-repeat; width: 200px; height: 200px; cursor: pointer; border: red 1px solid;">
<a href="#" style="text-decoration: none; width: 200px; height: 200px; display: block; text-decoration: none;" class="postit">text</a></div>
</div>

  Ответить  
 
 автор: Абырвалг   (30.01.2011 в 20:04)   письмо автору
 
   для: elenaki   (30.01.2011 в 18:05)
 

Интересно-то как:-)

Вот, спрашивается, зачем внутренние дивы нужны, аж целых два?
В принципе - зачем они нужны?

Вы разве не в курсе, что ВСЕ (абсолютно ВСЕ) свойства стиля, кои Вы перечислили для внутренних дивов, можно С ТЕМ ЖЕ УСПЕХОМ перечислить для стиля тегов <IMG>, кои Вы в эти дивы "запихнули"?
Или Вы принципиальный сторонник японских национальных игрушек дарума и кокэси, кои, будучи украденными, получили у нас название "матрёшка"?
Подарок, не упакованный в десять коробочек, одна другой больше - он уже не подарок? :-))

Кроме того, устанавливать родительскому тегу линейные размеры через стиль <div style="width: 200px; height: 200px">, а вложенному в него дочернему тегу те же линейные размеры - через атрибуты <img width="200" height="200"> - это как прибить к последней модели Мерседеса оглобли, запрячь в них лошадь и ездить по улицам, пугая граждан :-).

Если атрибут тега имеет ТОЧНОЕ СООТВЕТСТВИЕ в правилах стиля для этого тега, то следует использовать именно правило стиля - это Вам любой валидатор скажет.
Например, у тега <table> имеются атрибуты cellpadding и cellspacing.
Аналогичных свойств стиля у этого тега НЕТ.
Поэтому вполне правильным будет писать <table cellpadding="123" cellspacing="456">.
А вот имеющиеся у того же тега <TABLE> атрибуты width и height использовать НЕ НАДО, ибо у них имеются ТОЧНЫЕ аналоги в свойствах стиля. Сиречь
<table width="123" height="435%"> - неправильно, несовременно, глупо, затрудняет работу браузера.

Писать следует так - <table width="123" height="435%" style="width: 123px; height: 435%">

  Ответить  
 
 автор: mihdan   (31.01.2011 в 01:14)   письмо автору
 
   для: Абырвалг   (30.01.2011 в 20:04)
 

Если уж вы начали придираться, то скажу по секрету, что в современной спецификации html нет высоты (height), все задается при помощи margin, padding, border в стилях. А за написание инлайн стилей руки отрывать нужно - пожалейте людей, которые после вас эту кашу читать будут и что-то пытаться доработать.

У cellpadding есть аналог:


table td,
table th {
    padding: 10px;
}

  Ответить  
 
 автор: Абырвалг   (31.01.2011 в 05:05)   письмо автору
 
   для: mihdan   (31.01.2011 в 01:14)
 

>"скажу по секрету, что в современной спецификации html нет высоты (height), все задается при помощи margin, padding, border в стилях."

Во-первых, к действующей HTML4.01, к индексу атрибутов - http://www.w3.org/TR/1999/REC-html401-19991224/index/attributes.html - где этот "специалист" увидит, что height именно как атрибут вполне таки имеется.
Во-вторых, margin, padding, border - это таки свойства стиля, о которых пишется не в "спецификации html", а в спецификации CSS - и тоже, хотя бы разок в жизни к этой спецификации обратиться. Например, к действующей CSS2 - http://www.w3.org/TR/2008/REC-CSS2-20080411/visudet.html#propdef-height - height именно как свойство стиля вполне таки имеется. Спецификация CSS2 никак не требует обходиться только лишь отступами и бордером.
-----

>"за написание инлайн стилей руки отрывать нужно - пожалейте людей, которые после вас эту кашу читать будут и что-то пытаться доработать"

Речь в моём посте шла о том, что не следует использовать атрибуты, когда есть аналогичные свойства стиля.
А про способ применения стилей я ничего не писал.
И никогда писать не буду.
Ибо единого общего правила - писать правила стиля инлайн или обязательно "засовывать" стили в блок <style></style> или вообще создавать внешний подключаемый css-файл - вообще быть НЕ МОЖЕТ.
Все способы существуют. И все эти способы имеют право на жизнь.
Целесообразность применения того или иного способа зависит от объёма страницы, от объёма стилевых правил документа, от повторяемости стилей на разных страницах, от личных предпочтений автора и т.д. и т.п.
О создании комфортных условий для какого-то дебилоида, который его страницу украдёт и будет переделывать под себя, автору следует думать в самую последнюю очередь (или вовсе не думать!)
-----

>"У cellpadding есть аналог:
table td,
table th {
padding: 10px;
}
"


Предложенное мною выше средство актуально и здесь.

Я разве написал, что cellpadding вовсе нельзя повторить?
Нет. Я написал (цитирую себя): "Если атрибут тега имеет ТОЧНОЕ СООТВЕТСТВИЕ в правилах стиля для этого тега, то следует использовать именно правило стиля - это Вам любой валидатор скажет. Например, у тега <table> имеются атрибуты cellpadding и cellspacing. Аналогичных свойств стиля у этого тега НЕТ."
Предложенный аналог имеется у тега <table>?
Нет, при создании аналога использовался не тег <table>, а теги <td> и <th>.

[ХУЁВО поправлено модератором: "отрывать руки" - оставил, "отрывать голову" - зачистил. Чё, тупица, собственную голову жалко?]

  Ответить  
 
 автор: elenaki   (31.01.2011 в 10:05)   письмо автору
 
   для: Абырвалг   (30.01.2011 в 20:04)
 

кусок был вырван из кода, где наличие вложенных дивов требовалось

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования