KEMBAR78
HTML & Css Cheatsheet | PDF | Html | Software Engineering
Scribd
Upload
3 views4 pages

HTML & Css Cheatsheet

This document provides a comprehensive cheat sheet for HTML and CSS, detailing essential tags, attributes, and styling properties. It covers the structure of HTML documents, including elements like <html>, <head>, <body>, and various tags for content formatting. Additionally, it outlines CSS selectors and properties for styling, layout, and responsive design techniques.

Uploaded by

yusufkamil990
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
3 views4 pages

HTML & Css Cheatsheet

This document provides a comprehensive cheat sheet for HTML and CSS, detailing essential tags, attributes, and styling properties. It covers the structure of HTML documents, including elements like <html>, <head>, <body>, and various tags for content formatting. Additionally, it outlines CSS selectors and properties for styling, layout, and responsive design techniques.

Uploaded by

yusufkamil990
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

HTML Cheat Sheet

<!DOCTYPE> - Defines the document type and version of HTML.

<html> - Root element of an HTML document.

<head> - Container for metadata, scripts, styles, and title.

<title> - Sets the title of the HTML document (shown in browser tab).

<meta> - Defines metadata such as character encoding, description, keywords.

<link> - Defines the relationship between a document and an external resource

(used for stylesheets).

<style> - Contains internal CSS styles.

<script> - Defines client-side JavaScript.

<body> - Contains the contents of the HTML document.

<h1> to <h6> - Header tags defining headings, <h1> is the largest and <h6> the smallest.

<p> - Defines a paragraph.

<br> - Inserts a single line break.

<hr> - Inserts a horizontal rule.

<a> - Defines a hyperlink.

<img> - Embeds an image.

<ul> - Defines an unordered list.

<ol> - Defines an ordered list.

<li> - Defines a list item.

<div> - Defines a division or section.

<span> - Defines an inline section.

<table> - Defines a table.

<tr> - Defines a row in a table.

<th> - Defines a header cell in a table.

<td> - Defines a standard cell in a table.


<form> - Defines an HTML form for user input.

<input> - Defines an input control.

<textarea> - Defines a multiline input control.

<button> - Defines a clickable button.

<select> - Defines a drop-down list.

<option> - Defines an option in a drop-down list.

<iframe> - Defines an inline frame.

<strong> - Defines important text.

<em> - Defines emphasized text.

<blockquote> - Defines a section that is quoted from another source.

<code> - Defines a fragment of computer code.

<pre> - Defines preformatted text.

<nav> - Defines navigation links.

<header> - Defines a header for a document or section.

<footer> - Defines a footer for a document or section.

<main> - Specifies the main content of a document.

<section> - Defines a section in a document.

<article> - Defines an article.

<aside> - Defines content aside from the main content.

<details> - Defines additional details that the user can view or hide.

<summary> - Defines a visible heading for a <details> element.

<mark> - Defines marked/highlighted text.

<abbr> - Defines an abbreviation or acronym.

<cite> - Defines the title of a work.

<del> - Defines deleted text.

<ins> - Defines inserted text.


CSS Cheat Sheet

Selector - Used to select HTML elements to style (e.g., element, .class, #id).

Color - Defines text color (e.g., color: red;).

Background - Sets background color or image (e.g., background-color: #fff;

background-image: url('img.jpg');).

Font-family - Sets the font of the text (e.g., font-family: Arial, sans-serif;).

Font-size - Sets the size of the font (e.g., font-size: 16px;).

Font-weight - Sets the thickness of the font (e.g., font-weight: bold;).

Text-align - Aligns text (e.g., text-align: center;).

Text-decoration - Adds decoration like underline, overline (e.g., text-decoration:

none;).

Line-height - Sets space between lines of text.

Letter-spacing - Controls space between characters.

Margin - Sets the outer space of an element (e.g., margin: 10px;).

Padding - Sets the inner space of an element (e.g., padding: 10px;).

Border - Defines border size, style, and color (e.g., border: 1px solid

black;).

Display - Specifies layout behavior (e.g., block, inline, flex, grid).

Position - Specifies position type (e.g., static, relative, absolute, fixed,

sticky).

Top/Right/Bottom/Left - Offsets for positioned elements.

Z-index - Controls stack order of overlapping elements.

Width/Height - Sets width/height of elements.

Max-width/Max-height - Sets maximum width/height.

Min-width/Min-height - Sets minimum width/height.

Overflow - Controls overflow content (e.g., hidden, scroll, auto).


Float - Floats elements left or right.

Clear - Prevents floating elements from affecting layout.

Box-shadow - Adds shadow to elements.

Text-shadow - Adds shadow to text.

Opacity - Sets transparency level (0 to 1).

Cursor - Changes the mouse cursor on hover.

Transition - Animates changes over time.

Transform - Applies transformations like rotate, scale, translate.

Flexbox - Modern layout model for responsive design.

Grid - 2D layout system for building complex web layouts.

:hover - Pseudo-class for mouse-over state.

:first-child - Pseudo-class for first child element.

@media - Used for responsive design with media queries.

!important - Overrides other rules with lower specificity.

You might also like