A Google Chrome Extension to keep learning HTML and CSS
The extension shows a different HTML tag or CSS property every time you open a new tab. The tag or property comes with a description and an example to help you discover it.
- To generate implicit learning (i.e. unconscious learning without any effort, through simple repetitions).
- To arouse curiosity
- To consolidate knowledge
- To enhance life-long learning
- To encourage learn on a continuous basis
Get started by downloading the extension.
The extension was made for Google Chrome so please install it before you try to use it!
Open Google Chrome, go to chrome://extensions (or find it in your menu in More tools > Extensions), then activate the developer mode on the top right of the page and click on Load unpacked extension... and select the extension's folder.
Just open a new tab and enjoy.
You can extend the extension database by including properties or tags in the db.js file.
The structure followed is:
{
"reference": "https://developer.mozilla.org/es/docs/Web/HTML/Elemento/html",
"description": "El elemento HTML representa la raíz de un documento HTML. El resto de elementos descienden de él.",
"example": {
"show": false,
"title": "",
"description": "",
"code": "\n\nEstoy dentro del head del HTML\nEstoy dentro del body del HTML\n\n"
},
"language": "html",
"name": "<html>"
}
where
- reference is a link to a reference where more information about the element can be found.
- description is the element description/definition.
- example is the example container.
- show defines if the example output can be shown.
- title is the example code in CSS, for example top: auto;
- description is the explanation of the CSS example.
- code is the example code.
- language details the element language.
- name is the element's name.
Sabrina Izcovich Tomás Escobar
See also the list of contributors who participated in this project.
This project is licensed under the MIT License - see the LICENSE file for details