VPF::помогите разобраться с кодом - Форум программистов

pythonwin

Дата 26.8.2006, 17:14 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Участник
Сообщений: 2529
Регистрация: 18.4.2006
Где: за компом

Репутация: нет
Всего: 36

Пожалуйста, помогите разобраться с кодом:

Код


.grid { background-color:#000000;font-size:12px;font-family:verdana,sans-serif;border:1;width:100%;}
.grid td, .grid th {padding:3px;border:1;}
.grid .action_cell { text-align:right; }
.grid THEAD { text-align:left;background-color:#f0f0f0;color:#333;}
.grid .heading img { float:right;margin-left:2px;margin-right:3px; } 
.grid .heading a { text-decoration:none;color:#333; }
.grid td a { text-decoration:none;color:#333}
.grid .odd{background-color:#edf3fe}
.grid .even{background-color:#fff}
.grid .pointer {cursor:pointer}
.grid .column_chooser_link {position:relative;background-color:#e3e3e3;}
.grid .column_chooser_link ul {position:absolute;display:none;top:0px;right:-20px;}
.grid .column_chooser_list a {width:200px;display:block;padding:3px;background-color:#e3e3e3;}
.grid .column_chooser_list a:hover {background-color:#cdcdcd;}
.grid .column_chooser_list { padding:0;margin:0;list-style:none;background-color:#e3e3e3; }

--------------------

портал по Python
раздел на винграде по Python
язык Python

korisarimi

Дата 26.8.2006, 17:43 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 111
Регистрация: 9.5.2006

Репутация: 1
Всего: 1

Вопрос неконкретный! Опишите что именно в этом коде вас интересует.

smartov

Дата 26.8.2006, 17:46 (ссылка)

(нет голосов)

Загрузка ...

свой собственный

Профиль
Группа: Экс. модератор
Сообщений: 4225
Регистрация: 2.2.2006
Где: NJ

Репутация: 4
Всего: 259

.grid - это класс
.grid td - td с таким классом
.grid .column_chooser_list - элемент с двумя такими классами
....
а почему мануал не хошь почитать?

pythonwin

Дата 26.8.2006, 17:50 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Участник
Сообщений: 2529
Регистрация: 18.4.2006
Где: за компом

Репутация: нет
Всего: 36

Цитата(korisarimi @ 27.8.2006, 00:43

)

Вопрос неконкретный! Опишите что именно в этом коде вас интересует.

мне интересует какая строка за какие настройки отображения отвечает.

Добавлено @ 17:52

Цитата(smartov @ 27.8.2006, 00:46

)

а почему мануал не хошь почитать?

я сейчас читаю http://wdh.suncloud.ru/contents.htm, но т.к. CSS почти не знаю - доходит очень сложно. smile

Это сообщение отредактировал(а) pythonwin - 26.8.2006, 17:53

--------------------

портал по Python
раздел на винграде по Python
язык Python

korisarimi

Дата 26.8.2006, 17:59 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 111
Регистрация: 9.5.2006

Репутация: 1
Всего: 1

background-color - цвет фона
font-size - размер шрифта
font-family - шрифт
border - рамка (толщина, вид, цвет)
padding - размер заполнителя
text-align - выравнивание

Ну и т.д.

http://wdh.suncloud.ru/css04.htm. Вот это мне сильно помогло в понимании CSS

pythonwin

Дата 26.8.2006, 18:14 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Участник
Сообщений: 2529
Регистрация: 18.4.2006
Где: за компом

Репутация: нет
Всего: 36

Вот полный код странички, где есть таблица, у которой мне нужно поменять стиль отображения

Код


<html><head>

<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <style media="all" type="text/css">
.grid { background-color:#000000;font-size:12px;font-family:verdana,sans-serif;border:1;}
.grid td, .grid th {padding:3px;border:1;}
.grid .action_cell { text-align:right; }
.grid THEAD { text-align:left;background-color:#f0f0f0;color:#333333;}
.grid .heading img { float:right;margin-left:2px;margin-right:3px; } 
.grid .heading a { text-decoration:none;color:#333333; }
.grid td a { text-decoration:none;color:#333333}
.grid .odd{background-color:#ffffff}
.grid .even{background-color:#000000}
.grid .pointer {cursor:pointer}
.grid .column_chooser_link {position:relative;background-color:#ffffff;}
.grid .column_chooser_link ul {position:absolute;display:none;top:0px;right:-20px;}
.grid .column_chooser_list a {width:200px;display:block;padding:3px;background-color:#ffffff;}
.grid .column_chooser_list a:hover {background-color:#cdcdcd;}
.grid .column_chooser_list { padding:0;margin:0;list-style:none;background-color:#000000; }
</style>
    <script src="/tg_widgets/turbogears/js/MochiKit.js" type="text/javascript">
    </script>
    <script src="/tg_widgets/turbogears/js/widget.js" type="text/javascript">
    </script>
    <script src="/tg_widgets/turbogears.widgets/ajaxgrid.js" type="text/javascript">
    </script>
    <script type="text/javascript">
                ajaxgrid_0_AjaxGrid = new AjaxGrid('/search', 'ajaxgrid_0_update');
            </script><title>Ajaxgrid Example</title>

    
    <style type="text/css">
        #pageLogin
        {
            font-size: 10px;
            font-family: verdana;
            text-align: right;
        }
    </style></head><body>
    
    
    <div id="pageLogin">
        <span>
            <a href="/login">Login</a>
        </span>
        
    </div>
    
    
    <div>

    
    
    <span>
    
    
    <div id="ajaxgrid_0">
    <a href="#" onclick="javascript:ajaxgrid_0_AjaxGrid.refresh({});return false;">
       Update
    </a>
    <table class="grid" id="ajaxgrid_0_update" border="0" cellpadding="3" cellspacing="1"><thead><tr><th class="heading" id="TH_ajaxgrid_0_update_Hour">Hour</th><th class="heading" id="TH_ajaxgrid_0_update_Minute">Minute</th><th class="heading" id="TH_ajaxgrid_0_update_Second">Second</th></tr></thead><tbody><tr class="odd" style="background-color: rgb(237, 243, 254);" id="TR_ajaxgrid_0_update_20"><td id="TD_ajaxgrid_0_update_20_20" valign="top">20</td><td id="TD_ajaxgrid_0_update_20_11" valign="top">11</td><td id="TD_ajaxgrid_0_update_20_59" valign="top">59</td></tr></tbody></table>

    <script type="text/javascript">
        addLoadEvent(partial(ajaxgrid_0_AjaxGrid.refresh, {}));
    </script>
    </div>
    </span>
    </div>
  
    
</body></html>

Нужно чтобы таблица выгледела вот так:

Код



<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Новая страница 1</title>
</head>

<body>

<table border="0" width="100%" id="table1" bgcolor="000000" cellpadding="3" cellspacing="1">
<!--   style.backgroundColor="#D9D9D9" bgcolor=#00CCFF  -->
    <tr bgcolor="D9D9D9" onmousemove="this.style.cursor='pointer'">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr bgcolor="#FFFFFF" onmousemove="this.style.backgroundColor='#00CCFF' ;this.style.cursor='pointer'" onmouseout="this.style.backgroundColor=''">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr bgcolor="#CCFFFF" onmousemove="this.style.backgroundColor='#00CCFF' ;this.style.cursor='pointer'" onmouseout="this.style.backgroundColor=''">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr bgcolor="FFFFFF" onmousemove="this.style.backgroundColor='#00CCFF' ;this.style.cursor='pointer'" onmouseout="this.style.backgroundColor=''">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr bgcolor="#CCFFFF" onmousemove="this.style.backgroundColor='#00CCFF' ;this.style.cursor='pointer'" onmouseout="this.style.backgroundColor=''">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</table>
<a target="_blank"></a>
</body>

</html>

--------------------

портал по Python
раздел на винграде по Python
язык Python

smartov

Дата 27.8.2006, 01:05 (ссылка)

(нет голосов)

Загрузка ...

свой собственный

Профиль
Группа: Экс. модератор
Сообщений: 4225
Регистрация: 2.2.2006
Где: NJ

Репутация: 4
Всего: 259

Тебе просто обработать hover?

Код


<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Новая страница 1</title>
</head>

<body>

<style>
.header {
    background: #D9D9D9;
    cursor: pointer;
}
.normalEven {
    background: #FFFFFF;
}
.normalOdd{
    background: #CCFFFF;
    cursor: pointer;
}
.hovered {
    background : #00CCFF;
    cursor: pointer;
}
</style>

<table border="0" width="100%" id="table1" bgcolor="000000" cellpadding="3" cellspacing="1">
    <tr class="header">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr class="normalEven" onmousemove="this.className='hovered'" onmouseout="this.className='normalEven'">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr class="normalOdd" onmousemove="this.className='hovered'" onmouseout="this.className='normalOdd'">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr class="normalEven" onmousemove="this.className='hovered'" onmouseout="this.className='normalEven'">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr class="normalOdd" onmousemove="this.className='hovered'" onmouseout="this.className='normalOdd'">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</table>
<a target="_blank"></a>
</body>

</html>

pythonwin

Дата 27.8.2006, 15:40 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Участник
Сообщений: 2529
Регистрация: 18.4.2006
Где: за компом

Репутация: нет
Всего: 36

smartov, спасибо! уже сделал, немного подругому, но идея такая же! smile

--------------------

портал по Python
раздел на винграде по Python
язык Python

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »