You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

57 lines
3.5 KiB

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>My Learning Website</title>
<link href="/styles/styles.css" rel="stylesheet" type="text/css">
<link href="styles/homepagestyles.css" rel="stylesheet">
<link href="/webdevelopment/styles/styles.css" rel="stylesheet" type="text/css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="banner">
<h1 class="courselink">Introduction to CSS</h1>
<h2 class="lecturer">LinkedIn Learning : Carrie Dils</h2>
<h2 class="episodetitle">Going Further with CSS</h2>
</div>
<article>
<h2 class="sectiontitle">CSS Frameworks and Grids</h2>
<p>Similar to resets and normalization which we looked at in an earlier chapter, frameworks provide some basic CSS for commonly used things such as layouts.</p>
<p>Grids are similar, but they provide a predefined layout - note that we are talking about a grid as a type of framework rather than the CSS Grid component. This means that our grid may be based on a CSS Grid component, but equally could be based on a flex layout or perhaps even floats.</p>
<p>These are certainly useful for making your development easier and faster, but equally, they can be really useful as sample code for you to examine in order to help with your learning.</p>
<h2 class="sectiontitle">CSS Preprocessors</h2>
<p>Preprocessors can take your CSS and make some changes to it. The course video is a little vague on this in that the example given is unlike CSS we have seen previously in the course and I'm not sure I understand the reason for writing it like that. Moreover, I find that this makes it less clear on why preprocessors are useful.</p>
<p>The most popular preprocessors are SASS, LESS and Stylus and they may be worth investigating further but I will do that in future if there seems to be a reason for doing that. I believe that the course, CSS Essential Training does not cover preprocessors, but they are covered in the course Workflow Tools for Web Developers, both of which are included in the Front End Web Development Learning Path.</p>
<h2 class="sectiontitle">Additional Resources</h2>
<p>There are plenty of web resources for learning about CSS. One of the more popular sites is <a href="https://css-tricks.com/">CSS Tricks</a> which provides a number of tutorials and other interesting articles. In addition, there are lots of LinkedIn Learning courses which I will add to page of Web Development links at a later date.</p>
</article>
<div class="btngroup">
<button class="previous" onclick="window.location.href='responsive.html';">
Previous Chapter - Responsive CSS
</button>
<button class="next" onclick="window.location.href='conclusion.html';">
Next Chapter - Conclusion
</button>
<button class="coursebutton" onclick="window.location.href='/webdevelopment/introductiontocss/introductiontocss.html'">
Course Contents
</button>
<button class="webdevbutton" onclick="window.location.href='/webdevelopment/webdevelopment.html'">
Web Development Page
</button>
<button class="homebutton" onclick="window.location.href='/index.html'">
Home
</button>
</div>
</body>
3 months ago
</html>