Transcription
Edith Cowan UniversityResearch OnlineECU Publications Post 20132019The Other Art of Computer Programming. Milestone 5: HTML &CSS. 1990sMelanie TarrEdith Cowan University, melanie.tarr@gmail.comFollow this and additional works at: https://ro.ecu.edu.au/ecuworkspost2013Part of the Education Commons, and the Programming Languages and Compilers Commons10.25958/5e3a76e662fd9This Book is posted at Research Online.https://ro.ecu.edu.au/ecuworkspost2013/7440
HTML & CSSMilestoneThe Other Art of Computer Programmingby Melanie TarrHypertext markup languageLearn HTML and cascading style sheetscripting for the world wide webForm submission and receivalLearn how to get and send informationThe Ruby Frameworkearn how to ma e a simple todo’ listPOST1990sDOI:10.25958/5e3a76e662fd9
1990s Milestone i e1Melanie Tarr
Table of ContentsThe other art of computer ructions. .3Client, server and browser. .4Universal Resource Locators. .5Model View Controller. .6Simple HTML and CSS. .7MVC and web apps. .10View and form. .11CSS elements. .10CSS inheritance . .11ebsite le structure. .12Tags. .13What does index.html look like. .14The syntax of CSS. .16How forms work when submit is pressed. .22Ruby on rails framework. .24Welcome the user. .26Adding an item to the database. .27Back to the controller. .30Testing your Ruby application. .313 ftHomeAboutLessons Teachers7 ftStudentsACTDIP041ACTDIP039ACTDIK024Note: This lesson may offer useful explanations forthe DT curriculum codes above and elaborations inthe Australian National Curriculum.1990s Milestone i e2Melanie Tarr
The other art of computer programmingHomeA2About1LessonsTeachersStudents3 ftHomeAboutLessonsTeachers7 ftStudentsserverrequestdatabrowser21990s Milestone i e3Melanie Tarr
31990s Milestone i e4Melanie Tarr
41990s Milestone i e5Melanie Tarr
51990s Milestone i e6Melanie Tarr
61990s Milestone i e7Melanie Tarr
71990s Milestone i e8Melanie Tarr
81990s Milestone i e9Melanie Tarr
index.htmlcssimages other files 91990s Milestone i e10Melanie Tarr
10 1990s Milestone i e11Melanie Tarr
index.html11 1990s Milestone i e12Melanie Tarr
12 1990s Milestone i e13Melanie Tarr
div id ”container” div id ”header” h1 The other art. /h1 /div div id ”content” div id ”nav” h3 Navigation /h3 ul li Home /li li About /li li Contact /li /ul /div div id ”main” h2 Home page /h2 p Lorem ipsum. /p p Lorem ipsum. /p p Lorem ipsum. /p /div /div div id ”footer” Copyright © 2017 /div /div 13 1990s Milestone i e14 div id ”nav” /div div id ”main” /div li Home /li li About /li li Contact /li h2 Home p Lorem p Lorem p Lorempage /h2 ipsum. /pipsum. /pipsum. /pMelanie Tarr
14 1990s Milestone i e15Melanie Tarr
simages other files to connect the html file to the style of itselements, we specify the following: link rel ”stylesheet” type ”text/css” href ”style.css”15 1990s Milestone i e16Melanie Tarr
{#header}#navigation {}#main{}#container {}#content {}#footer16 1990s Milestone i e17Melanie Tarr
VIEWpadding:()"* "#10px;3217 1990s Milestone i e18Melanie Tarr
VIEW18 1990s Milestone i e19Melanie Tarr
VIEW19 1990s Milestone i e20Melanie Tarr
VIEW#content {padding:10px;}#nav {width: 180px;float: left;}#main {width: 600px;float: right;}20 1990s Milestone i e21Melanie Tarr
21 1990s Milestone i e22Melanie Tarr
{#header}#navigation {}#main{22 1990s Milestone i e23Melanie Tarr
1990s Milestone i e24Melanie Tarr
How forms work when “submit” ispressedGETThe other art .180px600pxcopyright24 1990s Milestone i e25Melanie Tarr
The other art .180px600pxThe other art .180px600pxEXAMPLE:DatabasesData files25 1990s Milestone i e26EXAMPLE:HtmlSome PHPEXAMPLE:PHPMelanie Tarr
1990s Milestone i e27Melanie Tarr
MODELCONTROLLERVIEWwww.todolist.27 1990s Milestone i e28Melanie Tarr
tenewhtml.erb29 1990s Milestone i e29Melanie Tarr
todolistappviewsitemsnewhtml.erbOnce the route istriggered the controllergenerates the view fileSQLtodolis tdatabasetitleanotherdatabasenotes28 1990s Milestone i e30Melanie Tarr
show all the items in thelist on the viewcreate a new itemdelete the itemedit the itemcreate a global variableto contain an array ofitems or a listmake a new item30 1990s Milestone i e31Melanie Tarr
Testing your Ruby application31 1990s Milestone i e32Melanie Tarr
The other art of computer programming. Home About Lessons Teachers Students. Home About Lessons Teachers Students. Table of Contents. 1990s Milestone ie 2 Melanie Tarr. 2 - request data. server browser. A 2 1. 7 ft 3 ft. The other art of computer programming. Home About Lessons Teachers Students. Home About Lessons Teachers Students . 1990s Milestone ie 3 Melanie Tarr. 3 - 1990s
