Переопределить размер абзаца в CSS

У меня есть 2 абзаца в div, и мне нужно, чтобы один из них был 14px, а другой 16px. Я попытался поместить первый в класс, но он не принимает значение 14px ... В качестве резюме мне нужно «12 mei, 2014 | Sport», чтобы иметь размер 14px шрифта, а другой 16px.Переопределить размер абзаца в CSS

Вот мой код:

#kolom4 { 
 
    width: 1440px; 
 
    height: 718px; 
 
    background: #222222; 
 
} 
 
#kolom4 h2 { 
 
    margin-bottom: 40px; 
 
    padding-top: 29px; 
 
} 
 
#kolom4 p { 
 
    color: white; 
 
    font-size: 16px; 
 
} 
 
#kolom4 h3 { 
 
    color: #fdd400; 
 
    font-size: 20px; 
 
} 
 
.kolom4Date { 
 
    font-size: 14px; 
 
    color: white; 
 
} 
 
#section1 { 
 
    float: left; 
 
    text-align: left; 
 
    margin-left: 249px; 
 
    margin-bottom: 62px; 
 
} 
 
#text_img1 { 
 
    float: right; 
 
    width: 383px; 
 
    height: 220px; 
 
    margin-left: 20px; 
 
} 
 

 
#text_img1 a { 
 
    float: right; 
 
    text-decoration: none; 
 
    color: #fdd400; 
 
    font-style: oblique; 
 
}

<div id="kolom4"> 
 
      <h2>Nieuws</h2> 
 
      <div id="section1"> 
 
       <img src="images/kolom4Image1.jpg" /> 
 
       <div id="text_img1"> 
 
        <h3>Lorum ipsum</h3> 
 
        <p class="kolom4Date">12 mei, 2014 | Sport</p><br> 
 
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
 
        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Ut enim ad minim veniam [...]</p><br> 
 
        <a href="#">Lees meer ></a> 
 
       </div> 
 
      </div> 
 
     </div><!-- end kolom4 -->

источник

2014-11-19 Valeriu92

Я хочу задать вопрос, почему у вас есть идентификатор, называемый «kolumn4», который, очевидно, является итерацией для идентификатора, называемого «kolumn», что означает, что элемент не является элементом uniqe, что означает, что вы можете использовать классы вместо id. . there –

В моем проекте у меня также есть kolumn1, kolum2, ...., kolum7, и именно поэтому я использовал это обозначение ... это неправильно? – Valeriu92

Зависит от того, что такое «колунья». Если все элементы в основном одинаковы, и вам просто нужен знак подсчета меток, я бы использовал класс «kolumn» для базовых стилей и дополнительный класс «kolumn1» или «kolumn2» для конкретного стиля. Идентификаторы для UNIQUE элементов, что означает только 1 на страницу. –

Изменение:

.kolom4Date {

для:

#kolom4 .kolom4Date {

Теперь проблема заключается в том, что вы используете идентификаторы для стилизации, которые слишком специфичны, и вы столкнетесь с другими проблемами в долгосрочной перспективе. попробуйте использовать классы, и это станет намного проще.

источник

2014-11-19 21:50:56

Спасибо! Хм .. это проблема, которую я использовал во всех идентификаторах проекта? – Valeriu92

Ну, вы просто делаете это более сложным для себя, так как ID «весит» больше, чем другие селектор, так что вы, вероятно, обнаружите, что в конце концов вы получаете длинные селектора, такие как '# some-id .some-class # another-id p {} '. Занятия легче управлять, но просто продолжайте, всегда хорошо учиться! –

Ах, на мгновение я подумал, что мне нужно изменить все свои id на классы: D ... в следующий раз я буду использовать ваши советы, танки много! – Valeriu92

-1

Попробуйте это:

.kolom4Date { 
    font-size: 14px !important; 
    color: white; 
}

источник

2014-11-19 21:49:54 Bioto

Не делайте этого. ! Важный очень злой. Theres очень мало случаев, когда вам нужно это сделать. Я препятствую использованию! Важно в любой момент! –

Спасибо! Тем временем я также обнаружил, что # text_img1 .kolom3Date {font-size: 14px;} также работает – Valeriu92

Никогда не используйте! Important. Это становится настоящим беспорядком, когда вам приходится переоценивать вещи позже. Просто используйте CSS-каскад для настройки стиля. Предотвратите использование ID в целом, используйте классы, это более гибко. –

Вы переопределяете стиль шрифта: 16px из-за того, как вы нацеливаете элементы. Вместо того чтобы использовать

#kolom4 p{}

использование:

.kolom4p{ font-size: 16; }

затем добавить класс kolom4p к абзацу.

источник

2014-11-19 21:53:10 EricBellDesigns

Переопределить размер абзаца в CSS

ответ

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