2016-09-02 2 views
-3

У меня есть ссылка в DIV:Как unstyle ссылки

<div class="parentStyle">Click me:<a>foo</a></div> 

Как сделать ссылку НЕ иметь какой-либо из его собственного стиля, так что она принимает вид родительского DIV?

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

Родительский стиль добавлен с помощью Javascript. Таким образом, родитель когда-то оформлен белыми буквами, а иногда и нет.

Мне нужна ссылка, чтобы иметь тот же вид, что и у родителя.

Вот как это выглядит, когда выбрано:

<div class="k-top k-top"><span class="k-in k-state-selected"> 
     <a class="au-target" au-target-id="222" href="#/entity-router/entityDetails/2"> 
      Item 1</a> 
    </span></div> 

Вот как это выглядит, когда он не выбран:

<div class="k-bot"><span class="k-in"> 
     <a class="au-target" au-target-id="234" href="#/entity-router/entityDetails/8">Item 2</a> 
    </span></div> 
+0

Стиль с '#parent a'? –

+0

Прошу прощения, я не понимаю вашего ответа. –

+0

Добавьте тот же стиль от родителя к тегу –

ответ

1

Вы не можете unstyle элемент, но вы можете применить стиль только тогда, когда один из родителей имеет определенный стиль, как это:

parentStyle a { 
    color: #fff; 
    background: blue; 
    /*etc.*/ 
} 

Этот стиль будет применяться только тогда, когда он является потомком элемента с класс 'parentStyle'

1

Используйте CSS

div#parent a{ 
    color: #fff; 
    text-decoration: none; 
    } 
0

Вы можете сделать это используя CSS.

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

<html> 
 
    <style> 
 
    #parent{ 
 
     background:blue; 
 
     } 
 
    #parent a{ 
 
     color:#fff; 
 
     text-decoration:none; 
 
     } 
 
    </style> 
 
    <body> 
 
    <div id="parent">Click me:<a href="http://stackoverflow.com/questions/39291385/how-to-unstyle-a-link">foo</a></div> 
 
    </body> 
 
    </html>

Надеется, что это поможет.

1

Вы также можете использовать это, чтобы ссылка не отличалась от текста родительского элемента.

a { 
 
    color: inherit; 
 
    text-decoration: inherit; 
 
    cursor: inherit; 
 
}
<p>Some normal text and a <a href="https://stackoverflow.com/">link</a>.</p>

PS: Вы, возможно, придется использовать несколько стилей в зависимости от CSS уже используется.