Headway Basis Standard Styles

Headway Base Default Styles

Headway Base bietet einige vorgefertigte Styles. Es ist hilfreich für Sie, wenn Sie sich bewusst machen, was sie sind und was sie können, wenn Sie sie verändern möchten, oder Sie im Design Mode vererben möchten. Sonst kann es vorkommen, dass Sie Style Veränderungen vornehmen, die nicht auf Ihrer Seite erscheinen, da sie von vorgefertigten Styles überschrieben wurden.

Elemente werden in dieser Liste aufgeführt und geordnet, je nach ihrem Erscheinen im Verzeichnisbaum im Design Mode.

Allgemeines Styling

Text

  • font-size: 14px
  • font-family: Palatino
  • line-height: 100%
  • color: #555555

Hyperlink

  • color: #555555

Block Title

  • font-size: 22px
  • line-height: 150%

Block Subtitle

  • font-size: 14px
  • font-styling: italic
  • color: #999

Structure

Blocks

Body

  • background-color: #dddddd

Wrapper

  • background-color: #ffffff
  • padding-top: 15px
  • padding-right: 15px
  • padding-bottom: 15px
  • padding-left: 15px
  • box-shadow-color: #c7c7c7
  • box-shadow-blur: 8px
  • box-shadow-horizontal-offset: 1px
  • box-shadow-vertical-offset: 1px
  • margin-top: 30px
  • margin-bottom: 30px

Blocks

Header Block

Site Title

  • color: #222222
  • font-size: 34px
  • line-height: 100%
  • text-decoration: none
  • margin-top: 20px
  • margin-right: 10px
  • margin-bottom: 0px
  • margin-left: 10px

Site Tagline

  • color: #999999
  • font-size: 15px
  • line-height: 120%
  • font-styling: italic
  • margin-top: 10px
  • margin-right: 10px
  • margin-bottom: 20px
  • margin-left: 10px

Navigation Block

  • border-top-width: 1px
  • border-bottom-width: 1px
  • border-left-width: 0px
  • border-right-width: 0px
  • border-color: #eeeee
  • border-style: solid
  • overflow: visible

Menu Item

  • text-decoration: none
  • color: #88888
  • capitalization: uppercase
  • padding-right: 15px
  • padding-left: 15px

Menu Item (State: Selected)

  • color: #22222

Menu Item (State: Hover)

  • color: #55555

Sub Menu Item

  • background-color: #eeeeee

Content Block

Entry Container

  • border-style: solid
  • border-top-width: 0px
  • border-bottom-width: 1px
  • border-left-width: 0px
  • border-right-width: 0px
  • border-color: #efefef
  • padding-bottom: 30px

Title

  • font-size: 24px
  • color: #333333
  • line-height: 130%

Archive Title

  • font-size: 24px
  • color: #555555
  • line-height: 110%
  • border-bottom-width: 1px
  • border-color: #eeeeee
  • border-style: solid
  • padding-bottom: 15px

Body Text

  • color: #555555
  • font-size: 14px
  • line-height: 180%

Meta

  • line-height: 120%
  • color: #818181

Heading (H1, H2, H3)

  • font-size: 20px
  • line-height: 180%

Sub Heading (H4, H5, H6)

  • font-size: 16px
  • line-height: 180%

Featured Image

  • border-top-width: 1px
  • border-right-width: 1px
  • border-bottom-width: 1px
  • border-left-width: 1px
  • border-color: #eeeeee
  • border-style: solid
  • padding-top: 3px
  • padding-right: 3px
  • padding-bottom: 3px
  • padding-left: 3px

Continue Reading Button

  • background-color: #eeeeee
  • text-decoration: none
  • border-top-left-radius: 4px
  • border-top-right-radius: 4px
  • border-bottom-right-radius: 4px
  • border-bottom-left-radius: 4px
  • padding-top: 2px
  • padding-right: 6px
  • padding-bottom: 2px
  • padding-left: 6px

Continue Reading Button (State: Hover)

  • background-color: #e7e7e7

Loop Navigation Button

  • background-color: #e1e1e1
  • text-decoration: none
  • border-top-left-radius: 4px
  • border-top-right-radius: 4px
  • border-bottom-right-radius: 4px
  • border-bottom-left-radius: 4px
  • padding-top: 4px
  • padding-right: 8px
  • padding-bottom: 4px
  • padding-left: 4px
  • line-height: 130%

Loop Navigation Button (State: Hover)

  • background-color: #d5d5d5

Comments Area Headings

  • color: #333333
  • font-size: 18px
  • line-height: 130%

Comment Container

  • padding-left: 64px

Comment Author

  • font-size:18px
  • line-height: 120%

Comment Meta

  • color: #888888
  • font-size: 14px

Comment Body

  • font-size: 14px
  • line-height: 170%

Comment Reply Link

  • font-size: 12px
  • background-color: #eeeeee
  • text-decoration: none
  • border-top-left-radius: 4px
  • border-top-right-radius: 4px
  • border-bottom-right-radius: 4px
  • border-bottom-left-radius: 4px
  • padding-top: 3px
  • padding-right: 6px
  • padding-bottom: 3px
  • padding-left: 6px

Comment Reply Link (State: Hover)

  • background-color: e7e7e7

Comment Form Input Label

  • font-size: 14px
  • line-height: 220%
  • color: #888888

Widget Area Block

  • line-height: 150%
  • padding-top: 5px
  • padding-right: 10px
  • padding-bottom: 5px
  • padding-left: 10px
  • margin-top: 15px

Widget Title

  • font-size: 13px
  • border-style: solid
  • border-top-width: 1px
  • border-bottom-width: 1px
  • border-left-width: 0px
  • border-right-width: 0px
  • border-color: #eeeee
  • letter-spacing: 1px
  • capitalization: uppercase
  • line-height: 250%
  • color: #111111
  • margin-bottom: 10px

Widget Links

  • color: #33333

Footer Block

  • border-top-width: 1px
  • border-right-width: 0px
  • border-bottom-width: 0px
  • border-left-width: 0px
  • border-color: #eeeeee
  • border-style: solid

Copyright

  • color: #666666

Headway Attribution

  • color: #666666

Administration Panel

  • color: #666666

Go to Top Link

  • color: #666666

Responsive Grid Toggle Link

  • color: #666666

Slider Block

Slider Container

  • overflow: visible
  • margin-bottom: 30px

Slider Viewport

  • overflow: hidden

Slider Caption

  • background-color: rgba(0,0,0,0.6)
  • color: #ffffff
  • font-size: 14px
  • line-height: 150%
  • padding-top: 20px
  • padding-right: 20px
  • padding-bottom: 20px
  • padding-left: 20px
  • position: absolute
  • text-align: center

Slider Paging

  • position: absolute
  • text-align: center

Slider Direction Nav Link

  • margin-top: -20px
  • position: absolute
  • background-image: headway_url() . ‚library/blocks/slider/assets/bg_direction_nav.png‘
  • background-repeat: no-repeat
  • background-position: left top

Slider Direction Next

  • background-position: right top

Slider Paging Link

  • background-color: rgba(0,0,0,0.5)
  • border-top-left-radius: 20px
  • border-top-right-radius: 20px
  • border-bottom-right-radius: 20px
  • border-bottom-left-radius: 20px
  • margin-left: 2px
  • margin-right: 2px

Slider Paging Link (State: Hover)

  • background-color: rgba(0,0,0,0.7)

Slider Paging Link (State: Active)

  • background-color: rgba(0,0,0,0.9)

This article was added for Headway version 3.6.2.

Last updated on February 21, 2014