Как переопределить атрибуты дочерних элементов с родительскими атрибутами .class

Я разрабатываю приложение и имею некоторые проблемы с переопределением атрибута background-position. В приложении я добавляю класс font-size-big к элементу html, чтобы увеличить размер шрифта. Выполняя это, мое пользовательское положение подчеркивания изображения становится низким. Подчеркнутый текст теперь перемещается по тексту ссылки.Как переопределить атрибуты дочерних элементов с родительскими атрибутами .class

Что я хочу достичь, имеет разные background-position s для каждого класса шрифтов (размер шрифта, размер шрифта, размер шрифта, размер шрифта). Похоже, я не могу выбрать элемент a в зависимости от класса элементов html.

HTML:

<html class="font-size-big"> 
    <head></head> 
    <body class="article"> 
    <section class="links">From <a href="http://foo.bar">Steven</section> 
    </body> 
</html>

SCSS:

.font-size-big { 
    font-size: ($basic-fontsize * 1.2) + rem;; 
} 

.links { 
    color:$grey; 
    font: { 
    family:$fontTextItalic; 
    size: $basic-fontsize; 
    } 

    a { 
    color:$grey; 
    text-decoration: none; 
    background: url(/assets/images/article/dottedLinkUnderline_grey.png) repeat-x 0 23; 
    } 
}

Спасибо за ваше время. Я действительно застрял на этом.

источник

2014-01-29 stekhn

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

background-position: 0% 100%;

Устанавливает изображение в нижней части элемента. Если вы всегда хотите добавить 23px (который вы забыли указать для устройства), вы можете попробовать что-то вроде этого:

.links a 
{ 
    background-position:0 calc(100% + 23px); 
}

источник

2014-01-29 11:44:59

Большое спасибо, что сделал трюк. Я использовал «background-position: 0 1rem», который работает одинаково хорошо. – stekhn

Как переопределить атрибуты дочерних элементов с родительскими атрибутами .class

ответ

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