Tutorial || Sidebar title background + Border (英文/English)

Tutorial request by ah bii

Tutorial start

Click it: 

① Dashboard --> Design --> Edit HTML

② Use Ctrl+F to find out the code below

.sidebar h2 {

③ Copy the code below and paste it below .sidebar h2 {

background:#FFFFFF;
-moz-border-radius: 10px;
border-radius: 10px;
border-top: 2px solid #000000;
  border-left: 2px solid #000000;
  border-right: 2px solid #000000;
  border-bottom: 2px solid #000000;
margin:0 0 1.5em;
  padding:7px 10px 7px 10px;
text-align:center;

Tip:
Red colour code - Background colour,if you want a beautiful background,replace the Red colour code with the code below

background:url(Background URL);

Orange colour code - The thickness of the border,the bigger numbers means that the border will become more thick.
Green colour code - The style of the border,you can replace it with the style below

- dotted- dashed- none- double- groove- ridge- inset- outset

Blue colour code - Colour of the border,the colour code >>was here<<
Pink colour code - Text position,you can change it to

- right- left 

The highlight code - The shape of border,if you wan another shape,please refer to the figure below,and replace the highlight code.

A:

-moz-border-radius-bottomright: 50px;

border-bottom-right-radius: 50px;

B:

-moz-border-radius-bottomright: 50px 25px;
border-bottom-right-radius: 50px 25px;

C:

-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;

D:

-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;

④ Preview and Save

Done!!

Wish you good luck!!

TIP:How's if you cannot find out .sidebar h2 { ?

You can find .sidebar { ,then you will saw the code as below

.sidebar {  color: $sidebartextcolor;  line-height: 1.5em; }

and add the code below in a new paragragh below it:

.sidebar h2 {
background:#FFFFFF;
-moz-border-radius: 10px;
border-radius: 10px;
border-top: 2px solid #000000;
  border-left: 2px solid #000000;
  border-right: 2px solid #000000;
  border-bottom: 2px solid #000000;
margin:0 0 1.5em;
  padding:7px 10px 7px 10px;
padding-bottom:8px;
padding-top:8px;
text-align:center;
}

链接我/Link Me

<center><a href="http://xiuwen53.blogspot.com" target="_blank"><img src="http://i1226.photobucket.com/albums/ee407/Xiuwen53/Xiuwens%20Design/Bloglogo_conew2.png"/></a></center>