Node Expression Studio

Properties

Sizing

width:

height:

Padding

padding:

padding-left:

padding-top:

padding-right:

padding-bottom:

Margin

margin:

margin-left:

margin-top:

margin-right:

margin-bottom:

Border Radius

border-radius:

border-top-left-radius:

border-top-right-radius:

border-bottom-left-radius:

border-bottom-right-radius:

Borders

border:

border-left:

border-top:

border-right:

border-bottom:

Typography

font-family:

color:

font-size:

font-family:

font-weight:

Translate

translate-x:

translate-y:

translate-z:

Scale

scale-x:

scale-y:

scale-z:

Rotate

rotate-x:

rotate-y:

rotate-z:

```
<!DOCTYPE html>
```
Declares the document as HTML5.

Core Document Structure

These essential tags form the skeleton of every webpage

```
<!DOCTYPE html>
```
Declares the document as HTML5.
```
<html>
```
The root element that wraps all other content.
```
<head>
```
Contains metadata, titles, and links to CSS/scripts.
```
<title>
```
Sets the page name seen in browser tabs
```
<body>
```
Contains the visible content of the webpage.

Lists & Tables

Used to group related information clearly

```
<ul>
```
/
```
<ol>
```
Unordered (bulleted) or Ordered (numbered) lists.
```
<li>
```
Defines a specific item within a list.
```
<table>
```
Defines a data table.
```
<tr>
```
Defines a row in a table.
```
<td>
```
/
```
<th>
```
Defines a standard cell or a header cell..

Text Formatting & Headings

Use these to organize and style written content

```
<h1>
```
/
```
<h2>
```
/
```
<h3>
```
/
```
<h4>
```
/
```
<h5>
```
/
```
<h6>
```
Six levels of section headings (highest to lowest).
```
<p>
```
Defines a paragraph.
```
<br>
```
Inserts a single line break.
```
<hr>
```
Creates a thematic break (horizontal line).
```
<strong>
```
/
```
<b>
```
Defines important or bold text.
```
<em>
```
/
```
<i>
```
Defines emphasized or italic text.
```
<blockquote>
```
For sections quoted from another source.
```
<pre>
```
Displays preformatted text exactly as written.

Forms & User Input

Required for interactive elements and data collection

```
<form>
```
A container for user input fields.
```
<input>
```
The most common input control (text, checkbox, etc.).
```
<label>
```
A caption for an input element.
```
<button>
```
A clickable button.
```
<textarea>
```
Defines important or bold text.
```
<select>
```
/
```
<option>
```
Creates a dropdown selection list.

Links, Images & Multimedia

These tags embed external resources into your page

```
<a>
```
Creates a hyperlink using the href attribute.
```
<img>
```
Embeds an image (requires src and alt).
```
<video>
```
/
```
<audio>
```
Embeds media files for playback.
```
<iframe>
```
Embeds another HTML page within the current one.
```
<canvas>
```
Used for drawing graphics via scripting.

Semantic Layout

HTML5 introduced semantic elements to describe a page's layout more accurately than generic div

```
<header>
```
/
```
<footer>
```
Defines the top and bottom sections.
```
<nav>
```
Contains navigation links.
```
<main>
```
Specifies the primary content of the document.
```
<section>
```
/
```
<article>
```
Defines generic sections or independent articles.
```
<aside>
```
Content tangentially related to the main topic (sidebars).

Metadata & Scripting

Found within the head section to provide background instructions

```
<meta>
```
Provides character sets, keywords, or descriptions.
```
<link>
```
Connects to external files like CSS stylesheets.
```
<style>
```
Contains internal CSS styling.
```
<script>
```
Embeds or links to client-side JavaScript
```
<noscript>
```
Displays content if JavaScript is disabled.