<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="ru-ru" xml:lang="ru-ru" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<meta content="Онлайн-просмотрщик кода (HTML, CSS, JavaScript...) по URL. Реализация подсветки строк и добавление заметок в демонстрационных целях." name="description">
<meta content="Онлайн-просмотрщик, просмотр кода, HTML, CSS, JavaScript, URL, подсветка строк, заметки, демонстрационня, исходный код, скрипт." name="keywords">
<meta content="Елисеев Дмитрий Николаевич (http://www.elisdn.ru)" name="author">
<title>
Advanced WebReader
</title>
<style type="text/css">
* {
margin : 0;
padding : 0
}
html, body {
height : 100%;
margin : 0;
padding : 0;
}
body {
background : #fff;
font-family : arial;
line-height : 1.4;
font-size : 9pt;
}
.wrapper {
min-height : 100%;
padding : 0;
margin : 0;
}
a {
text-decoration : underline;
color : #999;
}
a:hover {
text-decoration : none;
color : #333;
}
table {
border-collapse : collapse;
}
td {
margin : 0;
border : none;
vertical-align : top;
}
.header {
margin : 0 20px 0 30px;
padding-top : 20px;
}
.tform {
float : left;
margin-top : 20px;
margin : 0;
}
.tform td {
padding : 0 20px 6px 0;
}
input.text, textarea {
border : #aaa 1px solid;
background : #fff;
font-family : arial;
font-size : 9pt;
}
input {
padding : 2px 4px;
font-family : arial;
font-size : 9pt;
}
input.checkbox {
margin : 0 6px 0 0;
padding : 1px;
}
textarea {
}
label {
cursor : pointer;
}
p {
margin : 0;
}
hr {
border : none;
border-bottom : #aaa 1px solid;
margin : 20px 0 18px 0;
}
pre, .pre {
font-family : "courier new";
font-size : 9pt;
line-height : 1.4;
padding : 0;
}
pre table {
min-width : 100%;
margin : 0;
}
pre table td {
padding : 0 0 0 20px;
}
.info {
margin-left : 30px;
}
td.number {
text-align : right;
padding : 0 0 0 24px !important;
width : 24px;
color : #666;
}
.caption {
position : absolute;
z-index : 10;
border : #c80 1px solid;
cursor : move;
font-family : arial;
}
.caption .head {
padding : 1px 12px 0 12px;
background : #c80;
/* background:#711515; */
font-weight : normal;
font-size : 8pt;
color : #000;
}
.caption .message {
padding : 12px 12px 14px 12px;
line-height : 0.7 !important;
font-family : tahoma;
background : #ffc;
font-size : 9pt;
color : #333;
}
.light {
background : #afb;
}
.slight {
background : #fbb;
}
pre .value {
color : #036;
font-weight : normal;
}
pre .construct {
color : #900;
font-style : normal;
/* font-weight:bold;
font-family:arial;
font-size:8; */
}
pre .variable {
color : #060;
font-style : normal;
font-weight : normal;
}
pre .value * {
color : #036;
}
pre .tag {
color : #900;
font-weight : normal;
}
pre .function {
color : #900;
font-weight : normal;
}
.clear {
clear : both;
height : 1px;
}
.clearfooter {
clear : both;
height : 100px;
}
.footer {
height : 80px;
margin : -81px 0 0 0;
border-top : #aaa 1px solid;
padding : 0;
min-width : 1000px;
}
.footer .padding {
padding : 16px 20px 0 20px;
}
.footer p {
color : #999;
font-size : 8pt;
}
.footer .copy {
float : right;
text-align : right;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="header">
<form action="" method="get">
<table class="tform">
<tbody>
<tr>
<td colspan="3">
URL:
<br>
<input class="text" name="url" style="width:344px" type="url" value="">
<input type="submit" value="Show">
<input name="reset" type="submit" value="Clear">
</td>
<td rowspan="2">
Заметка 1:
<br>
<textarea cols="20" name="label1" rows="3" style="width:260px;height:40px"></textarea>
</td>
<td rowspan="2">
Заметка 2:
<br>
<textarea cols="20" name="label2" rows="3" style="width:260px;height:40px"></textarea>
</td>
<td rowspan="2">
Заметка 3:
<br>
<textarea cols="20" name="label3" rows="3" style="width:260px;height:40px"></textarea>
</td>
</tr>
<tr>
<td>
<input class="checkbox" id="noinfo" name="info" type="checkbox" value="no">
<label for="noinfo">
Скрыть информацию
</label>
</td>
<td align="center">
<input class="checkbox" id="noheader" name="header" type="checkbox" value="no">
<label for="noheader">
Скрыть заголовок
</label>
</td>
<td align="right">
<input class="checkbox" id="nobody" name="body" type="checkbox" value="no">
<label for="nobody">
Скрыть содержимое
</label>
</td>
</tr>
<tr>
<td colspan="3">
Подсветить строки
<input class="text" name="light" style="width:170px" value="">
Встать на строку
<input class="text" name="line" style="width:33px" value="">
</td>
<td>
Строка
<input class="text" name="y1" style="width:23px" value="">
Столбец
<input class="text" name="x1" style="width:23px" value="">
<label for="mark1">
Подсветить
</label>
<input class="checkbox" id="mark1" name="mark1" type="checkbox" value="yes">
</td>
<td>
Строка
<input class="text" name="y2" style="width:23px" value="">
Столбец
<input class="text" name="x2" style="width:23px" value="">
<label for="mark2">
Подсветить
</label>
<input class="checkbox" id="mark2" name="mark2" type="checkbox" value="yes">
</td>
<td>
Строка
<input class="text" name="y3" style="width:23px" value="">
Столбец
<input class="text" name="x3" style="width:23px" value="">
<label for="mark3">
Подсветить
</label>
<input class="checkbox" id="mark3" name="mark3" type="checkbox" value="yes">
</td>
</tr>
</tbody>
</table>
</form>
<div class="clear">
</div>
</div>
<hr>
<noindex>
<table class="info">
<tbody>
<tr>
<td>
<p>
Введите URL
</p>
</td>
</tr>
</tbody>
</table>
</noindex>
<div class="clearfooter">
</div>
</div>
<div class="footer">
<div class="padding">
<p class="copy">
©
<a href="https://elisdn.ru">
ElisDN
</a>
</p>
<p>
Сервис онлайн-просмотра и комментирования кода файлов (например, исходного кода HTML страниц, таблиц CSS и JavaScript скриптов) по URL
<br>
с подсветкой выбранных строк и добавлением заметок в указанные позиции. С подсветкой синтаксиса и нумерацией строк.
<br>
Сервис идеально подходит для демонстрации и обсуждения HTML и CSS кода страниц сайтов.
</p>
</div>
</div>
</body>
</html>