We would like to know how to background-size: 100% 1.7em; repeat for each line inside paragraph.
<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
p {<!-- w w w .j a va 2 s. com-->
font-weight: 200;
font-size: 1.7em;
line-height: 1.7em;
background: -webkit-linear-gradient(-90deg, #000 1px, rgba(0, 0, 0, 0)
1px, rgba(0, 0, 0, 0) 100%);
background: -moz-linear-gradient(-90deg, #000 1px, rgba(0, 0, 0, 0) 1px,
rgba(0, 0, 0, 0) 100%);
background: linear-gradient(180deg, #000 1px, rgba(0, 0, 0, 0) 1px,
rgba(0, 0, 0, 0) 100%);
background-size: 100% 1.7em;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed
diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam
erat, sed diam voluptua. At vero eos et accusam et justo duo dolores
diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam
erat, sed diam voluptua. At vero eos et accusam et justo duo dolores
diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam
erat, sed diam voluptua. At vero eos et accusam et justo duo dolores
diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam
erat, sed diam voluptua. At vero eos et accusam et justo duo dolores
diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam
erat, sed diam voluptua. At vero eos et accusam et justo duo dolores
et ea rebum.</p>
</body>
</html>
The code above is rendered as follows: