User:Eleanorg/1.2/Forbidden Pixels/first html grid

From XPUB & Lens-Based wiki

First html grid

This script prints an html doc with a grid of empty span elements and associated empty css rules, corresponding to a 10 x 20 pixel detail of an illicit image, to be filled in with the hexadecimal codes of each corresponding pixel:

print """
<!DOCTYPE html>
<html>
  <head>
    <title>Forbidden Pixels: Trial #1</title>
    <style type="text/css">
      #header {
        width: 200px;
        height: 1000px;
        float:left;
        padding-left: 10px;
        padding-top: 10px;
        padding-right: 20px;
        border-right: 1px solid #000;
        background-color: #fff;
        font-family: sans-serif;
        
      }
      .inner {
        width: 1000px;
        margin-top: 20px;
        float:left;
        margin-left: 30px;
        
       
        background-color: #aaa;
      }
      .pixel {
        min-width: 50px;
        min-height: 50px;
        float: left;
        border: 0px #000 solid;
        padding: none;
        margin: none;
      }"""
      
# prints empty css rules for each pixel
n = 1
while n < 201:
    print """
      #pixel_""" + str(n) + """ { background-color: #; }"""
    n = n + 1

print """
    </style>
  </head>
  
<body>
  <div id="header">
    <h1>Forbidden Pixels</h1>
    <p>A 20 x 10 pixel section of a censored photograph</p>
  </div>
  
  <div class="inner">"""
  
# prints out a grid of square spans
x = 1
while x < 201:
    print """
    <span class="pixel" id="pixel_""" + str(x) + """"></span>"""
    x = x + 1
    
print """
   
  </div>
</body>
</html>"""