-
Notifications
You must be signed in to change notification settings - Fork 0
/
productosmujer.html
148 lines (140 loc) · 4.87 KB
/
productosmujer.html
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
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- <link rel="stylesheet" href="./estilos.css" /> -->
<title>LookGood</title>
</head>
<style>
body {
background: rgba(217, 171, 154, 0.83);
}
.uno {
position: absolute;
width: 1390px;
height: 100px;
left: 0px;
right: 0px;
top: 0%;
background: rgba(217, 171, 154, 0.83);
}
h1 { text-shadow: 2px 2px 4px #fff;
position: absolute;
width: 1340px;
height: 67px;
left: 39px;
top: 4px;
font-style: normal;
font-weight: normal;
font-size: 48px;
line-height: 4px;
text-align: center;
color: #40251b;
}
footer {
position: absolute;
width: 1390px;
height: 100px;
left: 0px;
right: 0px;
top: 854px;
background: rgba(217, 171, 154, 0.83);
}
.copy {
position: absolute;
left: 750px;text-shadow: 2px 2px 4px #fff;
}
.ft {
position: absolute;
width: 430px;
height: 320px;
left: 241px;
top: 201px;box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgb(0,0,0,0.6);
}
.bt {
position: relative;
height: 33px;
width: 171px;
left: 460px;
top: 544px;
}
.botonTratamiento {
background: rgba(217, 171, 154, 0.83);
border-radius: 25%;
cursor: pointer;
}
.botonTratamiento:hover{
background-color: #BF5656;
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24)
}
.fm {
position: absolute;
width: 430px;
height: 320px;
left: 744px;
top: 201px;box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgb(0,0,0,0.6);
}
.bm {
position: relative;
width: 213px;
height: 39px;
left: 863px; top: 544px;
}
.botonMaquillaje {
background: rgba(217, 171, 154, 0.83);
border-radius: 25%;
cursor:pointer
}
.botonMaquillaje:hover {
box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24);background-color:#BF5656 ;}
.parrafo {
position:relative;
Width:965px;
Height :118px;
Top:625px;
Left:241px;
}
</style>
<body>
<header class="uno">
<a href="../index.html">Inicio</a>
<a href="./productoshombre.html">Hombre</a>
<a href="../productosmujer.html">Mujer</a>
<a href="../contactar.html">Contactar</a>
<!-- banner -->
<h1>Cosméticos - GoodLook</h1>
</header>
<main>
<!-- foto tratamientos -->
<figure class="ft">
<picture>
<source srcset="./assets/img/tratamientos femenino.webp" type="image/webp"/>
<source srcset="./assets/img/tratamientos femenino.jpg" type="image/jpg"/>
<img src="./assets/img/tratamientos femenino.jpg" alt="tratamientos para mujer"/>
</picture>
</figure>
<a class="bt" href="http://www.productos.html.com" target="_blank"
><button class="botonTratamiento">Tratamientos</button></a>
<!-- foto maquillaje -->
<figure class="fm">
<picture>
<source srcset="./assets/img/maquillaje femenino" type="image/webp"/>
<source srcset="./assets/img/maquillaje femenino.jpg" type="image/jpg"/>
<img src="./assets/img/maquillaje femenino.jpg" alt="maquillaje"/>
</picture>
</figure>
<a class="bm" href="http://www.productos.html.com" target="_blank"
><button class="botonMaquillaje">Maquillaje</button></a>
<p class="parrafo">Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia vero aspernatur omnis corporis dignissimos aperiam ea! Magnam quidem dolores beatae esse, doloribus unde architecto, aliquam id voluptatibus sit fugiat non tenetur numquam cumque dolore dicta voluptatum cum, nesciunt perferendis tempore officia! Omnis sint laborum cum reprehenderit facere, placeat assumenda itaque aperiam maiores quaerat repudiandae quia. Eaque sit expedita, unde totam ullam cupiditate voluptatum officia tenetur eveniet neque in optio ab voluptates veritatis aliquid earum temporibus numquam dicta deserunt dolore officiis aperiam? Amet saepe natus vitae velit doloremque voluptates provident aliquid unde voluptatibus, rem sint at nisi explicabo beatae eius impedit ad adipisci tempora facere exercitationem dolore fugit? Quos facere vero, doloribus nobis, placeat tempora, deleniti quia voluptate ratione nemo reiciendis?</p>
</main>
<footer>
<h6 class="copy">© copyright 2021 - LookGood</h6>
<a>Visitanos en las redes:</a>
<a href="http://www.Facebook.com" target="_blank">Facebook</a>
<a href="http://www.YouTube.com"target="_blank">YouTube</a>
<a href="http://www.Instagram.com "target="_blank">Instagram</a>
</footer>
</body>
</html>