Week 4 ICA

Developer
Richard
Size
2,725 Kb
Views
8,096
  1. Week 4 ICA Previews
  2. Week 4 ICA HTML Codes
  3. Week 4 ICA CSS Codes

How do I make an week 4 ica?

What is a week 4 ica? How do you make a week 4 ica? This script and codes were developed by Richard on 08 January 2023, Sunday.

Week 4 ICA Previews
IQ Test

Week 4 ICA - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Week 4 ICA</title> <link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="wrapper"> <div class="pannel header"> <i class="fa fa-bars hamburger" aria-hidden="true"></i> <div class="full-nav">Home About Contact</div> <div class="logo"> <img src="http://placehold.it/200x100?text=Logo"></div> </div> <div class="slider"> <img src="http://placehold.it/1000x500?text=SLIDER"> </div>
<div class="allarticle"> <div class="articleBox1st"> <div class="article"> <img src="http://placehold.it/225x200?text=image"> </div> <div class="article1 content"> <h2> Learn About Lorem</h2> <p> In publishing and graphic design, lorem ipsum (derived from Latin dolorem ipsum, translated as "pain itself") is a filler text commonly used to demonstrate the graphic elements of a document or visual presentation. Replacing meaningful content with placeholder text allows viewers to focus on graphic aspects such as font, typography, and page layout without being distracted by the content. It also reduces the need for the designer to come up with meaningful text, as they can instead use quickly-generated lorem ipsum.</p>
</div>
</div> <div class="articleBox2nd"> <div class="article"> <img src="http://placehold.it/225x200?text=image"> </div> <div class="article2 content"> <h2> Ipsum Is In</h2> <p> A variation of the ordinary lorem ipsum text has been used in typesetting since the 1960s or earlier, when it was popularized by advertisements for Letraset transfer sheets. It was introduced to the Information Age in the mid-1980s by Aldus Corporation, which employed it in graphics and word processing templates for its desktop publishing program, PageMaker.</p>
</div>
</div> </div>
<div class="pannel sidebar"> Sidebar</div>
<div class="pannel footer">FOOTER</div> </div>
</body>
</html>

Week 4 ICA - Script Codes CSS Codes

/*defaults*/
* { box-sizing: border-box;
}
img { max-width: 100%;
}
.wrapper{ max-width:1000px; margin: 0 auto;
}
.pannel { background-color: grey; border: 10px solid darkgrey; margin: 20px;
}
/*Mobile*/
.logo { padding: 8px; max-width:80%;
}
.header{position: relative;}
.full-nav { display: none; }
.hamburger { float: right; font-size: 35px; position: absolute; top: 30%; right: 5%;
}
.slider { width: 100%; margin-bottom: 35px;
}
.article { text-align: center;
}
h2 { text-align: center;
}
p { text-align: justify;
}
.sidebar { display: none;
}
.footer { padding: 15px; text-align: center;
}
/*////////////////////////////////////////TABLET view */
@media (min-width: 600px) { .article { float: left; width: 40% } .content { float: right; width: 45%; } /*.articleBox1st { margin-top: 20px; } .articleBox2nd { margin-top: 300px; }*/ .sidebar { display: block; float: left; width: 100%; padding: 55px; text-align: center; } .footer { width: 100%; float: left; }
}
/*////////////////////Desktop view */
@media (min-width: 1000px) { .full-nav { display: block; position: absolute; top: 35%; right:5%; font-family: arial; font-size: 1.5em; } .hamburger { display: none; } .slider { text-align: center; } .allarticle { width: 50%; float: left; } .articleBox2nd { margin-top: 400px;} .sidebar{ width:45%; float:right; padding: 300px 0px;}
}
Week 4 ICA - Script Codes
Week 4 ICA - Script Codes
Home Page Home
Developer Richard
Username keyboarddesk
Uploaded January 08, 2023
Rating 3
Size 2,725 Kb
Views 8,096
Do you need developer help for Week 4 ICA?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Richard (keyboarddesk) Script Codes
Name
SVG animation introduction
ICA adding mobile NAV
Assignment 4 SCSS animations
Working with Foundation week13
In class Week 4 - Mobile Navigation Patterns-Footer Nav
Richard Lococo -Assignment 6 - Canvas
Looping background beach video
Index transfer
Modal with triggered animation inside
ALPACA PRESENTATION
Create amazing web content with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!