CODEWITHSUNDEEP
javascripthtmlcss
Newbie
Newbie

Reputation: 2825

how can I make an arrow point upwards at the bottom of my header?

I am making a website. I have a header which has several tabs at bottom of which I want to add an arrow (looks like a small triangle) if I am current on the page corresponding to that tab.

| tab1 | tab2 | tab3 |

---^------------------------

<--Tab1 Content here -->

I don't want to use img to solve. Is there any way to do it by using css or javascript?

Thank you!

Upvotes: 1

Views: 497

Answers (3)

caochao
caochao

Reputation: 193

i thank you can use special symbol like "▲" and give it some css rules to make it match your needs. And you can also use pure css rules and a html element to solve it. please look my demo at http://wandouyouxi.com/cnblogs/css/untitled-1.html

Upvotes: 3

roberkules
roberkules

Reputation: 6605

Another possibility are HTML symbol entities:

Filled triangle pointing down          &#9660;  
Filled vertical triangle               &#9650;

Result: ▼ ▲

Then you could use CSS to (absolute) position the symbol (relative) to the header item.

Taken from http://llizard.etherwork.net/cwc/charactmap.html

Upvotes: 2

Sergio Tulentsev
Sergio Tulentsev

Reputation: 230346

No need for javascript, it's pure CSS.

http://css-tricks.com/snippets/css/css-triangle/

More examples and articles here.

Upvotes: 4

Related Questions