Stylesheets


Modifying the appearance of yBlog content
Modifying the appearance of yBlog content
Modifying the appearance of yBlog content
On this Page:
Stylesheet Design
Formatting Examples
Stylesheet Listings
(Click the images for a lightbox slideshow)

Stylesheet Design

Created: Nov 2020
Modified: 08/15/21
Beta .34: July 19, 2021

CSS-styled cascades include A, ARTICLE, ASIDE, B, BLOCKQUOTE, BODY, BR, CODE, DATA, DETAILS, DIV, DD, DL, DT, EM, H1, H2, H3, HEADER, HTML, I, IFRAME, IMG, LI, MAIN, NAV, OBJECT, OL, P, PRE, STRONG, SUB, SUMMARY, SUPER, TABLE, TD, TH, TR, TEXTAREA, U, UL, and ACTIVE/FOCUS/HOVER pseudoclasses.

The stylesheet is generated from a PHP file which sets the colors, box rounding, box shadows, and animations from the ./lib/config.phpvariables.

Formatting Examples

The above heading is an H2 heading (and appears in the on-page TOC). The following formatting examples are nested inside a BLOCKQUOTE element.

Paragraphs, Characters, and Lists

The above heading is a H3 heading. This is a Paragraph (<P>) Element. It may contain Bold (<B>), Italic (<I>), Bold Italic (<EM>), strong (<strong>), code (<CODE>), plus Subscript (<SUB>) and Superscript (<SUP>) character elements.

  • This is a first-order list, bulleted (starts with <UL><LI>).
    1. This is a second-order list, numbered (starts with <OL><LI>).
    2. All list items after 1st are preceded by </LI><LI>)
    3. This is the last item in the second-rder list (followed by </LI<OL>).
  • This is the end of unordered list (followed by </LI<UL>)

Tables

The above heading is a <H4> element.

This is the first row in a table inside a blockquote element, using the native TD font.

This is a paragraph iinside the second row inside a P element. If text is inside the paragraph element, it appears like other paragraphs. If text is directly inside a table cell, it doesn't break into paragraphs unless there is a <BR> element

This is the last row in a table

Stylesheet Listings

The defaults can be overriden for any page, but will still be used on the system 'Page not Found' Error page. The {BLUE, ROUNDED, SHADOWED, SNOW} template follows.

The :root values are applied to the shared stylesheet listed below it.