Skip to content

Instantly share code, notes, and snippets.

@agustinpfs
agustinpfs / imagenes.html
Last active June 26, 2020 22:47
HTML básico. Imágenes <img>.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Imágenes</title>
</head>
<body>
<img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" alt="logo google">
<br>
<img src="logo.png" alt="logo cursosIT"> <!-- la imagen está en la misma carpeta -->
@agustinpfs
agustinpfs / salto-linea.html
Last active June 19, 2020 23:13
HTML básico. Salto de linea <br>.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Salto de linea</title>
</head>
<body>
<h1>Salto de línea</h1>
<span>Lorem ipsum dolor sit amet.</span>
@agustinpfs
agustinpfs / secciones-basicas.html
Last active June 9, 2020 23:00
HTML básico. Secciones básicas - <span> y <div>
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Secciones básicas</title>
</head>
<body>
<h1>Secciones básicas - span y div</h1>
<span>define una sección del documento en línea.</span>
<span>define una sección del documento en línea.</span>
@agustinpfs
agustinpfs / listas.html
Last active June 19, 2020 22:43
HTML básico. Listas.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Listas</title>
</head>
<body>
<h1>Listas</h1>
<!-- Emmet: ul>li{Linea $}*5 -->
<ul>
@agustinpfs
agustinpfs / parrafos.html
Created June 9, 2020 22:13
HTML básico. Párrafos.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Párrafos</title>
</head>
<body>
<h1>Párrafos</h1>
<p>Esto es un párrafo</p>
<p>Esto es otro párrafo</p>
@agustinpfs
agustinpfs / encabezados.html
Last active June 19, 2020 21:58
HTML básico. Encabezados.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Encabezados</title>
</head>
<body>
<!-- Emmet: h${Encabezado h$}*3 -->
<h1>Encabezado h1</h1>
<h2>Encabezado h2</h2>
@agustinpfs
agustinpfs / estructura-basica.html
Last active July 6, 2020 11:09
Estructura básica HTML con etiquetas <h1> (encabezado nivel 1) y <p> (párrfo)
<!DOCTYPE html> <!-- define un documento HTML -->
<html> <!-- elemento raíz de una página HTML -->
<head> <!-- contiene meta información acerca del documento(*) -->
<meta charset="UTF-8"> <!-- especifica tipo de caracteres -->
<title>Título</title> <!-- especifica el título del documento -->
</head>
<body> <!-- contiene el contenido visible por el usuario -->
<h1>Encabezado</h1> <!-- define un encabezado -->
@agustinpfs
agustinpfs / reset.css
Last active June 30, 2020 11:55
Basic reset CSS
/* RESET - resetea los estilos por defecto del navegador */
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, img, small,
strong, center, ul, li, form, label, article, aside, figure, figcaption,
footer, header, menu, nav, section, audio, video, main {
box-sizing: border-box;
margin: 0;
padding: 0;
border: 0;
}
@agustinpfs
agustinpfs / box-model.html
Created May 30, 2020 01:45
Box Model CSS
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>box-model</title>
<style>
.box1 {
background-color: plum;
margin: 10px;
@agustinpfs
agustinpfs / bem-example.html
Last active June 29, 2020 15:01
Ejemplo BEM
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.articulo {
background-color: blue;
height: 200px;