CSS-стиль не отображается в браузере

0

Я создаю пользовательскую таблицу для веб-сайта. В Dreamweaver вкладка " Design " отображает именно то, что я хочу, но на вкладке " Live " нет границ и ничего не видно. Я попытался найти решение, я мог бы кое-что упустить, но пока не нашел решения. Я размещаю код здесь:

CSS

#tableData{
    font-family:Verdana, Geneva, sans-serif;
    font-size:16px;
    color:#09F; 

    padding-bottom:25px;
    padding-top:10px;

    border-bottom:thin;
    border-bottom-color:#09F;


}        


table{
    width:600px;
    border: 1px solid #666;
}


li{
    list-style:none;
    height:22px;
    border-bottom:1px;
    border-bottom-color:#09F;
}


#tableHeading{
    font-family:Arial;
    font-size:32px;
    color:#666; 
    padding:10px;
    float:left;
    padding-right:500px;
    border-left:thick;
    border-right:thick;
    border-left-color:#09F;
    border-right-color:#09F;

}  

HTML

   <tr>
    <td id="tableData">
         <ul>
             <li>Android</li>
             <li>abced </li>
             <li>xyz</li>
         </ul>
   </td>
  </tr>

В дизайне:

Изображение 174551

В режиме Live View (Browser):

Изображение 174551

Что я делаю не так? Как я могу это решить?

С уважением

Теги:
dreamweaver

3 ответа

0
Лучший ответ

Измените CSS для: -

#tableData{
    font-family:Verdana, Geneva, sans-serif;
    font-size:16px;
    color:#09F; 

    padding-bottom:25px;
    padding-top:10px;

    border-bottom-style:solid;/*Updated*/
    border-bottom-color:#09F;/*Updated*/

}

#tableHeading{
    font-family:Arial;
    font-size:32px;
    color:#666; 
    padding:10px;
    /*float:left;*/
    padding-right:500px;
    border-left: 5px solid #09F;
    border-right: 5px solid #09F;
}  

Вы должны упомянуть полный " border-bottom-style " и " border-bottom-color ",

или используйте вместо этого " border-bottom:1px solid #09F; "

Пожалуйста, обратитесь к этому скрипту: http://jsfiddle.net/aasthatuteja/gDkn6/

Надеюсь, это поможет!

1

замещать

border-left:thick;
border-right:thick;
border-left-color:#09F;
border-right-color:#09F;

от

border-left:thick solid #09F;
border-right:thick solid #09F;
0

Пунктирная рамка, которую вы видите в дизайне Dreamweaver, создается, чтобы показать вам, что есть элемент, это действительно не часть вашей страницы.

Граница в CSS состоит из трех основных компонентов: ширина, цвет и стиль. Свойство стиля - это тот, который вы пропустите.

Измените стили границы на:

border-bottom-width: thin;
border-bottom-color: #09F;
border-bottom-style: solid;

Вы также можете использовать сокращение для нижней границы:

border-bottom: solid thin #09F;

Кроме того, я бы посоветовал использовать численные значения для ширины, например: 1px чтобы вы точно знали, что именно получаете.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню