O'Reilly logo

Mastering Selenium WebDriver 3.0 by Mark Collin

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Working with hover menus

First of all, we need to create a basic HTML page. We are going to use some CSS to style the HTML into a CSS hover menu. To try and keep it in small, manageable chunks, we will break up the page into a couple of pieces. Let's start by writing the HTML:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>CSS Menu</title> 
    <style type="text/css">${TBC}</style> 
</head> 
<body> 
<ul> 
    <li id="home">Home</li> 
    <li id="about">About</li> 
    <li id="services"> 
        Services 
        <ul> 
            <li>Web Design</li> 
            <li>Web Development</li> 
            <li>Illustrations</li> 
        </ul> 
    </li> 
</ul> 
</body> 
</html> 

As you can see, it's just a very simple ordered list; you may have also noted that I have added a <style> tag, but I've not put anything in ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required