Title: CSS Background in Headway
Last modified: August 22, 2016

---

# CSS Background in Headway

 *  [Joleen Cohen](https://wordpress.org/support/users/joleen-cohen/)
 * (@joleen-cohen)
 * [11 years, 9 months ago](https://wordpress.org/support/topic/css-background-in-headway/)
 * I am building a website using Headway and would like to interigate this code 
   as the background but am not sure how to go about it?
 * `<div class="stars"></div>`
 *     ```
       $stars: 250;         // Number of start per layer
       $depth: 300;         // Depth between star layers
       $speed: 30s;          // Number of seconds to transition between layers
       $width: 1500;        // Width of the starfield
       $height: 960;        // Height of the starfield
   
       html, body {
         height: 80%;
         overflow: hidden;
       }
       body {
         background-image: url('http://www.joleencohen.com/ruachdemo/wp-content/uploads/2014/08/desert-11.png');
         background-size:100%;
         perspective: 340px;
       }
       .stars {
         position: absolute;
         top: 50%;
         left: 50%;
         width: 2px;
         height: 2px;
         $box-shadow: ();
         @for $i from 0 through $stars {
           $box-shadow: $box-shadow, (random($width)-$width/2 + px) (random($height)-$height/2 + px) hsl(90,0,75+random(25));
         }
         box-shadow: $box-shadow;
         animation: fly $speed linear infinite;
         transform-style: preserve-3d;
   
         &:before, &:after {
           content: "";
           position: absolute;
           width: inherit;
           height: inherit;
           box-shadow: inherit;
         }
         &:before {
           transform: translateZ(-$depth + px);
           opacity: .6;
         }
         &:after {
           transform: translateZ(-$depth * 2 + px);
           opacity: .4;
   
         }
       }
   
       @keyframes fly {
         from {
           transform: translateZ(0px);
           opacity:.6;
         }
         to {
           transform: translateZ($depth + px);
           opacity:1;
         }
       }
       ```
   

Viewing 1 replies (of 1 total)

 *  Thread Starter [Joleen Cohen](https://wordpress.org/support/users/joleen-cohen/)
 * (@joleen-cohen)
 * [11 years, 9 months ago](https://wordpress.org/support/topic/css-background-in-headway/#post-5185902)
 * bump

Viewing 1 replies (of 1 total)

The topic ‘CSS Background in Headway’ is closed to new replies.

## Tags

 * [background](https://wordpress.org/support/topic-tag/background/)
 * [css](https://wordpress.org/support/topic-tag/css/)
 * [div](https://wordpress.org/support/topic-tag/div/)
 * [headway](https://wordpress.org/support/topic-tag/headway/)
 * [html](https://wordpress.org/support/topic-tag/html/)

 * 1 reply
 * 1 participant
 * Last reply from: [Joleen Cohen](https://wordpress.org/support/users/joleen-cohen/)
 * Last activity: [11 years, 9 months ago](https://wordpress.org/support/topic/css-background-in-headway/#post-5185902)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics
