Scribd
Upload
17 views

Css Cheatsheet

CSS allows you to style and lay out web pages. There are three main ways to write CSS - inline styles, internal stylesheets within the <style> element, and external stylesheets linked via <link>. CSS uses selectors to target elements and properties to define styles like color, font, size, positioning and more. Common selectors include element names, classes, IDs, attributes, and pseudo-classes.

Uploaded by

Sugeng Riyanto
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
17 views

Css Cheatsheet

CSS allows you to style and lay out web pages. There are three main ways to write CSS - inline styles, internal stylesheets within the <style> element, and external stylesheets linked via <link>. CSS uses selectors to target elements and properties to define styles like color, font, size, positioning and more. Common selectors include element names, classes, IDs, attributes, and pseudo-classes.

Uploaded by

Sugeng Riyanto
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 1

<>

♥ iLoveCoding
CSS Cheatsheet
Comprehensive video course on HTML & CSS
https://ilovecoding.org/courses/htmlcss

1 Syntax to write CSS 3 Selectors and their syntax


Basic Selectors Combinators Pseudo Selectors
Selectors selectors {
The element(s) on which the style should be applied elementname selectorA + selectorB Adjacent sibling :active
....property: value;
.classname selectorA ~ selectorB General sibling :hover
Property and its value }
#idname parent > child Direct child :visited
This is the actual style to be applied to the element(s)
[attr=value] parent descendent Descendent :focus
*
2 3 places to write CSS 4 Common CSS properties (by group) margin

border
(A) Inline styles
TEXT: BACKGROUND: padding
<element style="property: value;"> color background
content
font background-attachment
(B) In the <style> element font-family background-color
font-size background-image
<head> font-weight background-position
....<style> letter-spacing background-repeat
........ selectors { property: value; } line-height
text-align DISPLAY: BOX: POSITION:
....</style>
text-decoration display border position
</head>
text-indent float border-color top
text-transform clear border-style bottom
(C) In a dedicated file (style.css)
vertical-align overflow border-width left
& refer that file via the <link> element
visibility height right
<head> LIST: margin z-index

....<link rel="stylesheet" list-style OTHER: padding


list-style-image cursor width
........ href="style.css" />
list-style-position box-sizing
</head>
< > iLoveCoding
list-style-type
♥

https://iLoveCoding.org

You might also like