Add web design files
This commit is contained in:
557
web-design/Файлы/таблицы css/task.html
Normal file
557
web-design/Файлы/таблицы css/task.html
Normal file
@@ -0,0 +1,557 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS tables</title>
|
||||
<link href="task.css" rel="stylesheet" type="text/css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
1
|
||||
<table class="t1 otstup">
|
||||
<caption class="capt"><strong>Распределение браузеров</strong></caption>
|
||||
<tr>
|
||||
<td class="t1_ltd">Браузер</td>
|
||||
<td class="t1_rtd">Посещения</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t1_ltd">Mozilla Firefox</td>
|
||||
<td class="t1_rtd">163</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t1_ltd">Google Chrome</td>
|
||||
<td class="t1_rtd">78</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t1_ltd">Safari</td>
|
||||
<td class="t1_rtd">35</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
2
|
||||
<table class="t2 otstup">
|
||||
<caption class="capt"><strong>Распределение браузеров</strong></caption>
|
||||
<tr>
|
||||
<td class="t2_ltd">Браузер</td>
|
||||
<td class="t2_rtd">Посещения</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t2_ltd">Mozilla Firefox</td>
|
||||
<td class="t2_rtd">163</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t2_ltd">Google Chrome</td>
|
||||
<td class="t2_rtd">78</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t2_bltd">Safari</td>
|
||||
<td>35</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
3
|
||||
<table class="t3 otstup">
|
||||
<caption class="capt"><strong>Распределение браузеров</strong></caption>
|
||||
<tr>
|
||||
<td class="t3_ltd">Браузер</td>
|
||||
<td class="t3_rtd">Посещения</td>
|
||||
<td class="t3_rtd">Доля</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t3_ltd">Mozilla Firefox</td>
|
||||
<td class="t3_rtd">163</td>
|
||||
<td class="t3_rtd">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t3_ltd">Google Chrome</td>
|
||||
<td class="t3_rtd">78</td>
|
||||
<td class="t3_rtd">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Safari</td>
|
||||
<td>35</td>
|
||||
<td>13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
4
|
||||
<table class="t4 otstup">
|
||||
<caption class="capt"><strong>Распределение браузеров</strong></caption>
|
||||
<tr>
|
||||
<td class="t4_ltd">Браузер</td>
|
||||
<td class="t4_rtd">Посещения</td>
|
||||
<td class="t4_rtd">Доля</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t4_ltd">Mozilla Firefox</td>
|
||||
<td class="t4_rtd">163</td>
|
||||
<td class="t4_rtd">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t4_ltd">Google Chrome</td>
|
||||
<td class="t4_rtd">78</td>
|
||||
<td class="t4_rtd">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Safari</td>
|
||||
<td class="t4_rtd">35</td>
|
||||
<td class="t4_rtd">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
5
|
||||
<table class="t5 otstup">
|
||||
<caption class="capt"><strong>Распределение браузеров</strong></caption>
|
||||
<tr>
|
||||
<td class="t5_td">Браузер</td>
|
||||
<td class="t5_td">Посещения</td>
|
||||
<td class="t5_td">Доля</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t5_td">Mozilla Firefox</td>
|
||||
<td class="t5_td">163</td>
|
||||
<td class="t5_td">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t5_td">Google Chrome</td>
|
||||
<td class="t5_td">78</td>
|
||||
<td class="t5_td">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t5_td">Safari</td>
|
||||
<td class="t5_td">35</td>
|
||||
<td class="t5_td">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
6
|
||||
<table class="t6 otstup">
|
||||
<caption class="capt"><strong>Распределение браузеров</strong></caption>
|
||||
<tr>
|
||||
<td class="t6_ltd">Браузер</td>
|
||||
<td class="t6_ltd">Посещения</td>
|
||||
<td class="t6_rtd">Доля</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t6_ltd">Mozilla Firefox</td>
|
||||
<td class="t6_ltd">163</td>
|
||||
<td class="t6_rtd">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t6_ltd">Google Chrome</td>
|
||||
<td class="t6_ltd">78</td>
|
||||
<td class="t6_rtd">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t6_bltd">Safari</td>
|
||||
<td class="t6_bltd">35</td>
|
||||
<td class="t6_brtd">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
7
|
||||
<table class="t7 otstup">
|
||||
<caption class="capt"><strong>Распределение браузеров</strong></caption>
|
||||
<tr>
|
||||
<th class="t7_tltd">Браузер</th>
|
||||
<th class="t7_tltd">Посещения</th>
|
||||
<th class="t7_trtd">Доля</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t7_ltd">Mozilla Firefox</td>
|
||||
<td class="t7_ltd">163</td>
|
||||
<td class="t7_rtd">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t7_ltd">Google Chrome</td>
|
||||
<td class="t7_ltd">78</td>
|
||||
<td class="t7_rtd">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t7_bltd">Safari</td>
|
||||
<td class="t7_bltd">35</td>
|
||||
<td class="t7_brtd">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
8
|
||||
<table class="t8 otstup">
|
||||
<tr>
|
||||
<th class="t8_tltd" rowspan="2">Браузер</th>
|
||||
<th class="t8_trtd t8_height" colspan="2">Посещения</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="t8_tltd t8_height">Количество</th>
|
||||
<th class="t8_trtd">В процентах</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t8_ltd">Mozilla Firefox</td>
|
||||
<td class="t8_ltd">163</td>
|
||||
<td class="t8_rtd">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t8_ltd">Google Chrome</td>
|
||||
<td class="t8_ltd">78</td>
|
||||
<td class="t8_rtd">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t8_bltd">Safari</td>
|
||||
<td class="t8_bltd">35</td>
|
||||
<td class="t8_brtd">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
10
|
||||
<table class="t10 otstup">
|
||||
<caption class="small_capt">Распределение браузеров</caption>
|
||||
<tr>
|
||||
<th class="t10_htd t10_left">Браузер</th>
|
||||
<th class="t10_htd">Посещения</th>
|
||||
<td class="t10_trtd"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="t10_htd"></th>
|
||||
<th class="t10_htd">Количество</th>
|
||||
<th class="t10_htd">В процентах</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t10_td">Mozilla Firefox</td>
|
||||
<td class="t10_td">163</td>
|
||||
<td class="t10_td">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t10_td">Google Chrome</td>
|
||||
<td class="t10_td">78</td>
|
||||
<td class="t10_td">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t10_td">Safari</td>
|
||||
<td class="t10_td">35</td>
|
||||
<td class="t10_td">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
11
|
||||
<table class="t11 otstup">
|
||||
<caption class="small_capt">Распределение браузеров</caption>
|
||||
<tr>
|
||||
<th class="t11_htd t11_left">Браузер</th>
|
||||
<th class="t11_htd" colspan="2">Посещения</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="t11_htd"></th>
|
||||
<th class="t11_htd">Количество</th>
|
||||
<th class="t11_htd">В процентах</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t11_td">Mozilla Firefox</td>
|
||||
<td class="t11_td">163</td>
|
||||
<td class="t11_td">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t11_td">Google Chrome</td>
|
||||
<td class="t11_td">78</td>
|
||||
<td class="t11_td">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t11_td">Safari</td>
|
||||
<td class="t11_td">35</td>
|
||||
<td class="t11_td">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
12
|
||||
<table class="t10 otstup">
|
||||
<caption class="small_capt">Распределение браузеров</caption>
|
||||
<tr>
|
||||
<th class="t11_htd t10_left">Браузер</th>
|
||||
<th class="t11_htd" colspan="2">Посещения</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="t10_trtd"></th>
|
||||
<th class="t10_htd">Количество</th>
|
||||
<th class="t10_htd">В процентах</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t10_td">Mozilla Firefox</td>
|
||||
<td class="t10_td">163</td>
|
||||
<td class="t10_td">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t10_td">Google Chrome</td>
|
||||
<td class="t10_td">78</td>
|
||||
<td class="t10_td">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t10_td">Safari</td>
|
||||
<td class="t10_td">35</td>
|
||||
<td class="t10_td">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
13
|
||||
<table class="t13 otstup">
|
||||
<tr>
|
||||
<td>1.1</td>
|
||||
<td colspan="2">1.2</td>
|
||||
<td>1.4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2.1</td>
|
||||
<td colspan="3">2.2</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="4">3.1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4.1</td>
|
||||
<td>4.2</td>
|
||||
<td>4.3</td>
|
||||
<td>4.4</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
14
|
||||
<table class="t14 otstup">
|
||||
<tr>
|
||||
<td rowspan="4">1.1</td>
|
||||
<td>1.2</td>
|
||||
<td rowspan="3">1.3</td>
|
||||
<td>1.4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td rowspan="2">2.2</td>
|
||||
<td>2.4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3.4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4.2</td>
|
||||
<td>4.3</td>
|
||||
<td>4.4</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
15
|
||||
<table class="t15 otstup">
|
||||
<tr>
|
||||
<td rowspan="3">1.1</td>
|
||||
<td>1.2</td>
|
||||
<td rowspan="2">1.3</td>
|
||||
<td>1.4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2.2</td>
|
||||
<td>3.4</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4.2</td>
|
||||
<td>4.3</td>
|
||||
<td>4.4</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
16
|
||||
<table class="t16 otstup">
|
||||
<tr>
|
||||
<td rowspan="2" colspan="2">1.1</td>
|
||||
<td>1.3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2.3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>3.1</td>
|
||||
<td>3.2</td>
|
||||
<td>3.3</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
17
|
||||
<table class="t17 otstup">
|
||||
<tr>
|
||||
<th class="t17_tltd" rowspan="2">Браузер</th>
|
||||
<th class="t17_trtd t17_height" colspan="2">Посещения</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="t17_tltd t17_height">Количество</th>
|
||||
<th class="t17_trtd">В процентах</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t17_ltd">Mozilla Firefox</td>
|
||||
<td class="t17_ltd">163</td>
|
||||
<td class="t17_rtd">59%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t17_ltd">Google Chrome</td>
|
||||
<td class="t17_ltd">78</td>
|
||||
<td class="t17_rtd">28%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t17_bltd">Safari</td>
|
||||
<td class="t17_bltd">35</td>
|
||||
<td class="t17_brtd">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
18
|
||||
<table class="t18 otstup">
|
||||
<tr>
|
||||
<th class="t18_tltd" rowspan="2">Браузер</th>
|
||||
<th class="t18_trtd t18_height" colspan="2">Посещения</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="t18_tltd t18_height">Количество</th>
|
||||
<th class="t18_trtd">В процентах</th>
|
||||
</tr>
|
||||
<tr class="mozilla18">
|
||||
<td class="t18_ltd">Mozilla Firefox</td>
|
||||
<td class="t18_ltd">163</td>
|
||||
<td class="t18_rtd">59%</td>
|
||||
</tr>
|
||||
<tr class="google18">
|
||||
<td class="t18_ltd">Google Chrome</td>
|
||||
<td class="t18_ltd">78</td>
|
||||
<td class="t18_rtd">28%</td>
|
||||
</tr>
|
||||
<tr class="safari18">
|
||||
<td class="t18_bltd">Safari</td>
|
||||
<td class="t18_bltd">35</td>
|
||||
<td class="t18_brtd">13%</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
19
|
||||
<table class="t19 otstup">
|
||||
<caption class="capt"><strong>Посещения по городам</strong></caption>
|
||||
<tr>
|
||||
<td>Город</td>
|
||||
<td>Посещения</td>
|
||||
<td>Страниц</td>
|
||||
<td>Время</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>СПб</td>
|
||||
<td>199</td>
|
||||
<td>18,02</td>
|
||||
<td>00:13:45</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Москва</td>
|
||||
<td>69</td>
|
||||
<td>1,48</td>
|
||||
<td>00:00:44</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Киев</td>
|
||||
<td>5</td>
|
||||
<td>13,43</td>
|
||||
<td>00:18:07</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
20
|
||||
<table class="t20 otstup">
|
||||
<tr>
|
||||
<td class="t20_ttd"><strong>Город</strong></td>
|
||||
<td class="t20_ttd"><strong>Посещения</strong></td>
|
||||
<td class="t20_ttd"><strong>Страниц</strong></td>
|
||||
<td class="t20_ttd"><strong>Время</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t20_ltd">СПб</td>
|
||||
<td class="t20_ltd">199</td>
|
||||
<td class="t20_ltd">18,02</td>
|
||||
<td class="t20_rtd">00:13:45</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t20_ltd">Москва</td>
|
||||
<td class="t20_ltd">69</td>
|
||||
<td class="t20_ltd" rowspan="2">нет данных</td>
|
||||
<td class="t20_rtd">00:00:44</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t20_ltd">Киев</td>
|
||||
<td class="t20_ltd">5</td>
|
||||
<td class="t20_rtd">00:18:07</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t20_ltd" colspan="3">Всего посещений</td>
|
||||
<td class="t20_rtd">273</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t20_align" colspan="4">Посещения по городам</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
21
|
||||
<table class="t21 otstup">
|
||||
<caption><strong>Итоговая таблица</strong></caption>
|
||||
<tr>
|
||||
<td class="t21_tltd t21_padding"><strong>Город</strong></td>
|
||||
<td class="t21_tctd t21_align_center"><strong>Посещений</strong></td>
|
||||
<td class="t21_trtd t21_align_right"><strong>%</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t21_td t21_padding">СПб</td>
|
||||
<td class="t21_td t21_align_center">199</td>
|
||||
<td class="t21_td t21_align_right">65.12</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t21_yellow t21_padding">Москва</td>
|
||||
<td class="t21_yellow t21_align_center">69</td>
|
||||
<td class="t21_yellow t21_align_right">21.3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t21_td t21_padding">Киев</td>
|
||||
<td class="t21_td t21_align_center">5</td>
|
||||
<td class="t21_td t21_align_right">8</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t21_yellow t21_padding" colspan="2">Посещений за весь период</td>
|
||||
<td class="t21_yellow t21_align_right">273</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
22
|
||||
<table class="t22">
|
||||
<tr>
|
||||
<td class="t22_orange">$ 5</td>
|
||||
<td class="t22_orange">$ 75</td>
|
||||
<td class="t22_orange">$ 25</td>
|
||||
<td class="t22_green">$ 15</td>
|
||||
<td class="t22_green">$ 65</td>
|
||||
<td class="t22_orange">$ 3</td>
|
||||
<td class="t22_orange">$ 82</td>
|
||||
<td class="t22_purple">$ 33</td>
|
||||
<td class="t22_space"></td>
|
||||
<td class="t22_orange">Bonus</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t22_blue">$ 25</td>
|
||||
<td class="t22_orange">$ 40</td>
|
||||
<td class="t22_orange">$ 140</td>
|
||||
<td class="t22_green">$ 26</td>
|
||||
<td class="t22_green">$ 35</td>
|
||||
<td class="t22_orange">$ 42</td>
|
||||
<td class="t22_purple">$ 45</td>
|
||||
<td class="t22_purple">$ 29</td>
|
||||
<td class="t22_space"></td>
|
||||
<td class="t22_orange">Bonus</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="t22_blue">Bonus</td>
|
||||
<td class="t22_blue">$ 50</td>
|
||||
<td class="t22_orange">$ 2</td>
|
||||
<td class="t22_green">$ 30</td>
|
||||
<td class="t22_orange">$ 24</td>
|
||||
<td class="t22_purple">$ 12</td>
|
||||
<td class="t22_purple">$ 24</td>
|
||||
<td class="t22_purple">$ 30</td>
|
||||
<td class="t22_space"></td>
|
||||
<td class="t22_blue">$ 72</td>
|
||||
</tr>
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user