This, background's on fi-yaaaaaaaa! ♫

   I did it! I have a background! Whee!

    It took a bit of trial and error and a few google searches but I have a background that fills the screen. I took the original image, cartoonified it, cropped it into a wide image and voila.


Screenshot of webpage in full screen:

A website background containing a cartoon image of a campfire at night


    I will probably have to fiddle with the sizing a bit more when I upload characters to lay over it, but I'm kind of proud of just this baby step. My frustration tolerance was below 0 today so I think I did well to get this done.

    Next up, I need to add a text box for users to enter their name/username. I think I'll put it at the bottom, under the fire, with the characters in various poses to the right and left of the flames. I said 5 characters, but I might cut it to 4 for even numbers. And it's probably less important right now, I can add more details later. Must remember not to get sucked into details!

    Also, I came up with a way to remember the syntax needed for CSS ruleset selectors for class and id:

.class : You take classes at certain 'periods' at school. 

#id : ID 'number'.

    Overall, today I did not suck. I'm calling this a win.


Link to HTML code

Link to CSS code

Comments

Post a Comment

Popular posts from this blog

A little less complicated, a little more coding, please. ♫

          Okay, so selecting an individual character is going to be pushed back to the "add later" pile.     As of now, I have an image to use as the background (an amazing campfire photo) and a "cartooned" version of it. I will study how they both look once I have rough images of the characters to add, but I imagine it will look more visually blended if I don't have sketches laid over real life backgrounds.     I need to figure out how to make the image fill the whole screen but remain centred, so that's task one. I haven't finished HTML lessons yet, and I believe CSS is needed to complete this task, so for the time being it's back to studying for me.
Read more

New Blog, who this?

Okay. First blog. So, future me, let's create "Dungeon Code".      Brief outline (because your memory is atrocious): Dungeon Code will be an interactive game of sorts, inspired heavily by your love of Critical Role and fantasy. Because you struggle with concentration, and therefore staying focused on learning, this will hopefully be something you can work on to implement what you've learned and cement the knowledge in your brain, and make remembering coding languages a lot easier (and fun). Dungeon Code will be a set up of fantasy characters, namely a group of 4 alongside the main character (the user). As you are known to go off on tangents and focus too heavily on the details before creating the main skeleton of the beast, the focus will be on how each lesson in a language (Python, being as that's what you learned first) can be implemented as an element in the fantasy. One quick example: spells. For a spellcasting character, they would need components to cast
Read more

Rough draft

  Home page:     Something to visually introduce the characters and set the tone for what the website is about. (Fantasy, adventure, etc) Maybe a campfire, night setting with the characters gathered around the flames with their armour and weapons.     A welcome message and a text box for "players" to input their name.     A selection process after a name is entered, where users can chose a character. Cycle through choices? Backstories? All details to add once the skeleton design is made. Can't get too hung up on these details just yet. Next page:     A dialogue scene. Maybe the user is new to the group and there's some back and forth about the groups destination. Maybe try to implement a response by having the user print() some dialogue. To make it match the dialogue and semi-script, the answers should be pre-chosen and the user has to insert them into a print() statement, like games with multiple choice interaction. Too complicated to do unique responses to different
Read more