Skip to content

Instantly share code, notes, and snippets.

@vec07

vec07/index.html

Last active March 9, 2020 05:11
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save vec07/2c9daf39759f0c4bf2694269c8fcd96d to your computer and use it in GitHub Desktop.
Save vec07/2c9daf39759f0c4bf2694269c8fcd96d to your computer and use it in GitHub Desktop.
Download ZIP
Cheat Sheet
Raw
index.html
<!DOCTYPE html>
<html>
<link href="styles.css" type="text/css" rel="stylesheet">
<main>
<h1>CSS Cheat Sheet Borders</h1>
<table>
<thead>
<tr>
<th>Tag</th>
<th>Name</th>
<th>Description</th>
<tr>
</thead>
<tbody>
<!--Row 1-->
<tr>
<td>border-style</td>
<td>Border</td>
<td>property specifies what kind of border to display.</td>
</tr>
<!--Row 2-->
<tr>
<td>p.dotted {border-style: dotted;}</td>
<td>Dotted</td>
<td>Defines a dotted border</td>
</tr>
<!--Row 3-->
<tr>
<td>p.dashed {border-style: dashed;}</td>
<td>Dashed</td>
<td>Defines a dashed border</td>
</tr>
<!--Row 4-->
<tr>
<td>p.solid {border-style: solid;}</td>
<td>Solid</td>
<td>Defines a solid border</td>
</tr>
<!--Row 5-->
<tr>
<td>p.double {border-style:double;}</td>
<td>Double</td>
<td>Defines a double border</td>
</tr>
<!--Row 6-->
<tr>
<td>p.groove {border-style:groove;}</td>
<td>Groove</td>
<td>Defines a 3D grooved border. The effect depends on the border-color value</td>
</tr>
<!--Row 7-->
<tr>
<td>p.ridge {border-style: ridge;}</td>
<td>Ridge</td>
<td>Defines a 3D ridged border. The effect depends on the border-color value</td>
</tr>
<!--Row 8-->
<tr>
<td>p.inset {border-style: inset;}</td>
<td>Inset</td>
<td>Defines a 3D inset border. The effect depends on the border-color value</td>
</tr>
<!--Row 9-->
<tr>
<td>p.outset {border-style: outset;}</td>
<td>Outset</td>
<td>Defines a 3D outset border. The effect depends on the border-color value</td>
</tr>
<!--Row 10-->
<tr>
<td>p.none {border-style: none;}</td>
<td>None</td>
<td>Defines no border</td>
</tr>
<!--Row 11-->
<tr>
<td>p.hidden {border-style: hidden;}</td>
<td>Hidden</td>
<td>Defines a hidden border</td>
</tr>
</tbody>
</table>
</main>
</html>
Raw
styles.css
Body{
background-color:darksalmon;
color:hotpink;
}
h1{
color:Mediumvioletred;
font-family:monospace;
}
main {
font-family:monospace;
text-align: center;
padding: 5px 30px;
}
thead{
background:pink;
color:deeppink;
}
tbody{
background:bisque;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment