border width, border style shorthand four values : border « CSS « HTML / CSS






border width, border style shorthand four values

   
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   <html>
        <head>
            <title></title>
            <style type='text/css'>
                p {
                    margin: 20px;
                    padding: 20px;
                    width: 200px;
                    border-width: thin medium 30px thick;
                    border-style: solid dashed double dotted;
                }
            </style>
        </head>
        <body>
      <p>
          I hear and I forget. I see and I remember. I do and I understand.
              - Confucius
      </p>
        </body>
    </html>

   
    
  








Related examples in the same category

1.'border' Example
2.border width, border style shorthand one value
3.border width, border style shorthand, three values
4.border width, border style shorthand two values
5.border: thin solid rgb(0, 0, 0)
6.border: 1em solid black
7.border: medium solid black
8.border: thin solid black
9.border: 1px solid rgb(0, 0, 0);
10.border: 1px solid crimson;
11.border: 1px solid gold;
12.border: 1px solid rgb(200, 200, 200);
13.Style sheet for border properties
14.border-color: red green purple blue; border-width: thin medium thick .25cm;
15.border overwrite
16.Use border-bottom to draw line
17.Dashed border
18.border: 1px dashed #8a795d;
19.Using image for border
20.Border page border
21.border: 1px solid green;
22.When no border-color is specified, the border color is the value of the color property.
23.border-style: solid dashed double inset;
24.Border with default color
25.border sets the size, pattern, and color of the border surrounding the padding.
26.border: thick solid black
27.Border shortcut setting
28.border shortcut property takes three space-delimited values that represent the border's width, style, and color.
29.border: 40px double black; creates a black, 40-pixel, double-line border.
30.Border with specific setting for four directions
31.This paragraph has a 1 pixel thick, solid black border around it.
32.Border direction
33.Set border to '3px dotted #33333;'
34.Body border: 50px #666 ridge
35.Add border for different columns together
36.Combined style
37.border:none is the default.
38.Border's width cannot be negative because they are inside the margin.
39.Use nested border
40.border property, can be used to specify border-width, border-style, and border-color for all four sides at once.
41.Border cascade