CSS Properties: How to specify no left border?

Go to Exercise page

Solution:

HTML Code:

>!DOCTYPE html>>!-- Declaration of HTML5 document type -->
>html>
>head>
>title>How to specify no left border>/title>>!-- Title of the HTML document -->
>style>
/* CSS styling */
h1 {
  border-style: solid; /* Sets the border style for h1 elements to solid */
  border-width: 10px; /* Sets the border width for h1 elements to 10 pixels */
}
h1.none {border-left-style: none;} /* Defines a class for h1 elements with no left border */
>/style>
>/head>
>body>
>p>w3resource Tutorial>/p>>!-- Paragraph content -->
>h1 class="none">No left border>/h1>>!-- h1 element with no left border -->
>/body>
>/html>

Explanation:

• This HTML document demonstrates how to specify no left border for an h1 element.
• The h1 elements have a common style with a solid border and a width of 10 pixels.
• An additional CSS class named none is defined to remove the left border specifically.
• The h1 element with the class none is used to demonstrate the absence of a left border.

Live Demo:

See the Pen border-left-style-none-answer by w3resource (@w3resource) on CodePen.

See the solution in the browser

Supported browser

Yes	Yes	Yes	Yes	Yes

Go to Exercise page