Landing : Athabascau University

Group members: this is the place for your learning diary. Use this to post your zipped-up site at least once each unit, and your reflections as often as you wish (at least once per unit). Please write your reflections directly in the post, not as attached files. Where you do need to attach documents, such as for unit 1 designs, use PDF, PNG or JPG formats. You can attach files using the 'Embed content' link in the editor.

QUICK COURSE LINKS:  Add blog post - Read latest group postsFAQs: Course process : Site design : HTML : CSS : JavaScript : JQuery : AJAX : MiscPodcasts for each unit

Updated resource pages:  Unit 1 - Unit 2  - Unit 3Units 4 & 5 - Unit 6 - Unit 7

mportant notice: the student web server is unavailable. Until this is fixed, we do not require you to upload your site to the student server. See Running a web server on your local machine for details of how to meet the requirements for the final unit

Unit 3: CSS

  • Public
By Jiaying Zhao in the group COMP 266 May 22, 2021 - 12:38pm

This unit mainly requires the use of CSS style to beautify the previous unit's homework in layout and typesetting, and effectively control the layout, font, color, background and other effects of the page. I divided the website into seven pages. I created a new style.css common style file in the root directory of the website file, and each HTML file introduces the style sheet through < link rel = "stylesheet" type = "text / CSS" a. When importing style files into each page, you should pay attention to the path. Since CSS files and each HTML file are at the same level, you don't need to consider the level when importing them here. You can import them directly. When dealing with style control for each HTML page, I specially set a specific class name for each page, and the common style sheet processes the elements of the page through a specific class name. For example, homepage.html sets a specific class name for the main DOM element as homepagemain. At this time, the style sheet controls the elements in the. Homepagemain hierarchy. It sets different class names for different page main bodies, and controls the corresponding element styles through the specific class name, which can effectively achieve the effect of sample processing without repetition or coverage, This is also the place where I think I have considered more carefully in this assignment. Specifically, styles in CSS style sheets form a hierarchy, and more specific styles cover common styles. The priority of style rules is determined by CSS according to this hierarchy, so as to achieve the cascading effect.

In this assignment, due to the element level problem, the CSS style sheet does not correctly introduce the HTML file, resulting in the style can not be displayed normally. Later, after troubleshooting, the problem was finally fixed for the path. If I have to do it again, when defining HTML elements, I should reasonably consider the layout and typesetting of the page, which is more conducive to the development of CSS in the future Unit 3: CSS

 

This is my website: http://student.athabascau.ca/~jiayingzh/directory_unit3/Homepage.html