• We are STAs
    • Adriana Hermoza
    • Carrie Wang
    • Isaiah Thomas
    • Leilani Cabello
    • Lila Mali
    • Lorena Chiles
    • Luisa Matzner
    • Marissa Devivar
    • Princeton Tran
    • Thang Truong
  • We were STAs
  • STA Presentation
    • STA Presentation 2017
    • STA Presentation 2016
  • Testimonials
  • Resources
  • Home

STA Blog

Week 2

January 20, 2023 By Daniela Caballero

Week 2

Training: HTML/CSS Basic Training

 

Started on: January 17, 2023

Completed on: January 19, 2023

STA Guidance: Thang Truong

Description: In this training I learned the basics of HTML/CSS. HTML (Hyper Text Markup Language) is responsible for all the text we see on websites and CSS (Cascading Style Sheets) is used to add style and color. To freshen up my skills with CSS and HTML I did a training that required me to create a single-page website including three rules from the STA handbook.

 

HTML: Starting off with HTML, there are two general components to a website layout written in HTML. These are the head and the body. The head includes metadata about the page and the body is where all the text and element actually seen on the page are added. In HTML, the best way to separate different elements is by using a <div> or a container for other div types, headers, paragraphs, images, etc. I was able to center the header and STA rules in the center of the page by placing them all in the same div.

 

CSS: Working with CSS was definitely my favorite part of this training since there are so many properties to work with and ways to style a webpage. In order add CSS style properties to the elements and text found in an HTML, a class or id type must be added to the HTML element it order to reference it in the CSS file. All the white boxes (divs) about the rules on the page I created are tagged with the class “rule”.  In the CSS I referenced the “rule” class (this is also called using a selector!) and added the properties such as the font type, size, color and space to style it as seen below. Another thing about CSS is that it can used to dynamically change the sizing of some elements! By using percentages instead of fixed values for the width and height of divs, the text and images will increase and decrease in size proportionally to the browser window.

 

Link to the page

Filed Under: Fall 2022 - Spring 2023, We are STAs

link to LAITS home page

Video STA Home

© 2023 Liberal Arts Instructional Technology Services | Production Credits