mirror of
https://github.com/rn10950/RetroZilla.git
synced 2024-11-09 09:20:15 +01:00
255 lines
9.4 KiB
HTML
255 lines
9.4 KiB
HTML
|
<html>
|
||
|
|
<head>
|
||
|
|
<style>
|
||
|
|
.clip-t { clip: rect(50px, 0px, 0px, 0px); }
|
||
|
|
.clip-r { clip: rect(0px, 50px, 0px, 0px); }
|
||
|
|
.clip-b { clip: rect(0px, 0px, 50px, 0px); }
|
||
|
|
.clip-l { clip: rect(0px, 0px, 0px, 50px); }
|
||
|
|
|
||
|
|
.clip-tr { clip: rect(50px, 50px, 0px, 0px); }
|
||
|
|
.clip-tb { clip: rect(50px, 0px, 50px, 0px); }
|
||
|
|
.clip-tl { clip: rect(50px, 0px, 0px, 50px); }
|
||
|
|
.clip-rb { clip: rect(0px, 50px, 50px, 0px); }
|
||
|
|
.clip-rl { clip: rect(0px, 50px, 0px, 50px); }
|
||
|
|
.clip-bl { clip: rect(0px, 0px, 50px, 50px); }
|
||
|
|
|
||
|
|
.clip-trb { clip: rect(50px, 50px, 50px, 0px); }
|
||
|
|
.clip-trl { clip: rect(50px, 50px, 0px, 50px); }
|
||
|
|
.clip-tbl { clip: rect(50px, 0px, 50px, 50px); }
|
||
|
|
.clip-rbl { clip: rect(0px, 50px, 50px, 50px); }
|
||
|
|
|
||
|
|
.clip-trbl { clip: rect(50px, 50px, 50px, 50px); }
|
||
|
|
|
||
|
|
.outer {
|
||
|
|
width: 50%;
|
||
|
|
overflow: hidden;
|
||
|
|
background: green;
|
||
|
|
border: 4px dashed purple;
|
||
|
|
}
|
||
|
|
.inner {
|
||
|
|
overflow: hidden;
|
||
|
|
background: green;
|
||
|
|
border: 2px dashed yellow;
|
||
|
|
margin: 5px;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="outer">
|
||
|
|
Clip nothing:
|
||
|
|
<p class="inner">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<hr>
|
||
|
|
|
||
|
|
<div class="outer">
|
||
|
|
Clip top 50 pixels:
|
||
|
|
<p class="inner clip-t">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
Clip right 50 pixels:
|
||
|
|
<p class="inner clip-r">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
Clip bottom 50 pixels:
|
||
|
|
<p class="inner clip-b">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
Clip left 50 pixels:
|
||
|
|
<p class="inner clip-l">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<hr>
|
||
|
|
|
||
|
|
<div class="outer">
|
||
|
|
Clip top-right 50 pixels:
|
||
|
|
<p class="inner clip-tr">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
Clip top-bottom 50 pixels:
|
||
|
|
<p class="inner clip-tb">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
Clip top-left 50 pixels:
|
||
|
|
<p class="inner clip-tl">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
Clip right-bottom 50 pixels:
|
||
|
|
<p class="inner clip-rb">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
Clip right-left 50 pixels:
|
||
|
|
<p class="inner clip-rl">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
Clip bottom-left 50 pixels:
|
||
|
|
<p class="inner clip-bl">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<hr>
|
||
|
|
|
||
|
|
|
||
|
|
<div class="outer">
|
||
|
|
Clip top-right-bottom 50 pixels:
|
||
|
|
<p class="inner clip-trb">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
Clip top-right-left 50 pixels:
|
||
|
|
<p class="inner clip-trl">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
Clip top-bottom-left 50 pixels:
|
||
|
|
<p class="inner clip-tbl">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
Clip right-bottom-left 50 pixels:
|
||
|
|
<p class="inner clip-rbl">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<hr>
|
||
|
|
|
||
|
|
<div class="outer">
|
||
|
|
Clip top-right-bottom-left 50 pixels:
|
||
|
|
<p class="inner clip-trbl">
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
<br>
|
||
|
|
<img src=ant.jpg width=100% height=50>
|
||
|
|
<br>
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
This is a test of word wrapping. It is a boring simple test with no markup
|
||
|
|
to make sure the parser and so on are not hosed.
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|