mirror of
https://github.com/ezyang/htmlpurifier.git
synced 2024-12-22 08:21:52 +00:00
Rewrite docs on align attribute, complete with smoketest-case and licensing info.
git-svn-id: http://htmlpurifier.org/svnroot/htmlpurifier/trunk@1014 48356398-32a2-884e-a903-53898d9a118a
This commit is contained in:
parent
4e77a1adbd
commit
bbea02f55c
@ -264,9 +264,9 @@ Mozilla on inside and needs -moz-outline, no IE support.</td></tr>
|
|||||||
<tbody>
|
<tbody>
|
||||||
<tr><th colspan="3">Transform, target milestone 1.6.1/1.7</th></tr>
|
<tr><th colspan="3">Transform, target milestone 1.6.1/1.7</th></tr>
|
||||||
<tr><td rowspan="5">align</td><td>CAPTION</td><td>Near-equiv style 'caption-side', drop left and right</td></tr>
|
<tr><td rowspan="5">align</td><td>CAPTION</td><td>Near-equiv style 'caption-side', drop left and right</td></tr>
|
||||||
<tr><td>IMG</td><td rowspan="2">Margin-left and margin-right = auto or parent div</td></tr>
|
<tr><td>IMG</td><td rowspan="3">See specimens/html-align-to-css.html</td></tr>
|
||||||
<tr><td>TABLE</td></tr>
|
<tr><td>TABLE</td></tr>
|
||||||
<tr><td>HR</td><td>Near-equivalent style 'text-align' (Works for IE and Opera, but not Firefox). Also try <code>margin-right:auto; margin-left:0;</code> for left or <code>margin-right:0; margin-left:auto;</code> for right (optionally replacing 0 with the original margin for that side)</td></tr>
|
<tr><td>HR</td></tr>
|
||||||
<tr class="impl-yes"><td>H1, H2, H3, H4, H5, H6, P</td><td>Equivalent style 'text-align'</td></tr>
|
<tr class="impl-yes"><td>H1, H2, H3, H4, H5, H6, P</td><td>Equivalent style 'text-align'</td></tr>
|
||||||
<tr class="required impl-yes"><td>alt</td><td>IMG</td><td>Required, insert image filename if src is present or default invalid image text</td></tr>
|
<tr class="required impl-yes"><td>alt</td><td>IMG</td><td>Required, insert image filename if src is present or default invalid image text</td></tr>
|
||||||
<tr class="impl-yes"><td rowspan="3">bgcolor</td><td>TABLE</td><td>Superset style 'background-color'</td></tr>
|
<tr class="impl-yes"><td rowspan="3">bgcolor</td><td>TABLE</td><td>Superset style 'background-color'</td></tr>
|
||||||
|
8
docs/specimens/LICENSE
Normal file
8
docs/specimens/LICENSE
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
Licensing of Specimens
|
||||||
|
|
||||||
|
Some files in this directory have different licenses:
|
||||||
|
|
||||||
|
windows-live-mail-desktop-beta.html - donated by laacz, public domain
|
||||||
|
img.png - LGPL, from <http://commons.wikimedia.org/wiki/Image:Pastille_chrome.png>
|
||||||
|
|
||||||
|
All other files are by me, and are licensed under LGPL.
|
165
docs/specimens/html-align-to-css.html
Normal file
165
docs/specimens/html-align-to-css.html
Normal file
@ -0,0 +1,165 @@
|
|||||||
|
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
||||||
|
"http://www.w3.org/TR/html4/loose.dtd">
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>HTML align attribute to CSS - HTML Purifier Specimen</title>
|
||||||
|
<style type="text/css">
|
||||||
|
div.container {position:relative;height:110px;}
|
||||||
|
div.container.legend .test {text-align:center;line-height:100px;}
|
||||||
|
div.test {width:100px;height:100px;border:1px solid black;
|
||||||
|
position:absolute;top:10px;}
|
||||||
|
div.test.html {left:10px;}
|
||||||
|
div.test.css {left:140px;}
|
||||||
|
table {background:#F00;}
|
||||||
|
img {border:1px solid #000;}
|
||||||
|
hr {width:50px;}
|
||||||
|
div.segment {width:250px; float:left; margin-top:1em;}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<h1>HTML align attribute to CSS</h1>
|
||||||
|
|
||||||
|
<p>Inspect source for methodology.</p>
|
||||||
|
|
||||||
|
<div class="container legend">
|
||||||
|
<div class="test html">
|
||||||
|
HTML
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
CSS
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="segment">
|
||||||
|
|
||||||
|
<h2>table.align</h2>
|
||||||
|
|
||||||
|
<h3>left</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
a<table align="left"><tr><td>O</td></tr></table>a
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
a<table style="float:left;"><tr><td>O</td></tr></table>a
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>center</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
a<table align="center"><tr><td>O</td></tr></table>a
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
a<table style="margin-left:auto; margin-right:auto;"><tr><td>O</td></tr></table>a
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>right</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
a<table align="right"><tr><td>O</td></tr></table>a
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
a<table style="float:right;"><tr><td>O</td></tr></table>a
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- ################################################################## -->
|
||||||
|
|
||||||
|
<div class="segment">
|
||||||
|
<h2>img.align</h2>
|
||||||
|
<h3>left</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
a<img src="img.png" align="left">a
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
a<img src="img.png" style="float:left;">a
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>right</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
a<img src="img.png" align="right">a
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
a<img src="img.png" style="float:right;">a
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>bottom</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
a<img src="img.png" align="bottom">a
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
a<img src="img.png" style="vertical-align:baseline;">a
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>middle</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
a<img src="img.png" align="middle">a
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
a<img src="img.png" style="vertical-align:middle;">a
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>top</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
a<img src="img.png" align="top">a
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
a<img src="img.png" style="vertical-align:top;">a
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- ################################################################## -->
|
||||||
|
|
||||||
|
<div class="segment">
|
||||||
|
|
||||||
|
<h2>hr.align</h2>
|
||||||
|
|
||||||
|
<h3>left</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
<hr align="left" />
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
<hr style="margin-right:auto; margin-left:0; text-align:left;" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>center</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
<hr align="center" />
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
<hr style="margin-right:auto; margin-left:auto; text-align:center;" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h3>right</h3>
|
||||||
|
<div class="container">
|
||||||
|
<div class="test html">
|
||||||
|
<hr align="right" />
|
||||||
|
</div>
|
||||||
|
<div class="test css">
|
||||||
|
<hr style="margin-right:0; margin-left:auto; text-align:right;" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
BIN
docs/specimens/img.png
Normal file
BIN
docs/specimens/img.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.1 KiB |
Loading…
Reference in New Issue
Block a user