CODEWITHSUNDEEP
pythonhtmlcssdjango
Luis Rodriguez
Luis Rodriguez

Reputation: 98

Changing css to a tag depending of the content inside it

I would like to know if there is a way in which using css i would be able to change the css properties, i was thinking if there is any way such as when working with input types, you indicate input[type='submit'] for example, and set your css for that specifical input, or the correct way of doing it.

HTML

  <td><div class="perform"><a href="{%url 'appointmentupdate' consult.id %}">{%if consult.Medicamento%}Modificar{%else%}Realizar{%endif%}</a></div></td>

This is the tag i want to apply this on. I would like to set some border above with some color, but specific for each word.

Upvotes: 0

Views: 534

Answers (3)

Fatemeh Azizkhani
Fatemeh Azizkhani

Reputation: 278

there are 3 ways to specify attributes for HTML tags in css first of them is to using tag name for example span {color:red;} second is to using a class name of your tags for example when your HTML is like this <span class='first-span'> then you can specify attributes for this tag like this .first-span{color:red;} you can have more that one tag with a same class name... third is to using Id of your tags when your HTML be like this <span id='first-span;> your css should be like this #first-span{color:red;}

Upvotes: 0

Daan Van de Voorde
Daan Van de Voorde

Reputation: 31

use javascript to check the value of that tag and change accordingly

Upvotes: 0

Yasiel Cabrera
Yasiel Cabrera

Reputation: 608

No exist any CSS selector to individual words, but you could wrap each word inside a span element with a CSS class (id or inline style) and give style individually. For example:

.a {
color: red;
}
.b {
color: red;
}

<span class="a">Hello</span> <span class="a">World</span>

This is a pure CSS solution but if you have a text with too many words probably a solution using JavaScript or a heavy logic in your templates will be needed

Upvotes: 1

Related Questions