Lab#10 and 11

These two labs were the first labs in which it was required to include CSS( Cascading Style Sheet) in the code. CSS is used to decorate and design the webpage; the background color, font family, and other properties can be included in the code to style the webpages. HTML is the basic structure or foundation of a webpage and CSS is more like clothing of the webpage. With this in mind there is a different layout/rules when using CSS. Actually there are multiple ways of using CSS: internal, inline, and external. For lab 10 we used internal and for lab 11 we used external.

Lab 10 was overall just taking an html document and adding CSS to different tags using an internal method. To do so we had to add a <style> tag in the heading which is used to differentiate what is CSS from HTML. Within the style tag there must be a selector, in other words there you must select the tag which you want to edit by just putting the name without any brackets. Then there must be a curly bracket {} and next there must be a property stated, this could be font family or color. After the property there must be a colon which sets off the parameter or value in which the property is taking and to finish the action a semicolon has to be put. An example of internal CSS can be seen below.


Lab 11 is only different in that a separate file holds all the CSS information. This can be easily done by creating a new CSS file and linking it to the HTML file using the <link> tag. Since it is a CSS document there is no need for a <style> tag. The CSS for lab 10 and 11 are the same. An example of an external CSS file can be seen below.

 The purpose of these labs was to get a basic practice of implementing CSS into HTML files in multiple ways. These skills can be useful when wanted to design webpages in a much more complex and decorative way in order to not have a bland page with only black and white. I see myself using these skills in the future when designing other webpages including projects and other labs.



Comments

Post a Comment

Popular posts from this blog

Lab4-Color Table

Image
The directions for lab 4 was to create a table made up of hues and the corresponding hexadecimal value for the hue. In order to complete this lab a new HTML tag was introduced, the <table> tag which creates a table. however that isn't the only tag necessary to complete the lab we also needed to use the <tr> and <td> tags. tr signified a row on the table and td signified a row in the table; with all three tags we could create and manipulate a table into what we needed. The actual table we created consisted of three columns and twenty rows. The three columns are the color name, hexadecimal value, and the actual hue. Each row had a different hue and the first row is the titles for the columns. We didn't have regular colors, such as red or blue, we had absurd hues that had names you only see on crayons like Dark Magneta and Midnight Blue. Of course we didn't know the hexadecimal value of the hues; therefore we used w3schools to search up the values, it had it
Read more

Lab16: My First JavaScript

Image
This lab was the very first time we implemented JavaScript into our webpages. While we have been practicing JavaScript on code.org, that was the only platform we used. Now for the first time our website have HTML, CSS, and JavaScript. It may not be complex JavaScript, but it is a small step as an introduction. The lab was just create a button that when pressed would change the contents of the paragraph written. We also create a base format for our webpages so wouldn't have to keep repeating the same long process of writing the basic html codes. The button was quite easy to create because all that was needed to be done was to create a button tag inside a script tag. The script tag specifies that whatever inside the tag is pure JavaScript and the button tag is exactly was the name entities, a button. It was small step, but I suppose we will build off these skills until we eventually get into complex JavaScript.
Read more

MLH Local Hack Day 2017

Image
This past Saturday, December 2, Queens College hosted a local hackathon on their campus. As a student currently enrolled in a computer science class it was a great opportunity for me and other classmates to learn and showcase our skills. Walking into the hackathon was a little bit daunting because most if not all the participants were college students except for me and the other people from my class that also attended. However, once the actual event began I didn't feel out of place, on the contrary the people where very nice and welcomed me even though I was very young. The first secession/activity was a sort of free learning hour where we had the freedom of doing whatever we wanted. The organizers gave us a link to the MLH website and there were multiple activities that we were able to do, but they all involved programs that I was unfamiliar with and they all were very complex. Therefore, it was basically an hour of just learning what different programs did and the basic commands
Read more