كود HTML:
<div class="header.right"></div>
<div class="header.right1"></div>
<div class="header.right2"></div>
<div class="header.middle"></div>
<div class="header.left"></div>
<div class="header.left1"></div>
عندك مشكلة
اذا كتبت بال css
مب شرط ان تعريف الdiv يكون header.right واظن ال "." غير مسموح استخدامها هنا..
اجعلهم كذا :
كود HTML:
<div class="right"></div>
<div class="right1"></div>
<div class="right2"></div>
<div class="middle"></div>
<div class="left"></div>
<div class="left1"></div>
ايضا عندك
كود:
#header.right {
background-image: url(images/css-style/css_06.jpg);
background-repeat: no-repeat;
float: right;
height: 247px;
width: 66px;
}
#header.right1 {
background-image: url(images/css-style/css_05.jpg);
background-repeat: no-repeat;
float: right;
height: 247px;
width: 166px;
}
#header.right2 {
background-image: url(images/css-style/css_04.jpg);
background-repeat: no-repeat;
float: right;
height: 247px;
width: 164px;
}
#header.left {
background-image: url(images/css-style/css_01.jpg);
float: left;
height: 247px;
width: 113px;
}
#header.left1 {
background-image: url(images/css-style/css_02.jpg);
float: left;
height: 247px;
width: 208px;
}
#header.middle {
background-image: url(images/css-style/css_03.jpg);
background-repeat: repeat-x;
height: 247px;
width: 1px;
margin-right: auto;
margin-left: auto;
}
مابين #header و .اسم الكلاس
لازم تضع مسافة
والا في هذه الحالة يبحث عن العنصر اللي تعريفه يكون :
<div id="header" class="right"></div>
اما اذا وضعنا المسافة فيبحث عن عنصر بداخل الheader....
كود:
#header .right {
background-image: url(images/css-style/css_06.jpg);
background-repeat: no-repeat;
float: right;
height: 247px;
width: 66px;
}
#header .right1 {
background-image: url(images/css-style/css_05.jpg);
background-repeat: no-repeat;
float: right;
height: 247px;
width: 166px;
}
#header .right2 {
background-image: url(images/css-style/css_04.jpg);
background-repeat: no-repeat;
float: right;
height: 247px;
width: 164px;
}
#header .left {
background-image: url(images/css-style/css_01.jpg);
float: left;
height: 247px;
width: 113px;
}
#header .left1 {
background-image: url(images/css-style/css_02.jpg);
float: left;
height: 247px;
width: 208px;
}
#header .middle {
background-image: url(images/css-style/css_03.jpg);
background-repeat: repeat-x;
height: 247px;
width: 1px;
margin-right: auto;
margin-left: auto;
}