Generate a website with rounded rectangle implemented by pure CSS code online

Method: On the right side, select "Class Name", "background color", "color of the rounded corner rectangle", and click "show me to code. The image is generated. There is a specific CSS style sheet under!

Address: http://www.spiffycorners.com

Eg:

Class Name: Conor

Background Color: ffffff

Foreground color: 0a67e6

The Code is as follows:

<Style type = "text/CSS">
. Conor {

Display: block;
}

. Conor *{

Display: block;
Height: 1px;
Overflow: hidden;
Background: #0a67e6;
}

. Conor1 {

Border-Right: 1px solid #95bdf4;
Padding-Right: 1px;
Margin-Right: 3px;
Border-left: 1px solid #95bdf4;
Padding-left: 1px;
Margin-left: 3px;
Background: # 478dec;
}

. Conor2 {

Border-Right: 1px solid # e6effc;
Border-left: 1px solid # e6effc;
Padding: 0px 1px;
Background: # 3883ea;
Margin: 0px 1px;
}

. Conor3 {

Border-Right: 1px solid # 3883ea;
Border-left: 1px solid # 3883ea;
Margin: 0px 1px;
}

. Conor4 {

Border-Right: 1px solid #95bdf4;
Border-left: 1px solid #95bdf4;
}

. Conor5 {

Border-Right: 1px solid # 478dec;
Border-left: 1px solid # 478dec;
}

. Conor_content {

Padding: 0px 5px;
Background: #0a67e6;
}

</Style> <div>

<B class = "Conor">

<B class = "conor1"> <B> </B>
<B class = "conor2"> <B> </B>
<B class = "conor3"> </B>
<B class = "conor4"> </B>
<B class = "conor5"> </B>

</B> <Div class = "conor_content">

<! -- Your content goes here -->

</Div>
<B class = "Conor">

<B class = "conor5"> </B>
<B class = "conor4"> </B>
<B class = "conor3"> </B>
<B class = "conor2"> <B> </B>
<B class = "conor1"> <B> </B>

</B>

</Div>