Update HTML blog pages
This commit is contained in:
32
computer-science-blog/pages/css.html
Normal file
32
computer-science-blog/pages/css.html
Normal file
@@ -0,0 +1,32 @@
|
||||
<!-- Reading School 2018, HTML page by Matthew Grove, Year 10 -->
|
||||
<h2>CSS</h2>
|
||||
<p>
|
||||
Cascading Stylesheets (CSS) are used to style websites - i.e. to make them look pretty.
|
||||
Whereas a page without CSS is just displayed as plain content:
|
||||
<br>
|
||||
<img class="presentation-image" src="images/without_css.jpg">
|
||||
<br>
|
||||
One with CSS looks a lot more presentable:
|
||||
<br>
|
||||
<img class="presentation-image" src="images/with_css.jpg">
|
||||
<br>
|
||||
CSS declarations use the <i>tag names</i> (e.g. <code>p</code>), <i>classes</i> and IDs of
|
||||
the elements on the page in order to style them. IDs are written with a preceding hashtag,
|
||||
classes are written with a preceding full stop and tag names are written without any preceding characters.
|
||||
The styles themselves (like <code>height</code>) should all end in semicolons.
|
||||
Here are some example declarations:
|
||||
<br>
|
||||
<code>
|
||||
p {<br>
|
||||
font-size: 3rem;<br>
|
||||
}<br>
|
||||
.class_name {<br>
|
||||
height: 200px;<br>
|
||||
}<br>
|
||||
#id_name {<br>
|
||||
font-family: 'Roboto'<br>
|
||||
}<br>
|
||||
</code>
|
||||
<br>
|
||||
A comment in CSS is started with <code>/*</code> and ended with <code>*/</code>.
|
||||
</p>
|
||||
15
computer-science-blog/pages/html.html
Normal file
15
computer-science-blog/pages/html.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<!-- Reading School 2018, HTML page by Matthew Grove, Year 10 -->
|
||||
<h2>HTML</h2>
|
||||
<p>
|
||||
Hypertext Markup Language is the standard language used by browsers to display webpages.
|
||||
HTML was invented by Tim Berners-Lee in 1990, and uses tags. This means that in order to define
|
||||
an element (something like a heading or paragraph), you use a <i>tag</i> - such as <code><p></code>,
|
||||
which displays a simple paragraph. Most tags must be closed with closing tags - like <code></p></code>,
|
||||
however some elements, like those for images (<code><img></code>) and linking external resources
|
||||
(<code><link></code>) are auto closing: they don’t need a closing tag. For example, an image is defined as follows:
|
||||
<br>
|
||||
<code><img src="image_source_url"></code>
|
||||
<br>
|
||||
HTML is closely linked with CSS and JavaScript; a comment in HTML is started with
|
||||
<code><!--</code> and ended with <code>--></code>.
|
||||
</p>
|
||||
16
computer-science-blog/pages/js.html
Normal file
16
computer-science-blog/pages/js.html
Normal file
@@ -0,0 +1,16 @@
|
||||
<!-- Reading School 2018, HTML page by Matthew Grove, Year 10 -->
|
||||
<h2>JavaScript</h2>
|
||||
<p>
|
||||
JavaScript (JS) is a high-level, client-side language, meaning that it is like a human language
|
||||
(rather than, for example, binary) and runs on the end user's computer. It is used for many purposes,
|
||||
including editing content on a webpage, performing mathematical operations and storing variables.
|
||||
Each line of JavaScript should end in a semicolon, for example:
|
||||
<br>
|
||||
<code>
|
||||
// this code sets the content of the element with the ID "id_name" to "Hello World!"<br>
|
||||
document.getElementById("id_name").innerHTML = "Hello World!";
|
||||
</code>
|
||||
<br>
|
||||
A single line comment in JS is denoted by a double forward slash (<code>//</code>); a multi line comment
|
||||
is started with <code>/*</code> and ended with <code>*/</code>.
|
||||
</p>
|
||||
Reference in New Issue
Block a user