HTML Code:
<!DOCTYPE html><!-- Declaration of HTML5 document type -->
<html>
<head>
<title>How to specify the color of the border</title><!-- Title of the HTML document -->
<style>/* CSS style start*/
h1.solid {
border-style: solid; /* Setting border style to solid for elements with class "solid" */
border-width: 5px; /* Setting border width to 5 pixels for elements with class "solid" */
border-color: #CC63FF; /* Setting border color to #CC63FF (purple) for elements with class "solid" */
}
h1.dotted {
border-style: dotted; /* Setting border style to dotted for elements with class "dotted" */
border-width: medium; /* Setting border width to medium for elements with class "dotted" */
border-color: #CF633F; /* Setting border color to #CF633F (orange) for elements with class "dotted" */
}
h1.dashed {
border-style: dashed; /* Setting border style to dashed for elements with class "dashed" */
border-width: 5px; /* Setting border width to 5 pixels for elements with class "dashed" */
border-color: #DC63CF; /* Setting border color to #DC63CF (pink) for elements with class "dashed" */
}
</style>
</head>
<body>
<h1 class="solid">w3resource JavaScript Tutorial.</h1><!-- Heading with class "solid" -->
<h1 class="dotted">w3resource Python Tutorial</h1><!-- Heading with class "dotted" -->
<h1 class="dashed">w3resource Redis Tutorial.</h1><!-- Heading with class "dashed" -->
<p><b>Note:</b> The default value is medium none color.</p><!-- Note about default border values -->
</body>
</html>
Explanation:
Live Demo:
See the Pen border-color-answer by w3resource (@w3resource) on CodePen.
See the solution in the browser
Supported browser
What is the difficulty level of this exercise?
Test your Programming skills with w3resource's quiz.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4