0

I am not sure if my question is clear as I have no idea about css.

I want to change the markdown single backtick highlight color in Hugo theme. for example This is an example.

In the above text "This is an example", the background color is grey and font color is black. How can I change the backdrop color and font color ?

I do not want to change the background of my blog. only the ** single back-ticked `` text**.

Thanks a lot.

Wang
  • 1,314
  • 14
  • 21

3 Answers3

2

In my Hugo template, the backtick highlights are put into <code> tags. So add CSS that styles code tags to whatever background you like.

Robin Hu
  • 189
  • 5
0

if you have a p tag like this in your html

<p><span class='sample'>This is an example</span></p>

in your css file you can add theses in lines in order to change font color and background.

.sample{
 color: #ffffff; /*to change font color*/
 background-color:#F48024; /*to change background color*/
}
wahdan
  • 1,208
  • 3
  • 16
  • 26
  • Dear wahdan, Thanks a lot for your prompt reply. I do not want to change blog background, but only the background in the single back-tick text. – Wang Jun 28 '17 at 20:31
  • @Dong ok i edited my code and added span tag inside p tag – wahdan Jun 28 '17 at 20:38
0

To change the background color and the font color you would need to use CSS. CSS is pretty easy to learn. Here is what the code would look like to change the background color and the font color. 

<!DOCTYPE html>
<html>
<head>
<style>
p{
background-color: black;
color: white;
}
</style>
</head>
<body>
<p>If you run this code you will see the background change to black and the font color change to white. </p>
</body>
</html>

In the style tags we are changing the p tag. Background-color change the background color and the color change the font/text color.

Camden Lamons
  • 26
  • 2
  • Thanks Camden Lamons. I am sorry, my question was not clear. I do not want to change blog background, but only the background in the single back-tick text. – Wang Jun 28 '17 at 20:31