Вёрстка спойлера

@vicka12 · Регистрация: 23.10.2016

Студворк — интернет-сервис помощи студентам

Задание 2: Сначала на странице только текст стихотворения и кнопка с надписью «показать свечу». При нажатии на кнопку текст стихотворения прячется, на его месте появляется рисунок, и надпись на кнопке меняется на «показать текст». Если еще раз нажать на кнопку, рисунок исчезает и появляется текст. Текст cтихотворения (Анненский.doc) и рисунок (свеча1.gif) скопировать из сетевой папки. Параметры форматирования страницы:
 Цвет фона темно-синий, размер шрифта 22, курсив, цвет шрифта белый.
 Рамка вокруг текста: цвет #ffA089, тип outset, толщина 5.
 Картинка размером 200 на 200.
 Рамка вокруг картинки: цвет #ffA089, тип outset, толщина 50, отступы по 5.

@Azdeman · 23.10.2016, 18:39

И что? вы предлагаете нам сверстать?

@vicka12 · 23.10.2016, 21:29 **[ТС]**

Вот что сделала, но что-то я неправильно сделала

PHP/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
<head>
<style>
                body {background-color:#0000FF;color:white;}
        p{ width: 400px; height:550px; font-style:italic; font-size:22px; border-width: 5px;border-style:outset;border-color:#ffa089; } 
                img{width: 200px; height: 200px; border-width: 50px;border-style:outset;border-color:#ffa089;}
        </style>
<script>
function displ1(){
k=document.getElementsByTagName('p')
if (k.style.display=='none') {k.style.display='block'}
else {k.style.display=='none'}
function displ2(){
k=document.getElementsByTagName('img')
if (k.style.display=='none') {k.style.display='block'}
else{k.style.display=='none'}
}
</script>
</head>
 
<body>
<input type="button" value="Показать изображение" onclick="displ1();" ><br>
<input type="button" value="Показать текст" onclick="displ2();" ><br>
<h2>Иннокентий Анненский</h2>
<h1>СВЕЧКУ ВНЕСЛИ</h1>
<p>Не мерещится ль вам иногда,<br>
Когда сумерки ходят по дому,<br>
Тут же возле иная среда,<br>
Где живем мы совсем по-другому?<br>
<br>
С тенью тень там так мягко слилась,<br>
Там бывает такая минута,<br>
Что лучами незримыми глаз<br>
Мы уходим друг в друга как будто.<br><br>
 
И движеньем спугнуть этот миг<br>
Мы боимся, иль словом нарушить,<br>
Точно ухом кто возле приник,<br>
Заставляя далекое слушать.<br><br>
 
Но едва запылает свеча,<br>
Чуткий мир уступает без боя,<br>
Лишь из глаз по наклонам луча<br>
Тени в пламя сбегут голубое.<br>
</p>
<img src="свеча1.gif" />
<br />
</body>

Добавлено через 4 минуты
Где ошибка посмотрите пожалуйста. Код в теме.

@Зверушь · 24.10.2016, 12:12

JavaScript
1
2
if (k.style.display=='none') {k.style.display='block'}
else {k.style.display=='none'}

Что вы хотели этим сказать?
Открываем учебник и читаем про if else.
И изначаль скрываем элементы.

Новые блоги и статьи Все статьи Все блоги /
Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .	SDL3 для Web (WebAssembly): Работа со звуком через SDL3_mixer 8Observer8 08.02.2026 Содержание блога Пошагово создадим проект для загрузки звукового файла и воспроизведения звука с помощью библиотеки SDL3_mixer. Звук будет воспроизводиться по клику мышки по холсту на Desktop и по. . .

@vicka12 0 / 0 / 0 Регистрация: 23.10.2016 Сообщений: 9

	Вёрстка спойлера 23.10.2016, 02:13. Показов 1703. Ответов 3 Метки нет (Все метки) Задание 2: Сначала на странице только текст стихотворения и кнопка с надписью «показать свечу». При нажатии на кнопку текст стихотворения прячется, на его месте появляется рисунок, и надпись на кнопке меняется на «показать текст». Если еще раз нажать на кнопку, рисунок исчезает и появляется текст. Текст cтихотворения (Анненский.doc) и рисунок (свеча1.gif) скопировать из сетевой папки. Параметры форматирования страницы:  Цвет фона темно-синий, размер шрифта 22, курсив, цвет шрифта белый.  Рамка вокруг текста: цвет #ffA089, тип outset, толщина 5.  Картинка размером 200 на 200.  Рамка вокруг картинки: цвет #ffA089, тип outset, толщина 50, отступы по 5. 0

@Azdeman Фрилансер 1871 / 1362 / 604 Регистрация: 12.01.2011 Сообщений: 5,470
	23.10.2016, 18:39
	И что? вы предлагаете нам сверстать? 0