Better looking CSS custom styles (title h1 h2 h3)

Better looking CSS custom styles (title h1 h2 h3)

Rendering

Commonly used styles in Blog Garden

/*Title h1 h2 h3 style*/
#content {
    color: black;
    font: 0.875em/1.5em"Microsoft YaHei", "PTSans", "Arial", sans-serif;
    font-size: 16px;
}
#content h1 {
    background: #2B6695;
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
    color: #FFFFFF;
    font-family:"Microsoft YaHei", "Songti", "HeiTi", Arial;
    font-size: 18px;
    font-weight: bold;
    height: 25px;
    line-height: 25px;
    margin: 18px 0 !important;
    padding: 8px 0 5px 5px;
    text-shadow: 2px 2px 3px #222222;
}
#content h2 {
    background: #2B6600;
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
    color: #FFFFFF;
    font-family:"Microsoft YaHei", "Songti", "HeiTi", Arial;
    font-size: 15px;
    font-weight: bold;
    height: 24px;
    line-height: 23px;
    margin: 12px 0 !important;
    padding: 5px 0 5px 10px;
    text-shadow: 2px 2px 3px #222222;
}
#content h3 {
    background: #5B9600;
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
    color: #FFFFFF;
    font-family:"Microsoft YaHei", "Songti", "HeiTi", Arial;
    font-size: 13px;
    font-weight: bold;
    height: 24px;
    line-height: 20px;
    margin: 12px 0 !important;
    padding: 5px 0 5px 10px;
    text-shadow: 2px 2px 3px #222222;
}

Button Style

CSS

/*Recommend/Dislike button*/
#div_digg {
    position:fixed;
    bottom:10px;
    width:140px;
    right:390px;
    border:2px solid #6FA833;
    padding:10px;
    background-color:#fff;
    border-radius:5px 5px 5px 5px !important;
    box-shadow:0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
}

The above is the details of the more beautiful CSS custom styles (title h1 h2 h3). For more information about CSS custom h2 h3 styles, please pay attention to other related articles on 123WORDPRESS.COM!

<<:  A brief discussion on several situations where adding indexes to MySQL does not take effect

>>:  html a link tag title attribute line break mouse hover prompt content line break effect

Recommend

The difference and usage between div and span

Table of contents 1. Differences and characterist...

JavaScript to implement simple tab bar switching content bar

This article shares the specific code of JavaScri...

Significantly optimize the size of PNG images with CSS mask (recommended)

This article is welcome to be shared and aggregat...

Zabbix monitoring solution - the latest official version 4.4 [recommended]

Zabbix 2019/10/12 Chenxin refer to https://www.za...

How to use Docker to build a development environment (Windows and Mac)

Table of contents 1. Benefits of using Docker 2. ...

The process of deploying and running countly-server in docker in win10

I have just come into contact with and become fam...

How to solve the problem that Seata cannot use MySQL 8 version

Possible reasons: The main reason why Seata does ...

How to call a piece of HTML code together on multiple HTML pages

Method 1: Use script method: Create a common head...

Installation and use of Apache stress testing tools

1. Download Go to the Apache official website htt...

Web skills: Multiple IE versions coexistence solution IETester

My recommendation Solution for coexistence of mul...

33 ice and snow fonts recommended for download (personal and commercial)

01 Winter Flakes (Individual only) 02 Snowtop Cap...