UCSD CSE15L F22
This is a caption for the header image with link

Headers With Style

Header Image With Background Color

This is not the current offering of the course. You may want the next offering at https://ucsd-cse15l-w23.github.io/, or scroll down for the fall 2022 material.

Feeling Responsive allows you to use all kinds of headers. This example shows a header image with a defined background color via front matter.

It’s so easy to do. Just define in front matter an image and a background color. Instead of a color you can also use a pattern image. Have a look at the example with a background pattern.

Front Matter Code

WARNING: To make this work the value of background-color must be inbetween quotes.

header:
    image: "header_unsplash_2-970x.jpg"
    background-color: "#fabb00"
    caption: This is a caption for the header image with link
    caption_url: https://unsplash.com/

All Header-Styles

DESIGN
design background color header

Archive