Skip to content

Commit b091bfa

Browse files
committed
final version with correction
1 parent 4c7d762 commit b091bfa

3 files changed

Lines changed: 64 additions & 46 deletions

File tree

Form-Controls/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<meta charset="utf-8" />
77
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
88
<title>My form control</title>
9-
<link rel="stylesheet" href="style.css"/>
9+
<link rel="stylesheet" href="style1.css"/>
1010
<meta name="description" content="F" />
1111
<meta name="viewport" content="width=device-width, initial-scale=1" />
1212
</head>

Form-Controls/style.css

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
user
2+
allow/*
3+
{
4+
box-sizing: border-box;
5+
}
16
header {
27
background-color: #17d0ba75;
38
color: white;

Wireframe/index.html

Lines changed: 58 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,60 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="UTF-8" />
5-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6-
<title>Wireframe</title>
7-
<link rel="stylesheet" href="style.css" />
8-
</head>
9-
<body>
10-
<header>
11-
<h1>Wireframe</h1>
12-
<p>
13-
Articles </p>
14-
</header>
15-
<main>
16-
<article id="What is the purpose of a Readme file?>
17-
<img src="https://utrechtuniversity.github.io/workshop-computational-reproducibility/chapters/readme-files.html
18-
" alt=" " />
19-
<h2>A</h2>
20-
<p>
21-
A README file is a text document which provides a clear and concise description of all relevant details about data collection, processing, analysis, and naming convention. It should be easy to write and easy to read in order to be understandable by yourself and others in the future.
22-
23-
</p>
24-
<a href=" ">Read more</a></article>
25-
<article id="article2">
26-
<img src=</h2>
27-
<p>
28-
29-
</p>
30-
<a href=" ">Read more</a>
31-
</article>
32-
<article id="article3">
33-
<img src=" alt="" />
34-
<h2> </h2>
35-
<p>
36-
</p>
37-
<a href" "
38-
Read more</a>
39-
</article>
40-
</main>
41-
<footer>
42-
<p>
43-
Wireframe project by Mandip Sanger. This project is a simple demonstration of how to create a wireframe for a website using HTML and CSS.
44-
</p>
45-
</footer>
46-
</body>
47-
</html>
3+
4+
<head>
5+
<meta charset="utf-8" />
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
7+
<title>My form control</title>
8+
9+
<meta name="description" content="F" />
10+
<meta name="viewport" content="width=device-width, initial-scale=1" />
11+
<link rel="stylesheet" href="style.css"/>
12+
</head>
13+
<body>
14+
<header>
15+
<h1></h1>
16+
</header>
17+
<main>
18+
<form >
19+
<div>
20+
<label for="name">Name:</label>
21+
<input type="text" id="name" name="name"
22+
pattern="^\s*(\S\s*){2,}$" />
23+
</div>
24+
25+
<div>
26+
<label for="email">Email:</label>
27+
<input type="email" id="email" name="email" />
28+
</div>
29+
30+
<fieldset>
31+
<legend>Please select your color</legend>
32+
33+
<input type="radio" id="black" name="color" value="Black">
34+
<label for="black">Black</label>
35+
36+
<input type="radio" id="beige" name="color" value="Beige">
37+
<label for="beige">Beige</label>
38+
39+
<input type="radio" id="red" name="color" value="Red">
40+
<label for="red">Red</label>
41+
</fieldset>
42+
43+
<div>
44+
<p>Please select a size</p>
45+
46+
<label for="size">Choose a size:</label>
47+
<select name="size" id="size">
48+
<option value="xs">Extra Small</option>
49+
<option value="small">Small</option>
50+
<option value="medium">Medium</option>
51+
<option value="large">Large</option>
52+
</select>
53+
</div>
54+
55+
<input type="submit" value="Submit">
56+
</form>
57+
</main>
58+
<footer>From control by Mandip sanger</footer>
59+
</body>
60+
</html>

0 commit comments

Comments
 (0)