Internet
Seminar

Spring 2019
course
site

Thu Jan 23

now

Show and tell with your websites .

next

Where we're going next : html, css, javascript; explained by you folks for you folks.

Your assignment for next week : pick one of these topics to explain , with some examples created by you. Be ready to spend about 20 minutes explaining something.

Please organize your materials, examples, and links in this folder. To do so, click "edit" , create a folder (e.g. "boxmodel") then visit a blank page (e.g. "boxmodel/home) and put up some stuff. (I'll do an example.)

Here are (in no particular order) some possible topics.

And some more advanced topics ... which should wait until we've done some of the basics.

Other topics ?

html5 template

<!DOCTYPE html>
<html>
<head>
 <meta charset='utf-8' />
 <title>PAGE TITLE GOES HERE</title>
</head>
<body>
</body>
 <h1>header</h1>
   <div>  <!-- div: general purpose block container (this is a comment) -->
     <p>A paragraph <span>make this a different color with css</pan></p> 
     <!-- span: general purpose inline container -->
   </div>
</html>

css example

(from MDN)

  body { padding-top: 8em; }
  html { color: #fff; background: #000 no-repeat fixed;} 
  p {width: 30em; font-weight: bold;}
  .classname {color: red}
  #idname {color: #f0e023}

javscript example

also from MDN

var myImage = document.querySelector('img');

myImage.onclick = function() {
    var mySrc = myImage.getAttribute('src');
    if(mySrc === 'images/firefox-icon.png') {
      myImage.setAttribute ('src','images/firefox2.png');
    } else {
      myImage.setAttribute ('src','images/firefox-icon.png');
    }
}

code playgrounds

aside

Steganography Based Ad Payload That Drops Shlayer Trojan on Mac Users | HackerNews discussion

https://cs.marlboro.college /cours /spring2019 /internet /notes /html
last modified Sat December 21 2024 5:20 pm