-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
116 lines (81 loc) · 4.26 KB
/
index.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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<html lang="en">
<head>
<meta charset="utf-8">
<title>Image Search</title>
<meta name="viewport" content="width=device-width, inital-scale=1">
<link rel="shortcut icon" type="image/png" href="images/8K.png"/>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<!-- This is a search form that will take us to
https://www.google.com/search?tbm=isch&tbs=isz:ex,iszw:7680,iszh:4320&q=example
when we search for 𝚎𝚡𝚊𝚖𝚙𝚕𝚎. This search will show us only images, and
those images will all be 7680 pixels wide and 4320 pixels tall.
First we enclose everything in a <𝚏𝚘𝚛𝚖> whose 𝚊𝚌𝚝𝚒𝚘𝚗 is everything that
the search engine results page’s URI to the left of the question mark (?)
in it -->
<div class="main">
<div class="container">
<div class="logo">
<img src="images/witch.png">
</div>
<div class="search-form">
<form action="https://www.google.com/search" method="get" autocomplete="off">
<!-- Next, we add the arguments that are added to the Google URI. For each
part of the URI we want to build, we need an <𝚒𝚗𝚙𝚞𝚝> element with a
𝚟𝚊𝚕𝚞𝚎 attribute. -->
<!-- build 𝚝𝚋𝚖=𝚒𝚜𝚌𝚑 -->
<!-- 𝚝𝚋𝚖 needs to be set to 𝚒𝚜𝚌𝚑, which tells Google we want only
image search results. We add 𝚝𝚢𝚙𝚎="𝚑𝚒𝚍𝚍𝚎𝚗" to the input element
because we don’t want the end user to have to choose that
themself -->
<input name="tbm" value="isch" type="hidden">
<!-- build 𝚝𝚋𝚜=𝚒𝚜𝚣:𝚎𝚡,𝚒𝚜𝚣𝚠:𝟽𝟼𝟾𝟶,𝚒𝚜𝚣𝚑:𝟺𝟹𝟸𝟶 -->
<!-- 𝚝𝚋𝚜 needs to be set to a three-part parameter that tells Google
we’re doing a search for images of a certain size and what the
dimensions we’re looking for are -->
<input name="tbs" value="isz:ex,iszw:7680,iszh:4320" type="hidden">
<!-- build 𝚚=𝚎𝚡𝚊𝚖𝚙𝚕𝚎 (but ours won’t specify "example" — the user
will decide what to search for). This parameter’s 𝚝𝚢𝚙𝚎 is
not 𝚑𝚒𝚍𝚍𝚎𝚗 but rather 𝚝𝚎𝚡𝚝, which is what we’ll ask the user to
enter. -->
<!-- If we don’t want to prompt our users’ imaginations,
we could remove 𝚙𝚕𝚊𝚌𝚎𝚑𝚘𝚕𝚍𝚎𝚛="𝚙𝚞𝚙𝚙𝚒𝚎𝚜" -->
<!-- 𝚜𝚒𝚣𝚎="𝟹𝟻" means that the field where the user will input their
query is about 35 characters wide on page load -->
<div class="search">
<img src="images/loupe.svg">
<input name="q" size="35" type="text" placeholder="Search image">
</div>
<!-- Finally, we add the button the user can tap to enter their query,
so our 𝚝𝚢𝚙𝚎 is 𝚜𝚞𝚋𝚖𝚒𝚝. We can set our value to whatever we want
our button to say -->
<div class="submit">
<input type="submit" value="Find 8K images">
</div>
<!-- <𝚏𝚘𝚛𝚖> is the only element we have used that we must close -->
</form>
</div>
<div class="serach-for">
<p>or search for</p>
<div class="links">
<span>
<a href="4k.html">4K images</a> |
<a href="index.html">8K images</a> |
<a href="10k.html">10K images</a> </span> <span id="hide"> | </span>
<span>
<a href="16k.html">16K images</a> |
<a href="64.html">64 × 64 sized images</a> </span></span> <span id="hide"> | </span>
<span><a href="mobile_images.html">mobile walpapers</a></span>
</div>
<div class="links links-2">
<a href="custom_size.html">
or search images with your own height and width</a>
</div>
</div>
</div>
</div>
<!-- <fieldset style="width:15%"><legend>Redirects to the other pages</legend><p><a href="http://4k.rf.gd">4k.rf.gd</a></br><a href="http://8k.rf.gd">8k.rf.gd</a></br><a href="http://10k.rf.gd">10k.rf.gd</a>
</br><a href="http://16k.rf.gd">16k.rf.gd</a></p></fieldset> -->
</body>
</html>