CSS (Cascading Style Sheet) is one of the most popular programming languages used by Web Developers & Designers. It is widely used for designing web pages, providing properties to elements such as color, size, style, orientation, animation, and many more.
If you are new to Web development, it is essential to master a few basic commands to get started with website designing. This article will discuss some of the most commonly used commands you should master to use CSS in your website effectively.
CSS Command List:
color:
color: red;
background-color:
background-color: #fff;
font-family:
font-family: Arial, sans-serif;
font-size:
font-size: 16px;
text-align:
text-align: center;
line-height:
line-height: 1.5;
margin:
margin: 10px;
padding:
padding: 5px;
border:
border: 1px solid #000;
display:
display: block;
width:
width: 100%;
height:
height: 50px;
background-image:
background-image: url("image.jpg");
float: sets the position of an element relative to other elements, e.g.
float: left;
text-decoration: sets the appearance of text, e.g.
text-decoration: underline;
In addition to the basic commands mentioned above, there are also some advanced commands that can be useful for advanced Web Developers. These commands provide more control over various aspects of the website and allow you to perform complex tasks.
Advanced HTML Commands:
box-shadow:
box-shadow: 2px 2px 4px rgba(0,0,0,0.5);
text-shadow:
text-shadow: 1px 1px 1px #000;
border-radius:
border-radius: 10px;
transform:
transform: rotate(45deg);
transition:
transition: all 0.5s ease;
animation:
animation: myanimation 2s infinite;
background-size:
background-size: cover;
background-clip:
background-clip: padding-box;
backdrop-filter:
backdrop-filter: blur(5px);
column-count:
column-count: 3;
filter:
filter: grayscale(100%);
grid-template-columns:
grid-template-columns: repeat(3, 1fr);
justify-content:
justify-content: center;
align-items:
align-items: center;
perspective:
perspective: 100px;
If you found this blog post helpful, a clap would be really applicable, and follow for more technical content on Web Development.