Масштабирование изображений - тег <img>

@AVATAR · Регистрация: 27.07.2014

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

HTML5

1
2

<img src="https://www.cyberforum.ru/images/Boot Menu.JPG" alt="Запущенный Boot Menu"
width="571" height="287" title="Изображение - Запущенный Boot Menu" align="middle"/>

У меня возникла проблемка, при масштабирование страницы, то есть когда уменьшаем размер окна браузера, страница сжимается, но изображение не масштабируется, так как имеет фиксированный размер в пикселях. Это можно поправить как то средствами Dreamweaver ? может чтоб он сам пиксели ставил если можно или еще как то...

@rikimaru2013 · 18.08.2014, 21:51

HTML5

1	width="50%"

1. Будет всегда 50% от родительского контейнера. Дайте ссылку на страницу на вашем хостинге, на примере объясню о чем я.
2. Dreamweaver тут вообще не причём. Не используйте его лучше (((( Notepad++ с снипетами рулит.

@AVATAR · 18.08.2014, 21:54 **[ТС]**

Я его только начал создавать, у меня пока только локальная версия

Dreamweaver я использую только потому, что я сделал макет страницы(шаблон) и по шаблону создаю страницы, чтобы при изменение дизайна, программа сама обновляла его по всем страницам) не вручную же менять ссылку меню к примеру на 50 страницах ?!
Сам сайт на блока div - с СSS форматированием

@KlassT · 18.08.2014, 22:01

Сообщение от AVATAR

<img src="https://www.cyberforum.ru/images/Boot Menu.JPG" alt="Запущенный Boot Menu
" width="571" height="287" title="Изображение - Запущенный Boot Menu" align="middle"/>
У меня возникла проблемка, при масштабирование страницы, то есть когда уменьшаем размер окна браузера, страница сжимается, но изображение не масштабируется, так как имеет фиксированный размер в пикселях. Это можно поправить как то средствами Dreamweaver ? может чтоб он сам пиксели ставил если можно или еще как то...

Можно вот так:
Задаём класс изображению, но не пишем ширину и высоту

HTML5

1 2	<img src="https://www.cyberforum.ru/images/Boot Menu.JPG" alt="Запущенный Boot Menu " title="Изображение - Запущенный Boot Menu" align="center" class="img-test" />

И задаём такие стили:

CSS

.img-test {
    max-width: 571px;
    max-height: 287px;
    width: 100%;
    height: auto;
}

Добавлено через 56 секунд

Сообщение от AVATAR

<img src="https://www.cyberforum.ru/images/Boot Menu.JPG" alt="Запущенный Boot Menu
" width="571" height="287" title="Изображение - Запущенный Boot Menu" align="middle"/>
У меня возникла проблемка, при масштабирование страницы, то есть когда уменьшаем размер окна браузера, страница сжимается, но изображение не масштабируется, так как имеет фиксированный размер в пикселях. Это можно поправить как то средствами Dreamweaver ? может чтоб он сам пиксели ставил если можно или еще как то...

И да, я поправил немного. У align нет параметра middle. Есть center. middle у valign

@rikimaru2013 · 18.08.2014, 22:05

1. Установите Denwer. ( джентельменский набор )
2. Пишите php файлы.

Пример любого сайта (принцип "подключаемых" блоков):

PHP

//index.php
 
<?php include "header.php"; ?>
 
Я главная страница!
 
<?php include "footer.php"; ?>

PHP

// header.php
 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>title</title>
    <link rel="stylesheet" href="css/style.css">
    <script src="js/script.js"></script>
  </head>
  <body>
  <div class="context">

PHP

// footer.php
</div>
  </body>
</html>

PHP

//some.php
 
<?php include "header.php"; ?>
 
Я любая другая страница!
 
<?php include "footer.php"; ?>

@AVATAR · 18.08.2014, 22:09 **[ТС]**

Разобрался, спасибо! Насчет блоков, а это тоже самое что и фреймы или это уже другое ? Если другое, то в чем отличие использование подключений частей сайта через php и стандартных фремов html ?

@rikimaru2013 · 18.08.2014, 22:29

Какие-то старые у вас учебники) Забудьте про фреймы раз и навсегда и не используйте их. Они использвались еще при Windows 95. Фрейм - это страница внутри страницы. Сейчас это даже звучит бредово )

Код фрейма такой:

HTML5

<html>
<head>
...
</head>
<body>
...
<iframe ...>
...
</body>
</html>

Отображается пользователю так:

HTML5

<html>
<head>
...
</head>
<body>
...
          <html>
          <head>
              ...
          </head>
          <body>
              ...          
          </body>
          </html>
...
</body>
</html>

Правда ж бред?) Ну тогда делали так. Сейчас уже лет 10 как забыли про это как страшный сон.

Чтобы понять блочный способ, надо понять, что такое php файлы.

1) На сервере лежат html файлы - при запросе http://www.site.com/privet.html. Серверищет в корне этот файл и "тупо" отдаёт по протоколу http файл.
2) Если же запрос http://www.site.com/privet.php - сервер ищет файл privet.php, читает его на наличие PHP кода и обрабатывает его (подстановка переменных, инлюды, операции и бла бла бла).

Чтобы понять что за функция include - Надо ввести в гугле "include php" и сразу будет ссылка на описание этой функции. И по описании понятно, что include "header.php" ищет этот файл, выполняет его и возращает в точку вызова. Пример:

PHP

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>title</title>
    <link rel="stylesheet" href="css/style.css">
    <script src="js/script.js"></script>
  </head>
  <body>
    <?php include "1.php"; ?>
  </body>
</html>

PHP

1	dfgdfgdfgdfgf

Покажет в браузере просто:

PHP

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>title</title>
    <link rel="stylesheet" href="css/style.css">
    <script src="js/script.js"></script>
  </head>
  <body>
    dfgdfgdfgdfgf
  </body>
</html>

То, что данная страница перед выводом обрабатывалась пользователь даже не узнает. Для него это обычная html страница.

P.S. Погуглите GET PHP параметры страницы - эти статьи откроют вам первые прелести php файлов, и поймете зачем на сайтах видеофайлов ссылки site.com/page1/

@МилокМурлыка · 19.08.2014, 11:41

Сообщение от rikimaru2013

Чтобы понять что за функция include - Надо ввести в гугле "include php" и сразу будет ссылка на описание этой функции. И по описании понятно, что include "header.php" ищет этот файл, выполняет его и возращает в точку вызова.

PHP нужно начинать учить с основ, include потенциально опасная функция. include + $_GET и сайт готов к заражению...

@AVATAR 10 / 10 / 6 Регистрация: 27.07.2014 Сообщений: 269
	18.08.2014, 21:54 [ТС]	3
	Я его только начал создавать, у меня пока только локальная версия Dreamweaver я использую только потому, что я сделал макет страницы(шаблон) и по шаблону создаю страницы, чтобы при изменение дизайна, программа сама обновляла его по всем страницам) не вручную же менять ссылку меню к примеру на 50 страницах ?! Сам сайт на блока div - с СSS форматированием 0

@AVATAR 10 / 10 / 6 Регистрация: 27.07.2014 Сообщений: 269
	18.08.2014, 22:09 [ТС]	6
	Разобрался, спасибо! Насчет блоков, а это тоже самое что и фреймы или это уже другое ? Если другое, то в чем отличие использование подключений частей сайта через php и стандартных фремов html ? 0

@МилокМурлыка 50 / 50 / 15 Регистрация: 25.04.2014 Сообщений: 106
	19.08.2014, 11:41	8
	Сообщение от rikimaru2013 Чтобы понять что за функция include - Надо ввести в гугле "include php" и сразу будет ссылка на описание этой функции. И по описании понятно, что include "header.php" ищет этот файл, выполняет его и возращает в точку вызова. PHP нужно начинать учить с основ, include потенциально опасная функция. include + $_GET и сайт готов к заражению... 1

Масштабирование изображений - тег <img>

Решение