forked from ufxela/daily-tech-wksh-asst1
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathstep6.html
53 lines (43 loc) · 2.23 KB
/
step6.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<!-- Step 6: Input is key! -->
<!-- In this step, we'll learn about inputs. Inputs are super important for user interaction! -->
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="step6.css">
</head>
<body>
<h1 id="the_title">So you wanna set up a Stanford Daily email newsletter?</h1>
<div id="featured_fields3">
<span>Featured content headline</span>
<!-- Step 6.1
This is a text area! What is a text area? How is it styled?
You may be thinking right now: with a text area, a user can input
text, but how can my program get the text that the user inputs?
Don't worry about that for now--we'll get to it soon!
-->
<textarea></textarea>
<!-- Step 6.2
We're so close to creating the "look" of a real form that Stanford Daily
editors are using to generate our newsletters! But our newsletter would be a bit
empty if we just had a headline. Add textarea inputs and span labels to prompt
the user of our website for "Featured content author name(s)", "Featured content link"
"Featured content image link", "Featured content image alt text (should describe photo in case it cannot be seen)",
and "Featured content excerpt"! Feel free to add any other sections if you feel like it too!
Also remember to add CSS styling to everything, so it looks pretty! You can also look into the <br>
element as another way to add vertical whitespace.
-->
</div>
<!-- Step 6.3
This is a button! What is a button? What is "onclick"? Are there other attributes
which we can add to a button?
https://www.w3schools.com/html/html_attributes.asp
https://www.w3schools.com/jsref/event_onclick.asp
Right now, you might notice that we're "setting" onclick to be a string, "alert('This is an Alert!')".
This string is actually Javascript code that is executed when we click the button. Don't worry
if you don't know any Javascript right now--we'll be covering it soon!
Can you change the message the Alert popup displays?
Can you add styling to your button?
-->
<button onclick="alert('This is an Alert!')">Submit all changes</button>
</body>
</html>