menudesplegable/index.html at master · lenrmatterano/menudesplegable · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<!DOCTYPE html>
<html lang="es">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
	<meta name="description" content="Como Hacer un Menu con Submenu desplegable con HTML Y CSS">
	<meta name="robots" content="index, folllow">
	<meta name="author" content="Lennys Rojas">
	<title>Menu Desplegable</title>
	<link rel="shorcut icon" type="image/x-icon" href="icons/favicon.ico">
	<link rel="stylesheet" type="text/css" href="style.css">
	<link rel="stylesheet" href="tablet.css" media="(min-width:600px)">
				<!-- 	OPEN GRAPH -->
	<meta property="og:title" content="Menu con Submenu Desplegable realizado con HTML Y CSS" />
	<meta property="og:type" content="website" />
	<meta property="og:url" content="https://lenrmatterano.github.io/menudesplegable//" />
	<meta property="og:image" content="https://lenrmatterano.github.io/menudesplegable/icons/lenlogo.png" />
	<meta property="og:description"
  	content="Menu Con submenu, realizado con HTML y CSS" />
	<script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
</head>
<body>
	<header>
		<nav>
			<ul>
				<li><a href="#">Inicio</a></li>
				<li><a href="#">Sobre Mi</a></li>
				<li>
					<a href="">Proyectos</a>

					<ul  class="submenu">
						<li>
							<a class="padding"  href="">Portafolio Dra Ana</a>
						</li>

					<details>
						<summary>
							Libros/Javascript
						</summary>
					<ul  class="submenu">
						<li>
							<a class="padding" href="">Up & Going</a>
						</li>

						<li>
							<a class="padding"  href="">Scope & Closures</a>
						</li>

						<li>
							<a class="padding"  href="">This & Object Prototypes</a>
						</li>

						<li>
							<a class="padding"  href="">Types & Grammar</a>
						</li>

						<li>
							<a class="padding"  href="">Async & Performance</a>
						</li>

						<li>
							<a class="padding"  href="">ES6 & Beyond</a>
						</li>
			 		</ul>
					</details>

					<li>
						<a href="">Blog de Poemas</a>
					</li>

					<details>
						<summary>
							Salvatore Gamer
						</summary>
							<ul  class="submenu">
								<li>
									<a class="padding"  href="">Call of Duty</a>
								</li>

								<li>
									<a class="padding"  href="">GardenScapes</a>
								</li>

								<li>
									<a class="padding"  href="">Boom Beach</a>
								</li>

								<li>
									<a class="padding"  href="">Outlast</a>
								</li>

								<li>
									<a class="padding"  href="">Tomb Raider</a>
								</li>
					 		</ul>
					</details>

					<li>
						<a href="">Barberia Piedra</a>
					</li>

				</li>
					</ul>
				<li><a href="#">Blog</a></li>
			</ul>
		</nav>
	</header>
	<main>
		<section>
			<h1>Menu con un Submenu Desplegable </h1>
			<p> Creado con HTML y CSS Con un Media Queries a los 600px, Adaptable a dispositivos Moviles.</p>
		</section>
	</main>
	<footer>
		<p>© Lennys Rojas 2021</p>

		<div>
			<a href="http://www.twitter.com/lenrmatterano" target="_blank"> <img src="icons/twitter.png"></a>
			<a href="https://www.linkedin.com/in/lennys-rojas-75591818a/" target="_blank"><img src="icons/linkedin.png"></a>
			<a href="https://github.com/lenrmatterano" target="_blank"><img src="icons/github.png"></a>
		</div>
		<img class="imgfooter" src="icons/lenlogo.png">
	</footer>
</body>
</html>