HTML: How to correctly style a list of hyper links

user_486408 0
Viewed 43

I am new to HTML and so here is very basic question, for which unfortunately I could not find a hint any where . So I am putting it here. Basically, I have to use the tags href, and style both. How do I do it? For example, consider the following:

I have a list like this:

 <ul>
    <li style="color:blue;font-size:20px;text-align:justify">that is inclusive, innovative, and relevant</li>    
</ul>

Now I want to have a hyperlink on the text :

that is inclusive, innovative, and relevant

For example, clicking the above text should go to google.com

How do I do this?

hyperlink html
2 Answers

Here you go let me know the style is preperly applied or not.

 <ul>
    <li style="color:blue;font-size:20px;text-align:justify"><a href="#">that is inclusive, innovative, and relevant</a></li>    
</ul>
user_77709420

You need to use the anchor tag <a> and set the href property to your url. The display text can go inside the element.

<a href="https://www.google.com">Visit Google</a>

A list with two links:

<ul>
    <li style="color:blue;font-size:20px;text-align:justify">
        <a href="https://www.example.com">
            that is inclusive, innovative, and relevant
        </a>
    </li>    

    <li style="color:blue;font-size:20px;text-align:justify">
        <a href="https://www.w3.org/MarkUp/1995-archive/Elements/A.html">
            Anchor tag spec
        </a>
    </li> 
</ul>

Styles can be applied to the link or the list item. The browser does some default styling to anchor tags to make them blue and underlined, and purple after being visited. Often times this default styling is removed or overridden.

user_19437040
Related