2017-02-05 2 views
0

Я пытаюсь использовать классы и/или идентификаторы стилей и другие элементы. Я использовал их успешно раньше, но на этой странице единственный идентификатор, который работает, предназначен для стилизации изображения. Однако, если я использую тег для абзаца, то стиль работает в CSS. Я хотел бы, чтобы id "# 1p" в CSS позволял мне стиль соответствующего абзаца. Сейчас этот идентификатор действует так, как будто его нет. Ниже мой код:Нельзя использовать классы или идентификаторы в CSS

 table { 
 
     position: absolute;top: 50px; 
 
     left: 225px; 
 
     width: 650px; 
 
     border: 10px solid black; 
 
     border-collapse: collapse; 
 
     padding: 5px;    
 
    } 
 
    th { 
 
    font-family: sans-serif; 
 
    font-size: 24px; 
 
    text-align: left; 
 
    color: #f2f2f2; 
 
    background-color: black; 
 
    }  
 
    .positionImage { 
 
       position: absolute; 
 
       top: 50px; 
 
       left: 140px; 
 
       border: 10px solid black; 
 
       } 
 
    h2 { 
 
    text-align: center; 
 
    position: absolute; 
 
    top: 160px; 
 
    left: 300px; 
 
    } 
 
    #1p { 
 
    position: absolute; 
 
    top: 200px; 
 
    left: 175px; 
 
    font-size: 18px; 
 
    } 
 
<img src="Pen_MLA.jpg" class="positionImage"> 
 
    <table> 
 
    <th colspan="2">The Writing Center at Bristol Community College</th> 
 
    <tr> 
 
     <td><b>Building B - Room 117</b></td> 
 
     <td><b><i>E-mail: [email protected]</i></b></td>  
 
    </tr> 
 
    <tr> 
 
     <td><b>508-678- 2811 X2544<b></td> 
 
     <td><b><i>Website: www.bristolcc.edu/writingcenter</i></b></td> 
 
    </tr> 
 
    </table> 
 
    <h2>Quoting and Citing Poetry (MLA)</h2> 
 

 
    <p id="1p">(Material is drawn from the <u>MLA Handbook for Writers of  
 
    Research Papers</u>, 6th Edition.)</p>

+0

ли Идентификаторы разрешено начать с номерами? Работает ли он, если вы измените первый символ идентификатора на букву? – Carcigenicate

+0

@JimCote Это неверно. https://www.w3.org/TR/html5/dom.html#the-id-attribute. См. Также http://stackoverflow.com/questions/70579/what-are-valid-values-for-the-id-attribute-in-html – j08691

+0

Вы правы, я цитировал сайт, который кажется неправильным. –

ответ

0

идентификаторы HTML не могут начинаться с цифр. Ваш сайт оформлен отлично, если вы используете p1, а не 1p.

Вы можете прочитать больше об этом, и возможный обходной путь (вы можете использовать [id='1p'] если вы действительно нужно) here.

+0

«HTML-идентификаторы не могут начинаться с цифр». Это было верно в HTML 4. [Новые правила] (https://www.w3.org/TR/html5/dom.html#the-id-attribute) говорят: значение должно быть уникальным среди всех идентификаторов в домашнем поддереве элемента и должно содержать хотя бы один символ. Значение не должно содержать пробелов. Нет никаких других ограничений на то, какую форму может принимать идентификатор; в частности, идентификаторы могут состоять только из цифр, начинаться с цифры, начинать с подчеркивания, состоять только из знаков препинания и т. д. – Quentin

+0

Действительно.Однако в Webkit/Blink (не уверен о Gecko/Trident), даже с использованием документа HTML5, используемого OP, стили ** не работают **, если идентификатор не начинается с числа. Многие вещи в спецификации не делают это в браузерах или требуют времени для поддержки, и это, по-видимому, является одним из них. Надеюсь, в один прекрасный день это больше не будет проблемой. – Toastrackenigma

+0

Вы вводите в заблуждение правила для атрибутов HTML с правилами для селекторов CSS. См. Мой ответ. – Quentin

1

CSS-ID selector состоит из:

"номер знака" (U + 0023, #) немедленно следует значение ID, который должен быть идентификаторы CSS.

identifier:

не может начинаться с цифры

Если вы хотите, чтобы представлять идентификатор, начиная с цифры, то вы должны либо:

  • использовать escape-последовательность: #\31p {}
  • использовать селектор атрибута (предупреждение: изменение специфичности): [id="1p"]
  • изменение HTML-ID
Смежные вопросы