Entradas

Mostrando las entradas con la etiqueta ZenCoding

Ejemplo creando pagina con zen coding

En este ejemplo de programación crearemos una pagina web simple utilizando unos cuantos elementos que mostre en el transcurso de todos los ejemplos. aqui el codigo: html:5>div{Principal}>ul{nm $$}*3+article{article}>section{sec $$}*2>div{ingrese los datos $$}>form>label{nombre}>input:t>label{contra}>input:b>footer{foter}>iframe>video:src{https://www.youtube.com/watch?v=a3eG2evI9aU} ten en cuenta que esta pagina creada con el código no tiene tanto sentido solo la cree para mostrar lo largo que puede ser el codigo que puedes crear resumiendo todo, lo unico que tendrias que hacer es comprender bien el tema. Ejecutar Codigo: Page Zencoding Descargar Ejemplo: Page Zencoding Zen Coding Anterior                                                                   ...

Ejemplo creando form / formulario con zen coding

En este ejemplo crearemos un formulario con sus los elementos como ser los label, input y button con zen coding: ten en cuenta en escribir el codigo y presionar control + e para efectuar la accion. form: < form action="" >< / form > input: < input type="" / > input:t: < input type="text" name="" id="" / > input:b: < input type="button" value="" / > input:h: < input type="hidden" name="" / > label: < label for=""  > < / label > aqui un ejemplo utilizando los elementos mostrados anteriormente: html:5>form>label>input:t>br>label>input:b Nos da como reultado: < !DOCTYPE HTML>  < html lang="en-US"> < head > < meta charset="UTF-8" > < title >< / title > < / head > < body > < form action="" >< label for=...

Ejemplo mostrando imagenes y videos con zen coding

En este ejemplo crearemos url y mostraremos imagenes utilizand los elementos a, img, figure, iframe, video, hgroup, con zen coding: ten en cuenta en escribir el codigo y presionar control + e para efectuar la accion. a: < a href="" >< /a > img: < img src="" alt="" / > figure: < figure >< / figure > iframe: < iframe src="" frameborder="0" >< / iframe > video: < video src="" >< / video > hgroup: < hgr oup >< / hgr oup > aqui un ejemplo utilizando los elementos mostrados anteriormente: html:5>hgroup>a>img Nos da como reultado: < !DOCTYPE HTML > < html lang="en-US" > < head > < title >< / title > < / head > < body > < hgroup > < a href="" >< img src="" alt="" / >< / a >< / hgroup > < / body > < / ht...

Tutorial Zen Coding

Imagen
En este tutorial de programación mostrare el uso que puedes dar a Zen coding el cual es un conjunto de plug-ins para los editores de texto que permiten la codificación de alta velocidad y la edición en HTML , XML , XSL , y otros formatos de códigos estructurados a través de ayuda de contenido. Zen Coding nos trae atajos útiles como ser lo que ganas escribiendo la simple acción de div>ul>li Presionando control + e daría como resultado el escribir el siguiente código: <div> <ul> <li></li> </ul> </div> Si quieres entender mas sobre el uso de Zen Coding Aquí una lista de ejemplos básicos: Nota: los ejemplos son echos en notepad++ Ejemplos ZenCoding: Como Instalar Zen Coding en Notepad++ Ejemplo armando cuerpo de una pagina web con Zen Coding Armando contenido con zen coding Ejemplo Creando elementos de texto (p h hr br pre) con Zen Coding Ejemplo creando elementos de texto ( table ul li ol ) con Z...

Como Instalar Zen Coding en notepad++

Imagen
En esta ocasión mostrare como instalar el Zen Coding en notepad++, para lo cual solo necesitaras seguir los siguientes simples pasos: Abre el notepad++ Ve a plugins > Plugin Manager Ahí presionar Show Plugin Manager A continuación te aparecerán una lista de Plugins que puedes instalar entre los cuales deberás elegir  el Python script y el Zen coding para descargarlos e instalarlos. Una vez cierres y abras el notepad++ ya podrás ver y utilizar el zen coding: De manera manual por decirlo así  Abre el notepad++ Ve a plugins > Plugin Manager Ahí presionar Show Plugin Manager   A continuación te aparecerán una lista de Plugins que puedes instalar entre los cuales deberás elegir  el Python script para descargarlo e instalarlo.                                         Luego deberás descargar el Zen coding...

Ejemplo creando elementos de texto ( table ul li ol ) con Zen Coding

En este ejemplo crearemos una tabla junto con sus elemento ul li y ol utilizando el zen coding: ten en cuenta en escribir el código y presionar control + e para efectuar la acción. table: <table></table> ul: <ul></ul> li: <li></li> ol: <ol></ol> aqui un ejemplo agregando elementos de texto en pagina web: html:5>div>table>ul>li Nos da como resultado: <!DOCTYPE HTML> <html lang="en-US"> <head>                 <meta charset="UTF-8">                 <title></title> </head> <body>                 <div>              ...

Ejemplo Creando elementos de texto (p h hr br pre) con Zen Coding

Una pagina web tiene varios formatos de texto contenido, en este ejemplo mostrare como crear los siguientes elementos de texto con zen coding : ten en cuenta en escribir el codigo y presionar control + e para efectuar la acción. p: <p>p</p> h1: <h1>h1</h1> h2: <h2></h2> h3: <h3></h3> h4: <h4></h4> h5: <h5></h5> h6: <h6></h6> hr: <p>p</p> <hr /> br: <br /> pre: <pre></pre> aqui un ejemplo agregando elementos de texto en pagina web: html:5>div>+p+h3+hr+br+pre Nos da como resultado: <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div> <p></p> <h3></h3> <hr /> <br /> <pre></pre> </div...

Armando contenido con zen coding

Una página web puede estar divida por contenido , en este ejemplo Mostrare como crear los siguientes elementos con zen coding: ten en cuenta en escribir el código y presionar control + e para efectuar la acción. nav: <nav></nav> article: <article></article> aside: <aside></aside> section: <section></section> footer: <footer></footer> div: <div></div> aquí un ejemplo armando pagina web: html:5>nav+article>section>div+aside+footer>div Nos da como resultado: <!DOCTYPE HTML> <html lang="en-US"> <head>                 <meta charset="UTF-8">                 <title></title> </head> <body>         ...

Ejemplo armando cuerpo de una pagina web con Zen Coding

Utilizando las herramientas de zen conding podemos armar el cuerpo de una página web con solo ejecutar: html>body lo cual daría como resultado el <html>                 <body></body> </html> Parece simple pero entrándole mas tenemos diversas opciones de cuerpo posibles como ser: html:xml El cual da como resultado: <html xmlns="http://www.w3.org/1999/xhtml">                  <body></body> </html> html:4t El cual da como resultado: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en"> <head>                 <meta http-equiv="Content-Type" content="text/html;...

Principal

Imagen
Ejemplos de programación En esta pagina podrá encontrar muchos ejemplos de programación , en diversos lenguajes  desde los mas simples hasta unos que bueno... Entre otras cosas también hallara guías   de utilidad, descargas de los programas básicos y necesarios para programar en algún lenguaje,  interesantes cursos gratis que podrían tomar  y mucho mas. Aquí muestro la lista de los lenguajes de los cuales pueden encontrar ejemplos: Has click en el lenguaje que quieras ver. Android Studio C# SQL PHP MYSQL PYTHON JAVA JQUERY Javascript C++ vb.net Zen Coding emmet actionscript 3 Turbo Pascal Cursos Descargas Los ejemplos son un conjunto de  ejercicios y practicas  en los cuales se explica un poco de lo que ase básicamente "x" segmento del código.