Версия для слабовидящих

Научные школы ЯГПУ — различия между версиями

Материал из Ярославский педагогический университет
Перейти к: навигация, поиск
Строка 1: Строка 1:
  
 
<html>
 
<html>
<head>
 
<meta name="viewport" content="width=device-width, initial-scale=1">
 
 
<style>
 
<style>
.collapsible {
+
* {
   background-color: #0968AD;
+
   box-sizing: border-box;
  color: white;
+
  cursor: pointer;
+
  padding: 18px;
+
  width: 100%;
+
  border: none;
+
  text-align: left;
+
  outline: none;
+
  font-size: 15px;
+
 
}
 
}
  
.active, .collapsible:hover {
+
.row {
   background-color: #77ADCD;
+
   display: -ms-flexbox; /* IE10 */
 +
  display: flex;
 +
  -ms-flex-wrap: wrap; /* IE10 */
 +
  flex-wrap: wrap;
 +
  padding: 0 4px;
 
}
 
}
  
.collapsible:after {
+
/* Создание 3 одинаковых столбца, которые находятся рядом друг с другом */
   content: '\002B';
+
.column {
   color: white;
+
   -ms-flex: 33%; /* IE10 */
   font-weight: bold;
+
   flex: 33%;
   float: right;
+
   max-width: 33%;
  margin-left: 5px;
+
   padding: 0 4px;
 
}
 
}
  
.active:after {
+
.column img {
   content: "\2212";
+
   margin-top: 8px;
 +
  vertical-align: middle;
 +
  width: 100%;
 
}
 
}
  
.content {
+
/* Адаптивный макет - делает два столбца стека друг на друга, а не рядом друг с другом */
   padding: 0 18px;
+
@media screen and (max-width: 480px) {
  max-height: 0;
+
   .column {
  overflow: hidden;
+
    -ms-flex: 100%;
  transition: max-height 0.2s ease-out;
+
    flex: 100%;
   background-color: #f1f1f1;
+
    max-width: 100%;
 +
   }
 
}
 
}
 
</style>
 
</style>
</head>
 
 
<body>
 
<body>
  
<h1></h1>
+
<div class="row">  
 
+
  <div class="column">
<button class="collapsible">Индивидуализация образовательного процесса на разных этапах непрерывного образования</button>
+
    <a href="http://yspu.org/images/0/07/1_%D0%98%D0%BD%D0%B4%D0%B8%D0%B2%D0%B8%D0%B4%D1%83%D0%B0%D0%BB%D0%B8%D0%B7%D0%B0%D1%86%D0%B8%D1%8F_%D0%BE%D0%B1%D1%80%D0%B0%D0%B7%D0%BE%D0%B2%D0%B0%D1%82%D0%B5%D0%BB%D1%8C%D0%BD%D0%BE%D0%B3%D0%BE_%D0%BF%D1%80%D0%BE%D1%86%D0%B5%D1%81%D1%81%D0%B0_%D0%BD%D0%B0_%D1%80%D0%B0%D0%B7%D0%BD%D1%8B%D1%85_%D1%8D%D1%82%D0%B0%D0%BF%D0%B0%D1%85_%D0%BD%D0%B5%D0%BF%D1%80%D0%B5%D1%80%D1%8B%D0%B2%D0%BD%D0%BE%D0%B3%D0%BE_%D0%BE%D0%B1%D1%80%D0%B0%D0%B7%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D1%8F.pdf"><img class="alignnone size-medium wp-image-11299" src="http://yspu.org/images/3/3a/1_sc_sh.png" alt="" style="width:100%" /></a>
<div class="content">
+
  </div>
   {{Ректорат ЯГПУ}}
+
<div class="column">
 +
    <a href="http://yspu.org/images/c/c1/21_%D0%A2%D0%B5%D0%BE%D1%80%D0%B5%D1%82%D0%B8%D0%BA%D0%BE-%D0%BC%D0%B5%D1%82%D0%BE%D0%B4%D0%B8%D1%87%D0%B5%D1%81%D0%BA%D0%B8%D0%B5_%D0%BE%D1%81%D0%BD%D0%BE%D0%B2%D1%8B_%D1%84%D0%BE%D1%80%D0%BC%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D1%8F_%D0%B8_%D1%80%D0%B0%D0%B7%D0%B2%D0%B8%D1%82%D0%B8%D1%8F.pdf"><img class="alignnone size-medium wp-image-11299" src="http://yspu.org/images/4/4b/2_sc_sh.png" alt="" style="width:100%" /></a>
 +
  </div>
 +
<div class="column">
 +
    <a href="http://yspu.org/images/b/bc/3_%D0%A1%D0%BE%D0%B7%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5_%D0%BC%D0%B5%D1%82%D0%BE%D0%B4%D0%BE%D0%B2_%D0%B0%D0%B2%D1%82%D0%BE%D0%BC%D0%B0%D1%82%D0%B8%D0%B7%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%BD%D0%BE%D0%B3%D0%BE_%D0%B0%D0%BD%D0%B0%D0%BB%D0%B8%D0%B7%D0%B0_%D1%80%D0%B8%D1%82%D0%BC%D0%B0_%D1%82%D0%B5%D0%BA%D1%81%D1%82%D0%B0.pdf"><img class="alignnone size-medium wp-image-11299" src="http://yspu.org/images/4/48/3_sc_sh.png" alt="" style="width:100%" /></a>
 +
   </div>
 
</div>
 
</div>
 
<button class="collapsible">Теоретико-методические основы формирования<br> и развития профессиональной идентичности студентов<br> и молодых педагогов дошкольного образования</button>
 
<div class="content">
 
 
</div>
 
 
<button class="collapsible">Создание методов автоматизированного анализа ритма текста</button>
 
<div class="content">
 
 
 
</div>
 
 
<button class="collapsible">Научная школа исторической германистики</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Методология изучения теории и истории культуры</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Когнитивно-мотивационные основы образовательной деятельности</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Методология и история психологии</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Психология учебной деятельности и готовности к обучению</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Изучение теоретико-методологических<br> основ исторической науки<br> в России в XIX - начале ХХ в.</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Психология профессионального и карьерного развития личности</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Исследование актуальных проблем языкового и литературного образования школьников</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Технология наглядно-модельного обучения математике</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Теория и методика обучения биологии</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Новая дидактика современного образования</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Изучение адаптации системы кровообращения в норме и при патологии</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
<button class="collapsible">Активные процессы в социальной и массовой коммуникации</button>
 
<div class="content">
 
  <p></p>
 
</div>
 
 
 
<script>
 
var coll = document.getElementsByClassName("collapsible");
 
var i;
 
 
for (i = 0; i < coll.length; i++) {
 
  coll[i].addEventListener("click", function() {
 
    this.classList.toggle("active");
 
    var content = this.nextElementSibling;
 
    if (content.style.maxHeight){
 
      content.style.maxHeight = null;
 
    } else {
 
      content.style.maxHeight = content.scrollHeight + "px";
 
    }
 
  });
 
}
 
</script>
 
 
 
</body>
 
</body>
 
</html>
 
</html>

Версия 14:25, 28 марта 2022