Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
May 24, 2021 08:10 pm GMT

DAY 2 of Coding Challenge! Forms and Ugly Tables

I'm very proud to say that I've written some of my first lines of code and drawn what I would say is a verryyy ugly chart. These concepts were easier to understand so I am very excited to start making these pages look spruced up with CSS! Even more importantly is the form infomation set to one day send to servers once it can be linked to Javascript

Table Notes:

thead: semantically represents the header info of the table (categories to a table)

tbody: semantically represents the body info of the table (the input info)

tr: table row

th: placed for each cell

rowspan: an attribute to manipulate how many rows the info will be between. Standard set to "1"

colspan: an attribute to manipulate how many columns the info will be between. Standard set to "1"
Code:

Alt Text

Result:
Alt Text

Forms:

button: Setting a button inside of a form will allow you to submit the form

input: this sets what type and category of info will be sent to the server
type: what kind of data is this? (i.e. text, password, color,
etc.)
id: specific to this one input. Only one named ID used per
input
name: names the form sent

label: labels the input and links it with the for attribute connected to the same input ID.

code:

Alt Text

result:

Alt Text


Original Link: https://dev.to/nerdeye/day-2-of-coding-challenge-forms-and-terrible-tables-j28

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To