С Новым годом! Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.75/4: Рейтинг темы: голосов - 4, средняя оценка - 4.75
0 / 0 / 0
Регистрация: 25.12.2020
Сообщений: 30

Форма подачи заявки на поступление

15.06.2022, 12:07. Показов 818. Ответов 3

Студворк — интернет-сервис помощи студентам
Помогите, пожалуйста, сверстать форму подачи заявления на поступление в школу, очень срочно! Пожалуйста!
Мой код:
HTML5
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
<!DOCTYPE html>
<html lang="ru">
 
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
    <link rel="stylesheet" href="css/main-page.css">
    <link rel="icon" href="assets/images/fav.png">
    
 
    <title>Школа</title>
</head>
<body>
    <!-- Шапка -->
 
    <header class="header">
        <div class="container">
            <div class="header-inner">
                <div class="header-logo">
                    Школа
                </div>
                    <nav class="nav">
                        <a class="nav-link" href="main-page.html">Главная</a>
                        <a class="nav-link" href="about.html">Сведения об образовательной организации</a>
                        <a class="nav-link" href="education.html">Образовательная деятельность</a>
                        <a class="nav-link" href="for-students.html">Ученикам</a>
                        <a class="nav-link" href="for-parents.html">Родителям</a>
                        <a class="nav-link" href="contacts.html">Контакты</a>
                    </nav>
            </div>
        </div>
    </header>
 
    <!-- Интро -->
 
    <div class="intro">
        <div class="intro-container">
            <div class="intro-inner">
                <h1 class="intro-title">Мы даем только лучшее образование</h1>
                <h2 class="intro-subtitle">Лучшие учителя помогут тебе найти путь в жизни</h2>
                <a class="btn  btn--red" href="#JoinUs">Поступить к нам</a>
            </div>
        </div>
    </div>
 
    <!--Новости-->
 
<div class="title">События</div>
 
<div class="news-container">
    <div class="grid">
 
        <div class="card"> <!--first-news.html  -->
            <div class="card_img">
                <img src="assets/images/army.jpg" alt="юная армия">
            </div>
            <div class="card_body">
                <h2 class="card_title">Юная армия</h2>
                <p>Наша юная армия подняла флаг РФ. Теперь такая практика будет проходить каждый понедельник.</p>
                <a href="first-news.html" class="read_more">Подробнее</a>
            </div>
        </div>
 
        <div class="card"> <!--second-news.html -->
            <div class="card_img">
                <img src="assets/images/oge.jpg" alt="огэ">
            </div>
            <div class="card_body">
                <h2 class="card_title">ОГЭ</h2>
                <p>Наступила пора сдавать ОГЭ. Все девятиклассники проверят свои знания и по  желанию поступят в 10 класс.</p>
                <a href="second-news.html" class="read_more">Подробнее</a>
            </div>
        </div>
 
        <div class="card"> <!--third-news.html -->
            <div class="card_img">
                <img src="assets/images/EGE.jpg" alt="ЕГЭ">
            </div>
            <div class="card_body">
                <h2 class="card_title">ЕГЭ</h2>
                <p>В жизни одиннадцатиклассников наступила пора проверки своих знаний.</p>
                <a href="third-news.html" class="read_more">Подробнее</a>
            </div>
        </div>
    </div>
</div>
 
    <!--Поступить к нам-->
 
    <div class="form-title">Поступить к нам</div>
 
 
 
</body>
</html>
CSS Код:
Code
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
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
html {
    font-family: 'Tantular', sans-serif;
 
    color: #fff;
 
    scroll-behavior: smooth;
}
 
*,
*::before,
*::after {
    box-sizing: border-box;
}
 
h1, h2, h3, h4, h5, h6 {
    margin: 0;
}
 
p {
    margin: 0 0 10px;
}
 
 
body {
    margin: 0px;
    padding: 0px;
 
    -webkit-font-smoothing: antialiased;
}
 
::-webkit-scrollbar {
    width: 5px;
}
 
::-webkit-scrollbar-thumb {
    background: #B22222;
}
 
 
/* Шапка */
 
.header {
    position: absolute;
    top: 0;
    z-index: 1000;
    width: 100%;
}
 
 
.container {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
}
 
.header-logo {
    font-size: 30px;
    color: #fff;
}
 
.header-inner {
    display: flex;
    justify-content: space-between;
 
    align-items: center;
 
    padding: 15px 0;
 
    border-bottom: 1px solid rgb(255, 255, 255);
}
 
.nav {
    font-size: 13px;
    text-transform: uppercase;
}
 
.nav-link {
    text-decoration: none;
    color: #fff;
    margin-left: 25px;
}
 
.nav-link:hover {
    text-decoration: underline;
}
 
/* Интро */
 
.intro {
    height: 1017px;
    background: url(../assets/images/mac.jpg) center no-repeat;
 
    padding-top: 100px;
 
    justify-content: center;
    display: flex;
    flex-direction: column;
 
    text-align: center;
}
 
.intro-inner {
    width: 100%;
    max-width: 970px;
    margin: 0 auto;
}
 
.intro-title {
    margin: 0 0 30px;
 
    font-size: 65px;
    line-height: 1.1;
    font-weight: normal;
 
    text-transform: uppercase;
}
 
.intro-subtitle {
    margin-bottom: 60px;
 
    font-size: 22px;
    line-height: 1.5;
    font-weight: normal;
    
}
 
/* Кнопка btn */
 
.btn {
    display: inline-block;
    vertical-align: top;
    padding: 14px 40px;
 
    border-radius: 15px;
    border: 0;
 
    cursor: pointer;
 
    font-family: 'Tantular', sans-serif;
    color: #fff;
 
    text-transform: uppercase;
    text-decoration: none;
}
 
.btn--red{
    background-color: #B22222;
}
 
/* Новости */
 
.news-container {
    max-width: 70%;
    margin: 0 auto;
    height: 100%;
 
}
 
.title {
    text-align: center;
    color: #B22222;
    font-size: 55px;
 
    padding: 15px;
}
 
.grid {
    display: grid;
    grid-template-columns: 10fr 10fr 10fr;
    gap: 3%;
 
    margin: 1%;
}
 
.card {
    overflow: hidden;
 
    padding: 20px;
    border-radius: 30px;
 
    text-align: center;
 
    -moz-transition: all 1s ease-out;
    -o-transition: all 1s ease-out;
    -webkit-transition: all 1s ease-out;
}
 
.card:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
}
 
 
.card_img img {
    width: 100%;
    height: auto;
    border-radius: 20px;
}
 
.card_body {
    padding: 26px 20px 36px 20px;
}
 
.card_title {
    font-weight: 900;
 
    text-transform: uppercase;
 
    color: #000;
 
    font-size: 26px;
    padding-bottom: 20px;
}
 
.card_body p {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.7;
    color: #000;
 
}
 
.read_more {
    color: #FFF;
 
    text-decoration: none;
 
    letter-spacing: 1.1px;
 
    background: #B22222;
 
    margin-top: 50px;
    padding: 24px 0px;
    border-radius: 15px;
 
    display: inline-block;
    width: 70%;
}
 
/* Поступить к нам */
 
.form-title {
    text-align: center;
    color: #B22222;
    font-size: 55px;
 
    padding: 15px;
}
0
Лучшие ответы (1)
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
15.06.2022, 12:07
Ответы с готовыми решениями:

Форма заявки
Добрый день, может кто помочь ? нужна форма заявки (когда человек заполняет,то эта заявка приходит на почту мне) на этом сайте ...

Форма с фильтром Поступление продуктов
Здравствуйте. Загвоздка в форме Поступление продуктов. Делаю так: --в заголовке формы номер накладной вводится с клавиатуры ...

Форма подачи объявления
Здравствуйте. Помогите изменить стандартные поля и выпадающие списки в доске объявлений (так как чайник полный) так выглядит доска в...

3
33 / 28 / 6
Регистрация: 24.03.2020
Сообщений: 219
15.06.2022, 21:33
А отправлять данные с формы куда и как собираетесь?? Кто-то через <form> делает, а кто-то <div id="form"> и собирает с инпутов по id значения.
0
0 / 0 / 0
Регистрация: 25.12.2020
Сообщений: 30
16.06.2022, 15:16  [ТС]
Komandor_Yan, Я забыл описать принцип работы формы: пользователь нажимает одну кнопку и скачивается бланк, он заполняет его и загружает на сайт черех другую кнопку и файл отправляется на почту организации.
0
33 / 28 / 6
Регистрация: 24.03.2020
Сообщений: 219
16.06.2022, 15:21
Лучший ответ Сообщение было отмечено Kroxis как решение

Решение

Kroxis, все равно понадобится инпут для файла.

Цитата Сообщение от Kroxis Посмотреть сообщение
пользователь нажимает одну кнопку и скачивается бланк, он заполняет его и загружает на сайт
А пользователь не сбежит, пока закончит заполнять Ваш бланк?

Цитата Сообщение от Kroxis Посмотреть сообщение
загружает на сайт черех другую кнопку и файл отправляется на почту организации
Может удобнее, чтобы пользователь сразу по своей почте отправлял на почту организации свой файл? Почто мучать сервер? Либо html-форма для заявления, либо тогда пусть скачивают файл, заполняют и сами отправляют. Можно во втором случае добавить кнопку с mailto:<ваш-адрес>.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
16.06.2022, 15:21
Помогаю со студенческими работами здесь

Форма заявки
нужна форма заявки типо вот этой https://www.cyberforum.ru/attachments/287014d1372267921

Форма заявки
Доброе утро форумчане. Столкнулся с такой проблемой, хочу на свой сайт добавить страничку с онлайн регистрацией на прием. все...

Форма заявки
Добрый день! Имеется такая вот форма заявки. Обязательно поле для заполнения - это телефон! Как изменить скрипт код, чтоб...

Форма заявки / JavaScript
Добрый вечер! Имеется такая вот форма заявки. Обязательно поле для заполнения - это телефон! Как изменить скрипт код, чтоб...

Форма отправки заявки
Добрый день, есть html код, который вызывает срабатывания php скрипта. &lt;button class=&quot;open-button&quot;...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
Модель микоризы: классовый агентный подход 3
anaschu 06.01.2026
aa0a7f55b50dd51c5ec569d2d10c54f6/ O1rJuneU_ls https:/ / vkvideo. ru/ video-115721503_456239114
Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR
ФедосеевПавел 06.01.2026
Owen Logic: О недопустимости использования связки «аналоговый ПИД» + RegKZR ВВЕДЕНИЕ Введу сокращения: аналоговый ПИД — ПИД регулятор с управляющим выходом в виде числа в диапазоне от 0% до. . .
Модель микоризы: классовый агентный подход 2
anaschu 06.01.2026
репозиторий https:/ / github. com/ shumilovas/ fungi ветка по-частям. коммит Create переделка под биомассу. txt вход sc, но sm считается внутри мицелия. кстати, обьем тоже должен там считаться. . . .
Расчёт токов в цепи постоянного тока
igorrr37 05.01.2026
/ * Дана цепь постоянного тока с сопротивлениями и напряжениями. Надо найти токи в ветвях. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа и решает её. Последовательность действий:. . .
Новый CodeBlocs. Версия 25.03
palva 04.01.2026
Оказывается, недавно вышла новая версия CodeBlocks за номером 25. 03. Когда-то давно я возился с только что вышедшей тогда версией 20. 03. С тех пор я давно снёс всё с компьютера и забыл. Теперь. . .
Модель микоризы: классовый агентный подход
anaschu 02.01.2026
Раньше это было два гриба и бактерия. Теперь три гриба, растение. И на уровне агентов добавится между грибами или бактериями взаимодействий. До того я пробовал подход через многомерные массивы,. . .
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост.
Programma_Boinc 28.12.2025
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / **********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / **********/ gallery/ bKBkQFf Пост отсюда. . .
Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США.
Programma_Boinc 26.12.2025
Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru