Csdn custom CSS

You can enter the CSS style code in the Custom CSS bar on the blog configuration page to customize the blog style.

The page architecture of csdn blog is basically implemented by Div. The whole page consists of three Div groups whose IDs are:
Csdnblog_header, csdnblog_sidebar, and csdnblog_content.
Therefore, you can define their subject styles as follows:
# Csdnblog_header
{
// Head style
}
# Csdnblog_sidebar
{
// Sidebar Style
}
# Csdnblog_content
{
// Subject content style
}
The three divs are encapsulated by two divs whose IDs are csdnblog_allwrap and csdnblog_midwrap.
You can also define the overall style of the entire page.
# Csdnblog_allwrap
{
// The style you want
}
# Csdnblog_midwrap
{
// The style you want
}

The page header consists of the following parts:
1. H1: display the custom title of the blog
# Csdnblog_header H1
{
// Set the title Style
}
2. H2: display the User-Defined blog description
# Csdnblog_header H2
{
// Set the description style of the blog
}
3. UL, whose ID is personalnav, personal navigation list
# Csdnblog_header ul # personalnav
{
// Set the style of the blog personal navigation bar
}
4. UL; ID: blogsearchsty; search bar
# Csdnblog_header ul # blogsearchsty
{
// Set the style of the blog search box
// If you do not want to display it, you can use:
// Display: None
}
5. Ul. The ID is menu, and the menu bar is
# Csdnblog_header ul # menu
{
// Set the blog menu style
// If you do not want to display it, you can use:
// Display: None
}

Customize the CSS of the sidebar
The ID of the primary DIV in the sidebar is csdnblog_sidebar, which is enclosed by a div with a class of gutter in the middle. The class of the DIV in the innermost layer is aboutauthor. The rest is the DL.
You can modify the style as follows:
# Csdnblog_sidebar Div. gutter Div. aboutauthor
{
}
Further, you can:
# Csdnblog_sidebar Div. gutter Div. aboutauthor DL
{
}
# Csdnblog_sidebar Div. gutter Div. aboutauthor DL dt
{
}
# Csdnblog_sidebar Div. gutter Div. aboutauthor DL dd
{
}

CSS for custom articles
Every article is a div with the class default_contents. This Div contains two child elements.
1. H6. The class is pubtime, which is used to display the time when an article was published.
The CSS modification method is as follows:
. Default_contents h6.pubtime
{
// The style you want
}

2. Div. The class is user_article. It displays the content of the article, which consists of three parts:
2.1, H1, class is title_txt, show the article title
2.2, P, show article content
2.3, P, class is articalinfo, show article information
You can modify the overall style of the entire article area as follows:
. Default_contents Div. user_article
{
// The style you want
}

The method for modifying the CSS style of the document title is as follows:
. Default_contents Div. user_article h1.title _ txt
{
// The style you want
}
In fact, direct
. Title_txt
{
// The style you want
}
You can also modify

To modify the document information, follow these steps:
. Default_contents Div. user_article P. articalinfo
{
// The style you want
}
In fact, direct
. Articalinfo
{
// The style you want
}