-
-
Save ollytheninja/8498790 to your computer and use it in GitHub Desktop.
Markdown css
Just add <link href="style.css" rel="stylesheet"></link> to the start of your markdown document.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
* { margin: 0; padding: 0; } | |
abbr,acronym,blockquote,code,dir,kbd,listing,plaintext,q,samp,tt,var,xmp { hyphens: none; } | |
html { | |
padding: 2em; | |
font: normal 18px/1.25 Source Sans Pro, sans-serif; | |
color: #000; | |
hyphens: auto; | |
word-wrap: break-word; | |
background: #fff; | |
} | |
body > :first-child { | |
margin-top: 0; | |
} | |
/* @group Headings */ | |
h1,h2,h3,h4,h5,h6 { | |
line-height: 1; | |
margin: 0; | |
margin-top: 1.5rem; | |
text-rendering: optimizeLegibility; | |
} | |
h1 { font-size: 2.75rem; } | |
h2 { font-size: 2rem; } | |
h3 { font-size: 1.65rem; } | |
h4 { font-size: 1.25rem; } | |
h5 { font-size: 1.1rem; } | |
h6 { font-size: 1rem; } | |
h2 em, h3 em{ | |
color:grey; | |
} | |
/* @end */ | |
small { | |
font-size: 65%; | |
} | |
p { | |
margin-top: .75rem; | |
} | |
hr { | |
margin: .75rem 0; | |
opacity: .5; | |
} | |
ol,ul { | |
margin-top: .75rem; | |
} | |
ol ul, ol ol, ul ul, ul ol { | |
margin-left: 2rem; | |
margin-bottom: .75rem; | |
} | |
li { | |
margin: .5em 0; | |
} | |
abbr { | |
font-variant: small-caps; | |
font-weight: 600; | |
text-transform: lowercase; | |
color: #808080; | |
} | |
abbr[title]:hover { | |
cursor: help; | |
} | |
/* @group Block Quotes */ | |
blockquote { | |
border-left: 5px solid #333; | |
padding-left: .75em; | |
margin-left: calc(-.75em - 5px); | |
font-style: italic; | |
} | |
blockquote + figcaption { | |
display: block; | |
margin-top: -1.5rem; | |
margin-bottom: 1.5rem; | |
font-size: 75%; | |
text-align: right; | |
} | |
blockquote + figcaption:before { | |
content: "— "; | |
opacity: .05; | |
} | |
/* @end */ | |
/* @group Pre-formatted and Code */ | |
pre { | |
overflow: auto; | |
margin: .75rem 0; | |
padding: .5rem; | |
font-size: .875em; | |
white-space: pre; | |
background-color: #f8f8f8; | |
border: 1px solid #ccc; | |
border-radius: 3px; | |
} | |
code { | |
padding: 0 .25em; | |
white-space: pre; | |
font-family: Source Code Pro, monospace; | |
background-color: #f8f8f8; | |
border: 1px solid #ccc; | |
border-radius: 3px; | |
} | |
pre code { | |
padding: 0; | |
word-wrap: normal; | |
white-space: pre-wrap; | |
} | |
pre code, pre tt { | |
background-color: transparent; | |
border: none; | |
} | |
/* @end */ | |
/* @group Tables */ | |
table { | |
margin: .75rem 0; | |
padding: 0; | |
border-collapse: collapse; | |
} | |
table tr { | |
margin: 0; | |
padding: 0; | |
border-top: 1px solid #ccc; | |
background-color: #fff; | |
} | |
table tr:nth-child(2n) { | |
background-color: #f8f8f8; | |
} | |
table tr th { | |
margin: 0; | |
padding: .35em .75em; | |
font-weight: bold; | |
text-align: left; | |
border: 1px solid #ccc; | |
} | |
table tr td { | |
margin: 0; | |
padding: .35em .75em; | |
text-align: left; | |
border: 1px solid #ccc; | |
} | |
table tr th :first-child, table tr td :first-child { margin-top: 0; } | |
table tr th :last-child, table tr td :last-child { margin-bottom: 0; } | |
/* @end */ |
Where do you insert the tag if you are using hugo. My markdown starts with the metadata.
linkTitle: "Configuration Library"
title: "Configuration Library"
weight: "1"
aliases:
- /en/configuration-library.html
@radhikapc I'd suggest searching online, this tutorial might help
https://hugo-mini-course.netlify.app/sections/styling/custom/
But it doesn't render in github profile.
Please help me~
Where do you insert the tag if you are using hugo. My markdown starts with the metadata.
linkTitle: "Configuration Library" title: "Configuration Library" weight: "1" aliases: - /en/configuration-library.html
It should work right after the metadata ends, before the MD formatting, you can use a HTML tag in some scenarios depending your tech stack
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
It was really helpful, it works. Thanks