Borders_Respnisve Webpage Starting with ECLoc8521 Ch11 - 146_Borders_ResponsiveWebPage.html
I have a bit of problem following the explanation and code given by Castro. I shall proceed on my own to investigate various border styles from w3schools.
The
border-style property sets the style of an element's four borders. This property can have from one to four values.
Examples:
- border-style: dotted solid double dashed;
- top border is dotted
- right border is solid
- bottom border is double
- left border is dashed
- border-style: dotted solid double;
- top border is dotted
- right and left borders are solid
- bottom border is double
- border-style: dotted solid;
- top and bottom borders are dotted
- right and left borders are solid
- all four borders are dotted
Here I reproduce the code that gives the border styles below. I use <pre> and </pre>.
div.brd2 {
border-style: ridge solid dashed double;
border-color: darkgreen;
border-width: 15px;
margin-left: 60px;
width: 600px;
padding: 20px 50px 10px 50px;
background-color: lightblue;
}
Whan the class was part of the p tag, then the <em> tag did not inherit. Now the style is part of the em tag.
The
border-style property sets the style of an element's four borders. This property can have from one to four values.
Examples:
- border-style: dotted solid double dashed;
- top border is dotted
- right border is solid
- bottom border is double
- left border is dashed
- border-style: dotted solid double;
- top border is dotted
- right and left borders are solid
- bottom border is double
- border-style: dotted solid;
- top and bottom borders are dotted
- right and left borders are solid
- all four borders are dotted
CSS <div> properties are not shown in a single space. I shall try Position Property first in the next exercise 147_Positioning.html.
These exercises are not related to the Castro book I am learning from.