Методика обучения технологии web 2.0 на примере создания школьного сайта спортивной тематики
Педагогический анализ научных, учебных и педагогических аспектов методики обучения технологии web. Определение методических принципов построения работы и характеристика этапов процесса создания школьного сайта спортивной тематики по технологии web 2.0.
Рубрика | Педагогика |
Вид | дипломная работа |
Язык | русский |
Дата добавления | 23.04.2011 |
Размер файла | 247,0 K |
Отправить свою хорошую работу в базу знаний просто. Используйте форму, расположенную ниже
Студенты, аспиранты, молодые ученые, использующие базу знаний в своей учебе и работе, будут вам очень благодарны.
Приложение 2
Программный код, использовавшийся в практической части
Листинг 1.1 Перенаправление запросов к веб-сайту через файл index.php
(файл .htaccess)
RewriteEngine on
RewriteCond %{SCRIPT_FILENAME} !-f
RewriteCond %{SCRIPT_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1
Листинг 1.2 Обработка пользовательских запросов методами класса Zend-Controller (файл index.php)
<?php
require_once('Zend/Loader.php');
Zend_Loader::registerAutoload();
$controller = Zend_Controller_Front::getInstance();
$controller->setControllerDirectory($config->paths->base .
'/include/Controllers');
$controller->dispatch();
?>
Листинг 1.3 Контроллер index, используемый на главной странице веб-приложения (файл IndexController.php)
<?php
require_once('CustomControllerAction.php');
class IndexController extends CustomControllerAction
{
public function indexAction()
{
Echo'Будущий школьный сайт';
}
}
?>
Листинг 1.4 Начальные настройки приложения (файл settings.ini)
[development]
database.type = pdo_mysql
database.hostname = localhost
database.username = phpweb20
database.password = myPassword
database.database = phpweb20
paths.base = /var/www/phpweb20
paths.data = /var/www/phpweb20/data
paths.templates = /var/www/phpweb20/templates
logging.file = /var/www/phpweb20/data/logs/debug.log
Листинг 1.5 Загрузка рабочих настроек приложения с использованием класса Zend_Config_Ini (файл index.php)
$config = new Zend_Config_Ini('../settings.ini', 'development');
Zend_Registry::set('config', $config);
$controller->setControllerDirectory($config->paths->base .
'/include/Controllers');
Листинг 1.6 Расширение Smarty для использования в веб-приложении
(файл Templater.php)
<?php
class Templater extends Zend_View_Abstract
{
protected $_path;
protected $_engine;
public function __construct()
{
$config = Zend_Registry::get('config');
require_once('Smarty/Smarty.class.php');
$this->_engine = new Smarty();
$this->_engine->template_dir = $config->paths->templates;
$this->_engine->compile_dir = sprintf('%s/tmp/templates_c',
$config->paths->data);
$this->_engine->plugins_dir = array($config->paths->base .
'/include/Templater/plugins',
'plugins');
}
public function getEngine()
{
return $this->_engine;
}
public function __set($key, $val)
{
$this->_engine->assign($key, $val);
}
public function __get($key)
{
return $this->_engine->get_template_vars($key);
}
public function __isset($key)
{
return $this->_engine->get_template_vars($key) !== null;
}
public function __unset($key)
{
$this->_engine->clear_assign($key);
}
public function assign($spec, $value = null)
{
if (is_array($spec)) {
$this->_engine->assign($spec);
return;
}
$this->_engine->assign($spec, $value);
}
public function clearVars()
{
$this->_engine->clear_all_assign();
}
public function render($name)
{
return $this->_engine->fetch(strtolower($name));
}
public function _run()
{ }
}
?>
Листинг 1.7 Новый контроллер, выводящий файл index.tpl
(файл IndexController.php)
<?
class IndexController extends CustomControllerAction
{
public function indexAction()
{
}
}
?>
Листинг 1.8 Шаблон для операции index контроллера index
(файл index.tpl)
{include file='header.tpl'}
Будущий спортивный сайт школы
{include file='footer.tpl'}
Листинг 1.9 Файл заголовка HTML-страницы
(файл header.tpl)
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Title</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251 " />
</head>
<body>
<div>
Листинг 1.10 Файл конца страницы, в котором закрываются тэги, открытые в заголовке(файл footer.tpl)
</div>
</body>
</html>
Листинг 2.1 Загрузочный файл приложения с использованием компонента Zend_Auth (файл index.php)
// настройка утентификации пользователей
$auth = Zend_Auth::getInstance();
$auth->setStorage(new Zend_Auth_Storage_Session());
$controller->registerPlugin(new CustomControllerAclManager($auth));
Листинг 2.2 Подключаемый модуль CustomControllerAclManager, проверяющий допуски перед отправкой запроса на обработку
(файл CustomControllerAclManager.php)
<?php
class CustomControllerAclManager extends Zend_Controller_Plugin_Abstract
{
// роль по умолчанию, если не вошел (или роль не определена)
private $_defaultRole = 'guest';
// выполнить операцию, если у пользователя не хватает привилегий
private $_authController = array('controller' => 'account',
'action' => 'login');
public function __construct(Zend_Auth $auth)
{
$this->auth = $auth;
$this->acl = new Zend_Acl();
// добаляем новые роли
$this->acl->addRole(new Zend_Acl_Role($this->_defaultRole));
$this->acl->addRole(new Zend_Acl_Role('member'));
$this->acl->addRole(new Zend_Acl_Role('administrator'), 'member');
// добавляем контролируемые ресурсы
$this->acl->add(new Zend_Acl_Resource('account'));
$this->acl->add(new Zend_Acl_Resource('admin'));
// по умолчанию даем всемпользователям доступ ко всему
// кроме управления учетными записями и администрированием
$this->acl->allow();
$this->acl->deny(null, 'account');
$this->acl->deny(null, 'admin');
// добавляем исключение. чтобы гости могли войти или
// зарегистрироваться, если нет привилегий
$this->acl->allow('guest', 'account', array('login',
'fetchpassword',
'register',
'registercomplete'));
// позволяем зарегистрированным пользователям доступ к управлению учетными записями
$this->acl->allow('member', 'account');
// даем администраторам доступ в область администрирования
$this->acl->allow('administrator', 'admin');
}
/**
* preDispatch
*
* Прежде, чем отправлять запрос на обработку, проверяет есть ли у пользователя
* нужные привелегии. Если нет, инициирует операцию по умолчанию
*
*
* @param Zend_Controller_Request_Abstract $request
*/
public function preDispatch(Zend_Controller_Request_Abstract $request)
{
// проверка, вошел ли пользователь и имеет ли нужную роль
// если нет, то назначается роль по умолчанию (гость)
if ($this->auth->hasIdentity())
$role = $this->auth->getIdentity()->user_type;
else
$role = $this->_defaultRole;
if (!$this->acl->hasRole($role))
$role = $this->_defaultRole;
// контролируемый ресурс - имя запрашиваемого контроллера
$resource = $request->controller;
// привилегия - имя запрашиваемой операции
$privilege = $request->action;
// если ресурс не определен явно. проверить
// глобальные допуски по умолчанию
if (!$this->acl->has($resource))
$resource = null;
// в допуске отказано. Выполняется операция по умолчанию
if (!$this->acl->isAllowed($role, $resource, $privilege)) {
$request->setControllerName($this->_authController['controller']);
$request->setActionName($this->_authController['action']);
}
}
}
?>
Листинг 2.3 Первоначальная версия класса DatabaseObject_User
(файл user.php)
<?
class DatabaseObject_User extends DatabaseObject
{
static $userTypes = array('member' => 'Member',
'administrator' => 'Administrator');
public $profile = null;
public $_newPassword = null;
public function __construct($db)
{
parent::__construct($db, 'users', 'user_id');
$this->add('username');
$this->add('password');
$this->add('user_type', 'member');
$this->add('ts_created', time(), self::TYPE_TIMESTAMP);
$this->add('ts_last_login', null, self::TYPE_TIMESTAMP);
}
}
?>
Листинг 2.4 Полный текст класса FormProcessor_UserRegistration
(файл UserRegistration.php)
<?php
class FormProcessor_UserRegistration extends FormProcessor
{
protected $db = null;
public $user = null;
public function __construct($db)
{
parent::__construct();
$this->db = $db;
$this->user = new DatabaseObject_User($db);
$this->user->type = 'member';
}
public function process(Zend_Controller_Request_Abstract $request)
{
// проверка правильности имени
$this->username = trim($request->getPost('username'));
if (strlen($this->username) == 0)
$this->addError('username', 'Please enter a username');
else if (!DatabaseObject_User::IsValidUsername($this->username))
$this->addError('username', 'Please enter a valid username');
else if ($this->user->usernameExists($this->username))
$this->addError('username', 'The selected username already exists');
else
$this->user->username = $this->username;
// проверка имени и фамилии
$this->first_name = $this->sanitize($request->getPost('first_name'));
if (strlen($this->first_name) == 0)
$this->addError('first_name', 'Please enter your first name');
else
$this->user->profile->first_name = $this->first_name;
$this->last_name = $this->sanitize($request->getPost('last_name'));
if (strlen($this->last_name) == 0)
$this->addError('last_name', 'Please enter your last name');
else
$this->user->profile->last_name = $this->last_name;
// проверка адреса электронной почты
$this->email = $this->sanitize($request->getPost('email'));
$validator = new Zend_Validate_EmailAddress();
if (strlen($this->email) == 0)
$this->addError('email', 'Please enter your e-mail address');
else if (!$validator->isValid($this->email))
$this->addError('email', 'Please enter a valid e-mail address');
else
$this->user->profile->email = $this->email;
$session = new Zend_Session_Namespace('captcha');
$this->captcha = $this->sanitize($request->getPost('captcha'));
if ($this->captcha != $session->phrase)
$this->addError('captcha', 'Please enter the correct phrase');
// если ошибок нет, сохранить данные пользоваетля
if (!$this->hasError()) {
$this->user->save();
unset($session->phrase);
}
// возврат true, если нет ошибок
return !$this->hasError();
}
}
Листинг 2.5 Шаблон HTML для формы регистрации пользователей
(файл register.tpl)
{include file='header.tpl'}
<form method="post" action="/account/register">
<fieldset>
<legend>Создание аккаунта</legend>
<div class="error"{if !$fp->hasError()} style="display: none"{/if}>
Заполните поля
</div>
<div class="row" id="form_username_container">
<label for="form_username">Логин:</label>
<input type="text" id="form_username"
name="username" value="{$fp->username|escape}" />
{include file='lib/error.tpl' error=$fp->getError('username')}
</div>
<div class="row" id="form_email_container">
<label for="form_email">E-mail:</label>
<input type="text" id="form_email"
name="email" value="{$fp->email|escape}" />
{include file='lib/error.tpl' error=$fp->getError('email')}
</div>
<div class="row" id="form_first_name_container">
<label for="form_first_name">Имя:</label>
<input type="text" id="form_first_name"
name="first_name" value="{$fp->first_name|escape}" />
{include file='lib/error.tpl' error=$fp->getError('first_name')}
</div>
<div class="row" id="form_last_name_container">
<label for="form_last_name">Фамилия:</label>
<input type="text" id="form_last_name"
name="last_name" value="{$fp->last_name|escape}" />
{include file='lib/error.tpl' error=$fp->getError('last_name')}
</div>
<div class="captcha">
<img src="/utility/captcha" alt="CAPTCHA image" />
</div>
<div class="row" id="form_captcha_container">
<label for="form_captcha">Введите символы, изображенные на картинке:</label>
<input type="text" id="form_captcha"
name="captcha" value="{$fp->captcha|escape}" />
{include file='lib/error.tpl' error=$fp->getError('captcha')}
</div>
<div class="submit">
<input type="submit" value="Register" />
</div>
</fieldset>
</form>
{include file='footer.tpl'}
Листинг 2.6 Форма входа на сайт (файл login.tpl)
{include file='header.tpl'}
<form method="post" action="/account/login">
<fieldset>
<input type="hidden" name="redirect" value="{$redirect|escape}" />
<legend>Зайти под своим именем</legend>
<div class="row" id="form_username_container">
<label for="form_username">Логин:</label>
<input type="text" id="form_username"
name="username" value="{$username|escape}" />
{include file='lib/error.tpl' error=$errors.username}
</div>
<div class="row" id="form_password_container">
<label for="form_password">Пароль:</label>
<input type="password" id="form_password"
name="password" value="" />
{include file='lib/error.tpl' error=$errors.password}
</div>
<div class="submit">
<input type="submit" value="Зайти" />
</div>
<div>
<a href="/account/fetchpassword">Забыли пароль</a>
</div>
</fieldset>
</form>
{include file='footer.tpl'}
Приложение 3
Материал для практических заданий по теме «Гипертекстовое представление информации»
Колыбельная.
Уснули километры проводов, уснули мониторы, материнки,
Уснули мыши, шарики мышов, цветные гифки и jpeg картинки.
Все биты, байты все объяты сном, и таймер больше такт не отбивает.
Не крутится уж больше CD ROM, и память с кешом тихо засыпает.
Отключен интернет, погас модем, процессор флаги выставил отбоя
Не бегают пакеты по сети еще вчера не ведавшей покоя,
Коннект разорван и прервалась нить, связующая близкое с далеким.
Динамик спит, чуть дышит микрофон у спящего винчестера под боком.
Спит сканер, стример. Принтер сном объят, программы каждою своею строчкой.
Ячейки памяти и электроны спят. Все числа с плавающей и обычной точкой.
И каждый слот, деталь свою прижав, и дисковод дискету обнимая.
Машинный код недвижимый, устав лежит, беспечно сну внимая.
И пиксели не радуют уж глаз, системный блок в объятиях Морфея
Стоит во тьме, Луна - большой топаз, лениво освещает батарею
Бесперебойного питания. В тиши клавиатура дремлет под рукой твоею
Усни родная, и пусть сон явит то, что сказать тебе я не успею.
(с) Автор неизвестен, найдено на просторах сети
Классификация ЛВС
1. По охвату территории
§ Персональная
§ Локальная
§ Городская
§ Национальная
§ Глобальная
2. По типу функционального взаимодействия
o Клиент-сервер
o Из точки в точку
o Одноранговая
3. По типу сетевой топологии
· Линейная шина
· Звезда
· Кольцо
· Решетка
· Смежная
· Полносвязанная
4. По функциональному назначению
a. Сети хранения данных
b. Сети управления процессом
c. Сети SOHO
5. По сетевым операционным системам
I. Windows
II. Linux
III. NetWare
IV. Смешанная
<h1>Цвет и цветовые модели</h1>
</div>
<div class="s2">
<h2>Меню</h2>
<ul>
<li>Что такое цвет
<li>Цветовой круг
<li>Цветовая модель RGB
<lI>Цветовая модель CMYK
<li>Цветовая модель HSB
</ul>
</div>
<H2>Что такое цвет</H2>
<div class="s3">
<IMG SRC="69_1.jpg">
</div>
<P><span class="zb">Что же такое цвет?</span> Мы смотрим на предметы и, характеризуя их, говорим примерно следующее: он большой, мягкий, светло-голубого цвета. При описании чего-либо в большинстве случаев упоминается цвет, так как он несет огромное количество информации. На самом деле тело не имеет определенного цвета.
Если говорить о дневном освещении, то это белый свет. Попадая на предмет, он частично поглощается, а частично отражается, так вот именно отраженный спектр и видит человек.
Видимыми являются волны, лежащие в диапазоне от <span class="c">760 до 380 миллимикрон</span>, хотя некоторые животные видят и в областях ультрафиолетовых и ультракрасных волн. Зависимость цвета от длины волны представлена в таблице 1.
Первый, кто сумел разложить свет на различные составляющие, был Ньютон. Он заметил, что при пропускании света через призму он раскладывается на лучи разных цветов, после чего снова собирается воедино.
Основным заблуждением человека является то, что он видит то, что привык видеть, а именно если смотреть на хорошо знакомый красно-белый объект, освященный лишь зеленым светом, то мы все равно увидим два цвета -- красный и белый, -- хотя в мозг через глаз поступает иной сигнал, который игнорируется, точнее, преобразовывается в соответствии с тем, что он знает, а не с тем, что видит.
Дело в том, что зеленый свет не содержит красных лучей, следовательно, и отразить их предмет не может, а поэтому он поглощает весь спектр лучей, и оттого приобретает темный, близкий к черному, цвет. Что же касается белого, то он полностью отражает все падающие на него лучи и потому будет выглядеть зеленым.
<H2>Цветовой круг</H2>
<div class="s3">
<IMG SRC="69_2.jpg">
</div>
<P>Наука о цвете -- это довольно сложная и широкомасштабная наука, поэтому в ней время от времени создаются различные цветовые модели, применяемые в той либо иной области. Одной из таких моделей и является цветовой круг, о котором уже неоднократно упоминалось в статьях, опубликованных ранее, и принцип которого заложен в таких операциях, как Invert -- инвертировать (все цвета заменяются на те, которые находятся напротив в цветовом круге), Hue/Saturation -- Цвет/Насыщенность (вращение происходит все по тому же кругу) и другие.
Многим известно о том, что существует 3 первичных цвета, которые невозможно получить и которые образуют все остальные. Основные цвета -- это желтый, красный и синий. При смешивании желтого с красным получается оранжевый, синего с желтым -- зеленый, а красного с синим -- фиолетовый. Таким образом, можно составить круг, который будет содержать все цвета. Он представлен на рис. 1 и называется большим кругом Освальда.
Наряду с кругом Освальда есть еще и круг Гете, в котором основные цвета расположены в углах равностороннего треугольника, а дополнительные -- в углах перевернутого треугольника. Схема такого круга представлена на рис. 2.
Друг напротив друга расположены контрастные цвета.
Как же образуются цвета в машинной графике? Ответить на этот вопрос однозначно невозможно, так как все зависит от того, какую цветовую модель использовать. Каждая из них хороша в определенной области, поэтому однозначного предпочтения отдать нельзя, да и не стоит, так как лучшего результата можно добиться, комбинируя различные возможности, предоставляемые программой.
<H2>Цветовая модель RGB</H2>
<p>Это одна из наиболее распространенных и часто используемых моделей. Она применяется в приборах, излучающих свет, таких, например, как мониторы, прожекторы, фильтры и другие подобные устройства.
Данная цветовая модель базируется на трех основных цветах: Red -- красном, Green -- зеленом и Blue -- синем. Каждая из вышеперечисленных составляющих может варьироваться в пределах от 0 до 255, образовывая разные цвета и обеспечивая, таким образом, доступ ко всем 16 миллионам. При работе с графическим редактором Adobe PhotoShop можно выбирать цвет, полагаясь не только на тот, что мы видим, но при необходимости указывать и цифровое значение, тем самым иногда, особенно при цветокоррекции, контролируя процесс работы.
Данная цветовая модель считается аддитивной, то есть при увеличении яркости отдельных составляющих будет увеличиваться и яркость результирующего цвета: если смешать все три цвета с максимальной интенсивностью, то результатом будет белый цвет; напротив, при отсутствии всех цветов получается черный.
При наложении отдельных каналов результат получается не совсем такой, как если бы смешивались краски, поэтому для того, чтобы внести ясность, остановимся на каждом из сочетаний подробнее.
При смешении красного и зеленого результатом будет желтый. Зеленого и синего -- голубой, что ближе результату, получаемому на палитре. Синего и красного -- фиолетовый, причем при изменении пропорций смешиваемых цветов можно получать как розовые, так и пурпурные оттенки.
Несомненными достоинствами данного режима является то, что он позволяет работать со всеми 16 миллионами цветов, а недостаток состоит в том, что при выводе изображения на печать часть из этих цветов теряется, в основном самые яркие и насыщенные, также возникает проблема с синими цветами.<br>
<div class="s3">
<IMG SRC="rgb_model.gif">
<IMG SRC="image001.gif">
</div>
<H2>Цветовая модель CMYK</H2>
<P>Это еще одна из наиболее часто используемых цветовых моделей, нашедших широкое применение. Она, в отличие от аддитивной RGB, является субтрактивной моделью. Работа ее основана на том, как раскладывается на составляющие и видится нами свет и цвет. Как уже говорилось ранее, видимым является отраженный спектр, остальные же составляющие поглощаются. Аналогично образовываются цвета на бумаге при рисовании красками. То есть, проведя красную полосу, мы сделаем синюю и зеленую составляющие поглощенными. Если поверху наложить зеленую краску, то результат будет грязным (из-за того, что цвета не совершенны, то есть несколько отличаются от эталонных красного и зеленого) и очень близким к черному.
Основные цвета в субтрактивной модели отличаются от цветов аддитивной. Cyan -- голубой, Magenta -- пурпурный, Yellow -- желтый. Так как при смешении всех вышеперечисленных цветов идеального черного не получится, то вводится еще один дополнительный цвет -- черный, который позволяет добиваться большей глубины и используется при печати прочих черных (как, например, обычный текст) объектов.
Цвета в рассматриваемой цветовой модели были выбраны такими не случайно, а из-за того, что голубой поглощает лишь красный, пурпурный -- зеленый, желтый -- синий.
В отличие от аддитивной модели, где отсутствие цветовых составляющих образует черный цвет, в субтрактивной все наоборот: если нет отдельных компонентов, то цвет белый, если они все присутствуют, то образуется грязно-коричневый, который делается более темным при добавлении черной краски, которая используется для затемнения и других получаемых цветов. При смешивании отдельных цветовых составляющих можно получить следующие результаты:
Голубой + Пурпурный = Синий с оттенком фиолетового, который можно усилить, изменив пропорции смешиваемых цветов.
Пурпурный + Желтый = Красный. В зависимости от соотношения входящих в него составляющих он может быть преобразован в оранжевый или розовый.
Желтый + Голубой = Зеленый, который может быть преобразован при использовании тех же первичных цветов как в салатовый, так и в изумрудный.
Несмотря на большие различия в цветовых моделях RGB и CMYK, следует освоить обе, так как каждая применяется в своей области, и если вы занимаетесь графикой, то столкновения с ними вам не избежать. Следует помнить, что если вы готовите изображение к печати, то следует все-таки работать с CMYK, потому что в противном случае то, что вы увидите на мониторе, и то, что получите на бумаге, будет отличаться настолько сильно, что вся работа может пойти насмарку.
<br>
<div class="s3">
<IMG SRC="image003.gif">
<IMG SRC="image005.gif">
<IMG SRC="cmy_rgb.gif">
</div>
<H2>Цветовая модель HSB</H2>
<P>Здесь заглавные буквы не соответствуют никаким цветам, а символизируют цвет, насыщенность и яркость. Все цвета располагаются по кругу, и каждому соответствует свой градус, то есть всего насчитывается 360 вариантов (красный -- 0, желтый -- 60, зеленый -- 120 градусов и так далее).
Насыщенность определяет, насколько ярко выраженным будет выбранный цвет. 0 -- серый, 100 -- самый яркий и чистый из возможных вариантов.
Параметр яркости соответствует общепризнанному, то есть 0 -- это черный цвет.
Такая цветовая модель намного беднее рассмотренной ранее RGB, так как позволяет работать всего лишь с 3 миллионами цветов.
<br>
<div class="s3">
<IMG SRC="hsb_model.gif">
<IMG SRC="hsvkolo.bmp">
</div>
Приложение 4
Параметры шрифта и текста
font-family: Serif; // шрифты с засечками, например, Times New Roman.
Sans-serif //шрифты рубленные, без засечек, например, Arial.
Monospace //моноширинные шрифты, например, Courier New.
Cursive //курсивные шрифты, например, Calisto MT.
Fantasy //декоративные шрифты, например, Torhok.
color: #значение цвета;
имя цвета:
text-align: left; // выравнивание по левому краю
right; // выравнивание по правому краю
center; // выравнивание по центру
justify; // выравнивание по ширине
text-indent: значениеpx; // красная строка, отступ
vertical-align: super; // верхний индекс
sub; // нижний индекс
значениеpx; // смещение относительно вертикальной оси
font-style: italic; // курсив
oblique; // наклонный
normal; //нормальный
font-weight: bold; // полужирный
bolder; // более жирный по отношению к базовому
lighter; // менее жирный по отношению к базовому
letter-spacing: значениеpx; // Расстояние между буквами
text-decoration: blink; // Устанавливает мигающий текст
line-through; // Создает перечеркнутый текст
overline; // Линия проходит над текстом
underline; // Устанавливает подчеркнутый текст
none; // Отменяет все эффекты
Параметры списков
list-style-type: disk; //закрашенный кружок
Circle; //незакрашенный кружок
Square; //закрашенный квадрат
Decimal; //десятичные числа
lower-roman; //строчные римские цифры.
upper-roman; //прописные римские цифры.
lower-alpha; //строчные латинские буквы.
list-style-image: url (адрес картинки); //создает маркер из рисунка
list-style-position: inside; //маркеры в границе блока
utside; //маркеры за границей блока
Отступы и границы
margin-top: значениеpx; // ширина верхнего поля.
margin-right: значениеpx; // ширина правого поля.
margin-bottom: значениеpx; // ширина нижнего поля.
margin-left: значениеpx; // ширина левого поля.
padding-top: значениеpx; //ширина верхнего отступа.
padding-right: значениеpx; //ширина правого отступа.
padding-bottom: значениеpx; //ширина нижнего отступа.
padding-left: значениеpx; //ширина левого отступа.
Фон
background-color: цвет; // закрашивает фон цветом
background-image: url(picture.gif); // вставляет картинку в качестве фона
background-repeat: repeat; //повторять изображение по горизонтали и вертикали.
repeat-x; //повторять изображение только по горизонтали.
repeat-y; //повторять изображение только по вертикали.
no-repeat; //не повторять изображение.
background-attachment: scroll; //фон прокручивается вместе с текстом.
Fixed; //фон во время прокрутки остается неподвижным.
background-position: значение x _ значение y;
Размещено на Allbest.ru
Подобные документы
Социальная необходимость разработки педагогической технологии. Связь дидактики и методики. История возникновения технологии обучения. Понятие технологии обучения, ее специфика и основные черты, обучающий цикл. Классификационные параметры технологии.
лекция [23,6 K], добавлен 16.12.2009Существующие виды методических систем обучения и формулировка понимания "интенсивные технологии обучения". Понятие и задачи технологии обучения. Сущность и содержание процесса интенсификации обучения. Виды методических систем и проблемного обучения.
реферат [53,1 K], добавлен 05.02.2010Анализ вопросов внедрения современных педагогических технологий в процесс обучения. Процесс обучения химии в средней школе с применением модульной технологии. Разработка методики ведения урока для учащихся 8-х классов с применением модульной технологии.
курсовая работа [257,3 K], добавлен 01.12.2021Характеристика методики обучения истории: предмет, задачи, компоненты, методы научного исследования. Закономерности обучения истории в целях повышения эффективности и качества знаний. Изучение педагогических методов в процессе школьного обучения истории.
реферат [128,3 K], добавлен 19.01.2010Определение методов обучения и их реализация в учебном процессе, педагогические технологии. Частично-поисковый (эвристический) метод обучения. Разработка уроков с применением методов обучения и их реализация в процессе преподавания "Технологии".
контрольная работа [23,6 K], добавлен 06.03.2009Психофизиологические особенности учащихся среднего школьного возраста. Физиологические основы формирования двигательного навыка и обучения спортивной технике. Анализ современных тренировочных программ по увеличению уровня специальной тренированности.
дипломная работа [111,8 K], добавлен 05.09.2010Одна из стратегических задач системы школьного образования - решение проблемы личностно-ориентированного обучения. Метод учебного проектирования. Процесс обучения строится на основе обучения в сотрудничестве всех участников образовательного процесса.
статья [19,8 K], добавлен 14.01.2009Педагогические технологии обучения, особенности организации сотрудничества между педагогом и учащимся. Сущность метода проектов и разноуровневого обучения. Технологии использования компьютерных программ и дистанционное обучение, оценка их эффективности.
курсовая работа [44,2 K], добавлен 25.06.2015Знакомство с этапами разработки технологии и компонентов методического обеспечения одной из тем программы специальной технологии. Основные особенности методики проведения уроков. Рассмотрение методических рекомендаций к уроку теоретического обучения.
курсовая работа [1,3 M], добавлен 16.12.2013Педагогические технологии как технологии обучения (дидактические технологии) и технологии воспитания. Сущность, виды педагогических технологий. Взаимосвязь педагогических технологий с педагогическим мастерством. Технология, стадии педагогического общения.
реферат [17,9 K], добавлен 11.10.2010