Как применить стиль CSS при взятии ID?

Я новичок в кодировании HTML, и у меня есть следующий HTML-элемент:Как применить стиль CSS при взятии ID?

<div id="map_canvas" style="width: 500px; height: 370px; border: 1px solid #ccc; float: left"></div>

Я хочу подать заявление на это «левый» стиль CSS. Я делал это для других элементов с помощью:

<div id="left" > 
    <input type=button .... 
</div>

Однако, как вы можете видеть, map_canvas уже в id для моего элемента, так как я могу применить элемент CSS с идентификатором left для него?

источник

2012-01-01 sramij

Вы должны использовать 'class =" left "на элементе. На самом деле это классификация. –

Смотрите: http://jsfiddle.net/94dwn/ –

Кстати, вы никогда не должны использовать дубликаты идентификаторов. Идентификатор должен быть уникальным для всей DOM. В противном случае вы можете столкнуться со странными вещами, связанными с стилем и JavaScript. – Stephen

#map_canvas { 
    width: 500px; 
    height: 370px; 
    border: 1px solid #ccc; 
} 

.left { 
    float: left; 
    border: 1px solid blue; 
} 

<div class="left">Not #map_canvas</div> 
<div id="map_canvas" class="left">This is #map_canvas .left</div>

http://jsfiddle.net/94dwn/3/

Обратите внимание, что ширина элемента регламентировать-х это поплавок к следующему «линии», если элемент «следующий» не «очищается», так что если элемент является более узким на дисплее, чем ранее элемент float ed, он может перейти вправо/влево от этого элемента. В этом случае вы должны использовать clear.

<div class="left">Not #map_canvas</div> 
<div id="map_canvas" class="left">This is #map_canvas .left</div> 
<div class="cleared">Clear</div> 

#map_canvas { 
    width: 500px; 
    height: 370px; 
    border: 1px solid #ccc; 
} 
.left { 
    float: left; 
    border: 1px solid blue; 
} 
.cleared { 
    clear: both; 
    background: green; 
    border: 1px solid blue; 
    color: white; 
}

http://jsfiddle.net/94dwn/4/

источник

2012-01-01 00:55:26

Все идентификаторы должны быть уникальными. Используйте хэш в вашем CSS, чтобы применить стиль к уникальному элементу по идентификатору:

#unique { font-size: 200px; } 

<div id="unique">My Unique one of a kind element</div>

Если вы хотите применить стиль к нескольким элементам использовать классы:

.BoldRed { font-weight: bold; color: red; } 

<div class="BoldRed">This is important</div> 
<div class="BoldRed">So is this</div>

Вы также можете комбинировать классы:

.ReallyImportant { text-decoration: underline; } 

<div class="BoldRed ReallyImportant">This is the most important</div>

источник

2012-01-01 01:04:09

Как применить стиль CSS при взятии ID?

ответ

Смежные вопросы