html2canvas/tests/reftests/list/liststyle.html
2017-12-21 23:22:09 +08:00

103 lines
1.9 KiB
HTML

<!doctype html>
<html>
<head>
<title>List tests</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../../test.js"></script>
<style>
li {
margin: 10px 5%;
}
.list1 {
list-style-type: circle;
}
.list2 {
list-style-image: url(../../assets/image.jpg);
}
.list3 {
list-style-image: linear-gradient(60deg, deeppink, aquamarine);
list-style-position: inside;
}
.list4 {
}
.list5 {
list-style-type: lower-roman;
}
.list6 {
list-style-type: hiragana;
}
.list7 {
list-style-type: simp-chinese-informal;
}
.list8 {
list-style-type: lower-roman;
}
.list8 li {
display: block;
}
.list9 {
display: list-item;
list-style-type: lower-alpha;
margin: 10px;
position: relative;
left: 200px;
}
</style>
</head>
<body>
<ul class="list1">
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ul>
<ul class="list2">
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ul>
<ul class="list3">
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ul>
<ol class="list4" start="-1">
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ol>
<ol class="list5">
<li>Alpha</li>
<li value="5">Beta</li>
<li>Gamma</li>
</ol>
<ol class="list6">
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ol>
<ol class="list7">
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ol>
<ol class="list8">
<li>Alpha</li>
<li>Beta</li>
<li>Gamma</li>
</ol>
<div class="list9">Alpha</div>
<div class="list9">Beta</div>
<div class="list9">Gamma</div>
</body>
</html>