1
0

HTML y CSS parte 1: mi primera página - 04

tag <img>
uso de archivo de estilo con selector de id '#'
This commit is contained in:
devfzn 2023-04-09 00:21:19 -04:00
parent 9a8266052a
commit ce78ad3209
Signed by: devfzn
GPG Key ID: E070ECF4A754FDB1
4 changed files with 101 additions and 4 deletions

View File

@ -10,4 +10,67 @@ Diferencias entre [html y css](https://www.aluracursos.com/blog/html-css-javascr
> en NeoVim `set ff=unix`
- Página [barbería](./index.html).
Página [barbería](./index.html).
Formas de aplicar estilo CSS:
- style inline.
```html
<h1 style="text-align: center;">Sobre la Barbería Alura</h1>
```
- style block con tag `<style>`.
```html
<style>
p {
text-align: center;
}
</style>
```
- style [file](./style.css).
##### Sistema hexadecimal
Sistema número que consta de las 6 primeras letras del alfabeto y los números
del 0 al 9.
```txt
0 1 2 3 4 5 6 7 8 9 A B C D E F
```
La combinación de estos 16 elementos permiten la representación de mas valores,
en menos caracteres, que por ejemplo, en un sistema binario. Es por esto que es
ampliamente utilizado en el mundo imformático.
La representación de los colores en 6 posiciones
```txt
0 0 0 0 0 0 <--- Mínimo
F F F F F F <--- Máximo
# _ _ _ _ _ _
r r g g b b
Negro -> #000000
Blanco -> #FFFFFF
```
```txt
0 = Mínimo
255 = Máximo
Negro -> rgb(0,0,0)
Blanco -> rgb(255,255,255)
```
##### Equipo de Front End
- Programador Front End
- Responsable por UX (user experiencie)
- Responsable por UI (user interface)
- Copywriter (Generador de Contenido)
- SEO (Search Engine Optimization)

Binary file not shown.

After

Width:  |  Height:  |  Size: 67 KiB

View File

@ -4,19 +4,24 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Barbería Alura</title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<h1 style="text-align: center;">Sobre la Barbería Alura</h1>
<img id="banner"
src="./banner/banner.jpg"
alt="barbería con dos sillas, fondo con dos espejos y muchos cuadros"/>
<h1>Sobre Barbería Alura</h1>
<p>Ubicada en el corazón de la ciudad, la <strong>Barbería Alura</strong> trae
para el mercado lo que hay de mejor para su cabello y barba. Fundada en 2020,
la Barbería Alura ya es destaque en la ciudad y conquista nuevos clientes
diariamente.</p>
<p style="font-size: 20px; text-align: center;"><em>Nuestra misión es: <strong>"Proporcionar autoestima y calidad de vida a
<p id="mision"><em>Nuestra misión es: <strong>"Proporcionar autoestima y calidad de vida a
nuestros clientes"</strong></em></p>
<p style="text-align: center;">Ofrecemos profesionales experimentados que están constantemente observando los
<p>Ofrecemos profesionales experimentados que están constantemente observando los
cambios y movimiento en el mundo de la moda, para así ofrecer a nuestros clientes
las últimas tendencias. El atendimiento posee un padrón de excelencia y agilidad,
garantizando calidad y satisfacción de nuestros clientes.</p>

View File

@ -0,0 +1,29 @@
body{
background-color: #1a1c1d;
}
#banner{
width: 100%;
}
p{
color: #FFFCC6;
text-align: center;
/*background: #fc9304;*/
/*background: #df28f6;*/
}
h1{
text-align: center;
background: #046dfc;
}
/* selección de diferentes selectores de stilo*/
em strong{
color: red;
}
/* selector de id */
#mision {
font-size: 20px;
}