add text border css code example

Example 1: how to make border for letters in css

h1 {
    /* 1 pixel black shadow to left, top, right and bottom */
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;

    font-family: sans; color: yellow;
}

Example 2: text border css

h1 {
  -webkit-text-stroke: 1px black;
}

Example 3: css text black outline

/* Written for h4 tag, modify as required */
.black-outline{
    -webkit-text-stroke: 1.11px black; /* stroke width and color */
    color: rgb(255, 255, 255);
    -webkit-font-smoothing: antialiased;
    font-weight: bold;
}

Example 4: css text border

h1 {
  color: white;
  text-shadow:
   -1px -1px 0 #000,  
    1px -1px 0 #000,
    -1px 1px 0 #000,
     1px 1px 0 #000;
}

Example 5: how to make border for letters in css

h1 {
    -webkit-text-stroke: 2px black; /* width and color */

    font-family: sans; color: yellow;
}

Example 6: how to make a text with a border in css

h1{
    width:30px;
    margin-top:-10px;
    margin-left:5px;
    background:white;
}

/* Change the values to achieve what design you want */

Tags:

Html Example