Jump to content
Winter MEGA update e aici. Click pentru detalii. ×
Recrutăm moderatori, designeri audio şi video. Click aici
Recrutăm designeri grafici. Click aici pentru detalii
Vino și tu pe serverul nostru de rage multiplayer: v.b-zone.ro!

[HTML & CSS] Dropdown menu

TLG Andrei26

By TLG Andrei26,
in Web Development

 Share

Recommended Posts

TLG Andrei26 Rising Star

TLG Andrei26

Posted
Posted (edited)

- Aceasta este un cod pentru dropdown menu: 

<html>
	<head>
		<meta charset="UTF-8">
		<style>
			#button{
				background-color: #1e519d;
			    color: #ffffff;
			    padding: 15px;
			    border: 0;
			    width:100px;
			    font-weight: bold;
			}

			#dropdown{
				display: inline-block;
			}

			#dropdown:hover #content {
			    display: block;
			}

			#content{
			    display: none;
			    width:100px;
			    background-color: #2f6ac1;
			}

			#content a{
			    color: #FFFFFF;
			    padding: 15px;
			    text-decoration: none;
			    display: block;
			    font-family:Arial;
			    font-size:12px;
			    text-align:center;
			}

			#content a:hover{
				background-color: #28a2bd;
				font-weight: bold;
			}
		</style>
	</head>
	<body>
		<div id="dropdown">
		  <button id="button">Button</button>
		  <div id="content">
		    <a href="#">Tutorial 1</a>
		    <a href="#">Tutorial 2</a>
		  </div>
		</div>
	</body>
</html>

- In locul acelor "#" puteti pune link-uri catre diferite pagini.

- Butonul creat va arata cam asa:

 

bnpqeo2.png

 

- In momentul cand cursorul este pe buton, se va deschide acest meniu:

 

gXjkU8p.png

 

 

- Pentru orice intrebare/nelamurire ma puteti contacta printr-un PM.

Edited by TLG Andrei26
2
Link to comment
Share on other sites
Guest
This topic is now closed to further replies.
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.

  I accept