/* comments appear inside slash-asterisk, just like this line!
   there are no "one-line comments"; this is the only comment style */
selector { property: value; /* more properties...*/ }
* { color:red; }
<div class='some-class class2' id='someId' attr='value' otherAttr='en-us foo bar' />
.some-class { }
.some-class.class2 { }
#someId { }
div { }
[attr] { font-size:smaller; }
[attr='value'] { font-size:smaller; }
[attr^='val'] { font-size:smaller; }
[attr$='ue'] { font-size:smaller; }
[attr$='ue'] { font-size:smaller; }
[otherAttr|='en'] { font-size:smaller; }
div.some-class[attr$='ue'] { }
div.some-parent > .class-name {}
div.some-parent .class-name {}
div.some-parent.class-name {}
.i-am-before + .this-element { }
.i-am-any-before ~ .this-element {}
selector:hover {}
selected:visited {}
selected:link {}
selected:focus {}
selector {

    /* واحدها اندازه */
    width: 50%; /* در اساس درصد */
    font-size: 2em; /* بر اساس اندازه font-size یعنی دو برابر اندازه فونت فعلی */
    width: 200px; /* بر اساس پیکسل */
    font-size: 20pt; /* بر اساس points (نکات) */
    width: 5cm; /* بر اساس سانتیمتر */
    min-width: 50mm; /* بر اساس میلیمتر */
    max-width: 5in; /* بر اساس اینچ. max-(width|height) */
    height: 0.2vh; /* بر اساس ارتفاع دید `vh = نسبت به 1٪ از ارتفاع دید` (CSS3) */
    width: 0.4vw; /* بر اساس عرض دید `vw = نسبت به 1٪ از عرض دید` (CSS3) */
    min-height: 0.1vmin; /* بر اساس کوچکترین مقدار از ارتفاع یا عرض دید (CSS3) */
    max-width: 0.3vmax; /* مانند مثال بالا برای بیشترین مقدار (CSS3) */

    /* رنگها */
    background-color: #F6E;  /* بر اساس short hex */
    background-color: #F262E2; /* بر اساس long hex format */
    background-color: tomato; /* بر اساس نام رنگ */
    background-color: rgb(255, 255, 255); /* بر اساس rgb */
    background-color: rgb(10%, 20%, 50%); /* بر اساس درصد rgb , (rgb percent) */
    background-color: rgba(255, 0, 0, 0.3); /* بر اساس rgba (نیمه شفاف) , (semi-transparent rgb) (CSS3) */
    background-color: transparent; /* شفاف */
    background-color: hsl(0, 100%, 50%); /* بر اساس hsl format (CSS3). */
    background-color: hsla(0, 100%, 50%, 0.3); /* بر اساس hsla ,مثل RGBAکه میتوان شفافیت را در آخر انتخاب کرد (CSS3) */


    /* عکسها */
    background-image: url(/path-to-image/image.jpg); /* گذاشتن نقل قول داخل url() اختیاری است*/

    /* فونتها */
    font-family: Arial;
    font-family: "Courier New"; /* اگر اسم فونت با فاصله همراه باشد باید داخل نقل قول یک یا دو نوشته شود */
    font-family: "Courier New", Trebuchet, Arial, sans-serif; /* اگر فونت اولی پیدا نشد مرورگر به سراغ نام بعدی میرود */
}
<link rel='stylesheet' type='text/css' href='path/to/style.css' />
<style>
   a { color: purple; }
</style>
<div style="border: 1px solid red;">
</div>
/*A*/
p.class1[attr='value']

/*B*/
p.class1 {}

/*C*/
p.class2 {}

/*D*/
p {}

/*E*/
p { property: value !important; }
<p style='/*F*/ property:value;' class='class1 class2' attr='value'>
</p>