Adding CSS styles in HTML page

CSS can be imported or included in 3 ways.
  • inline
    
    <html>
    <body style='color:red'>
    
    </body>
    </html>
    
  • internal - using style element
    
    <html>
    <head>
    <style>
    body {
      background-color: yellow;
    }
    </style>
    </head>
    </html>
    
  • external css file
    
    <html>
    <head>
    <link rel="stylesheet" href="softpost-styles.css">
    </head>
    </html>
    
  • You can also import one css into other using below syntax.
    
    @import "xyz.css" screen and (max-width: 768px); 
    
To override css style, you can use !important value.

If you are using .scss or .less files, you will need to use css preprocessors to convert them into css files. And then you can use css files in html pages.

Web development and Automation testing

solutions delivered!!