Course Hero Logo

140 the missing link an introduction to web

Course Hero uses AI to attempt to automatically extract content from documents to surface to you and others so you can study better, e.g., in search results, to enrich docs, and more. This preview shows page 155 - 159 out of 304 pages.

140The Missing Link: An Introduction to Web Development and ProgrammingChapter 22}#right{min-width:100px;max-width:150px;float:left;}@media only screen and (max-width: 479px){video{ display:none; }#left{width:100%;float:none;}#main{width:100%;float:none;}#right{width:100%;float:none;}#header{background:url(batman-logo-big.gif) no-repeat;background-size:100px 60px;background-position:center;height:100px;}}</style>Now, our floats and min/max rules will do the best they can until the device screen is lessthan 480 pixels. At that point our special style will kick in for mobile devices, putting ourdivs in a vertical row, hiding and resizing content, and making the divs as wide as the screen.Our site, without changing any HTML, will now look like the following:
141The Missing Link: An Introduction to Web Development and ProgrammingChapter 22We can also use media queries to set styling for when a user prints our page, withoutrequiring them to click a link to a special version (selecting print from a browser menuwould trigger this style) by using @media print{}.The full list of options for @media are as follows:Table 6 Media TypesNameDescriptionallAll devices.auralText-to-speech readers.brailleTactile responsive devices.embossedPrinting to braille printers.handheldSmall portable devices.printPrint view.projectionSlides and presentations.screenComputer screens (regular sizeand up).ttyTeletype terminals.tvTV displays.
142Section 2 AssessmentsFor each of these assignment, complete each bulleted step and submit all files (HTML, CSS,scripts, images, etc.) necessary by zipping and submitting your assignment folder.Your First Page:Your name, the course, and semester commented at the top of the fileCreate body, header, and footer sectionsCreate a div named content between your header and footerSet a page title that displays in the browser tabPlace an address in an address tag in your footerYour name at the top of the page as an <h1> heading in your headerAdd a few paragraphs about yourself to your content divAdd a list of hobbies or interest displayed as an HTML unordered list tocontentLink at least two of your hobbies or interests to websites related to thoseinterestsFun with MediaYour name, the course, and semester commented at the top of the fileOne image as part of your pageA short audio clip (or link to available audio filand playerA short video clip (or link to available videand playerSet both audio and video clips to have controls and not play automaticallyGive your video clip a placeholder imageTables on ChairsRecreate the following table in HTMLUse style attributes to set cell colors as neededUse the caption tag to label your table
143The Missing Link: An Introduction to Web Development and ProgrammingAssessmentsProduction Levels for Chairs This Week:MondayTuesdayWednesdayThursdayFridayTotalStools555(quota met)15Rolling(out of materials)101525Standard Leg4812428Registration FormCreate a form with an action attribute of postGive it the following fields, and a submit button:First Name, Last NameEmail Address, Email Address AgainAgeA “Plan” select box that contains Basic, Premium, Titanium optionsA checkbox asking if the user wishes to be added to a mailing listA shirt size radio set that has values of Small, Medium, LargeAdding Some Style

Upload your study docs or become a

Course Hero member to access this document

Upload your study docs or become a

Course Hero member to access this document

End of preview. Want to read all 304 pages?

Upload your study docs or become a

Course Hero member to access this document

Term
Fall
Professor
jane eyre
Tags

Newly uploaded documents

Show More

Newly uploaded documents

Show More

  • Left Quote Icon

    Student Picture

  • Left Quote Icon

    Student Picture

  • Left Quote Icon

    Student Picture