Photobucket
Today I took the advice I read last week that nothing is better than just jumping into playing with coding. This CSS tutorial recommended by Wil Laveist is a great start for beginners like me. After working through the first four modules, I succeeded in getting coding into my browser and adjusting the style. This is the me who did not know before tonight how to get coding into a browser let alone how to code. Thank you, Mozilla Developer Network for your excellent beginner's guide -- you have me feeling like a real Stage 2 Programmer!
So what did I program? I started with example HTML code. To make this one sentence, I learned how to use my HTMLKit software, how to save an HTML file, and how to open an HTML file in my Firefox browser. I squealed with glee when I saw this page appear -- my own code in a browser for all ... well, for me ... to see!
Next, I added the stylesheet file. In doing this, I learned that CSS can be written as a separate .CSS file and linked to the .HTML file. I had thought CSS always went into the HTML code itself, but I can see why having a separate file would help keep things clean. If your coding is having problems, identify it as content or style, and you know where to go. I added example CSS code to my newly created .CSS file, added the link code to my .HTML file, and clicked refresh. And do you know what happened?? My first letters turned red -- just like that! Nothing new to upload -- the file in my browser talked right to my coding files. Wow.
So what did I program? I started with example HTML code. To make this one sentence, I learned how to use my HTMLKit software, how to save an HTML file, and how to open an HTML file in my Firefox browser. I squealed with glee when I saw this page appear -- my own code in a browser for all ... well, for me ... to see!
Next, I added the stylesheet file. In doing this, I learned that CSS can be written as a separate .CSS file and linked to the .HTML file. I had thought CSS always went into the HTML code itself, but I can see why having a separate file would help keep things clean. If your coding is having problems, identify it as content or style, and you know where to go. I added example CSS code to my newly created .CSS file, added the link code to my .HTML file, and clicked refresh. And do you know what happened?? My first letters turned red -- just like that! Nothing new to upload -- the file in my browser talked right to my coding files. Wow.
I then took my final step of trying to do a line of CSS programming myself. I took their example which underlined the entire phrase (they had this in the parent section of code), and I moved it to underline only the first letters by putting it into the strong DOM. My husband has officially deemed me crazy because I started clapping for my computer and it's amazing three little underlines.
Next week, I will pick up with this same tutorial and get into writing my own CSS code versus copying and adapting example code. CSS Explorer Nobles signing off for tonight.
Time Spent: 1 hour
Next week, I will pick up with this same tutorial and get into writing my own CSS code versus copying and adapting example code. CSS Explorer Nobles signing off for tonight.
Time Spent: 1 hour
No comments:
Post a Comment