p {
color: red;
text-align: center;
}
id selector
#para1 {
text-align: center;
color: red;
}
class selector
.center {
text-align: center;
color: red;
}
universal selector
* {
text-align: center;
color: blue;
}
h1, h2, p {
text-align: center;
color: red;
}
External
<link rel="stylesheet" href="mystyle.css">
Internal
<style>
body {
background-color: linen;
}
h1 {
color: maroon;
margin-left: 40px;
}
</style>
Inline
<h1 style="color:blue;text-align:center;">This is a heading</h1>
Comments
/* This is a single-line comment */
Inline
<h1 style="color:Tomato;">Hello World</h1>
<p style="color:DodgerBlue;">Lorem ipsum...</p>
<p style="color:MediumSeaGreen;">Ut wisi enim...</p>
rgb(red, green, blue)
rgb(52, 175, 95)
Hexadecimal
#rrggbb
hsl(hue, saturation, lightness)
hsl(0, 25%, 58%)
Background
background-color
background-image
background-repeat
background-attachment
background-position
background (shorthand property)
Border
dotted - Defines a dotted border
dashed - Defines a dashed border
solid - Defines a solid border
double - Defines a double border
groove - Defines a 3D grooved border. The effect depends on the border-color value
ridge - Defines a 3D ridged border. The effect depends on the border-color value
inset - Defines a 3D inset border. The effect depends on the border-color value
outset - Defines a 3D outset border. The effect depends on the border-color value
none - Defines no border
hidden - Defines a hidden border
with
border-width: 5px 20px;
p {
border-style: dotted solid double dashed;
}
/* Three values */
p {
border-style: dotted solid double;
}
botton
border-bottom: 6px solid red;
border properties
border Sets all the border properties in one declaration
border-bottom Sets all the bottom border properties in one declaration
border-bottom-color Sets the color of the bottom border
border-bottom-style Sets the style of the bottom border
border-bottom-width Sets the width of the bottom border
border-color Sets the color of the four borders
border-left Sets all the left border properties in one declaration
border-left-color Sets the color of the left border
border-left-style Sets the style of the left border
border-left-width Sets the width of the left border
border-radius Sets all the four border-*-radius properties for rounded corners
border-right Sets all the right border properties in one declaration
border-right-color Sets the color of the right border
border-right-style Sets the style of the right border
border-right-width Sets the width of the right border
border-style Sets the style of the four borders
border-top Sets all the top border properties in one declaration
border-top-color Sets the color of the top border
border-top-style Sets the style of the top border
border-top-width Sets the width of the top border
border-width Sets the width of the four borders
margin
margin-top
margin-right
margin-bottom
margin-left
inherit
div {
width: 300px;
margin: auto ,inherit ;
border: 1px solid red;
}
W3Schools.com. (n.d.). https://www.w3schools.com/css/default.asp
%20(1).png)
