положение: липкое не может заставить и верх и уйти на работу - PullRequest
0 голосов
/ 16 сентября 2018

Я пытаюсь создать сетку с горизонтальным и вертикальным расположением, а также с прикрепленным заголовком и первым столбцом.

Я использую это, чтобы получить заголовок липким

 .thead {
     position: sticky;
     top: 0px;
 }

Я использую это, чтобы сделать первый столбец липким.

 div.tbody>div.tr>div:nth-child(1) {
    position: sticky;
    left: 0;
}
.thead>div>div:nth-child(1){
    left:0;
    top:0;
    position: sticky;
}

Но я получаю странное поведение прокрутки, что заголовок первого столбца прикреплен слева, но не вверх. enter image description here

Вот код, который я использовал. Как я могу заставить это работать так, чтобы заголовок первого столбца прилипал как к левой, так и к верхней части?

.fixed_header {
  width: 300px;
  height: 300px;
  overflow: scroll;
}

.td,
.th {
  background-color: antiquewhite;
  width: 100px;
  float: left;
}

.thead {
  position: sticky;
  top: 0px;
}

.th {
  font-weight: bold;
}

.tr {
  display: block;
  clear: both;
  width: 500px;
}

.thead>div>div:nth-child(1) {
  left: 0;
  top: 0;
  position: sticky;
}

div.tbody>div.tr>div:nth-child(1) {
  position: sticky;
  left: 0;
}
<div class="fixed_header">
  <div class="thead">
    <div class="tr">
      <div class="th">Col 1</div>
      <div class="th">Col 2</div>
      <div class="th">Col 3</div>
      <div class="th">Col 4</div>
      <div class="th">Col 5</div>
    </div>
  </div>
  <div class="tbody">
    <div class="tr">
      <div class="td">row 1-0</div>
      <div class="td">row 1-1</div>
      <div class="td">row 1-2</div>
      <div class="td">row 1-3</div>
      <div class="td">row 1-4</div>
    </div>
    <div class="tr">
      <div class="td">row 2-0</div>
      <div class="td">row 2-1</div>
      <div class="td">row 2-2</div>
      <div class="td">row 2-3</div>
      <div class="td">row 2-4</div>
    </div>
    <div class="tr">
      <div class="td">row 3-0</div>
      <div class="td">row 3-1</div>
      <div class="td">row 3-2</div>
      <div class="td">row 3-3</div>
      <div class="td">row 3-4</div>
    </div>
    <div class="tr">
      <div class="td">row 4-0</div>
      <div class="td">row 4-1</div>
      <div class="td">row 4-2</div>
      <div class="td">row 4-3</div>
      <div class="td">row 4-4</div>
    </div>
    <div class="tr">
      <div class="td">row 5-0</div>
      <div class="td">row 5-1</div>
      <div class="td">row 5-2</div>
      <div class="td">row 5-3</div>
      <div class="td">row 5-4</div>
    </div>
    <div class="tr">
      <div class="td">row 6-0</div>
      <div class="td">row 6-1</div>
      <div class="td">row 6-2</div>
      <div class="td">row 6-3</div>
      <div class="td">row 6-4</div>
    </div>
    <div class="tr">
      <div class="td">row 7-0</div>
      <div class="td">row 7-1</div>
      <div class="td">row 7-2</div>
      <div class="td">row 7-3</div>
      <div class="td">row 7-4</div>
    </div>
    <div class="tr">
      <div class="td">row 1-0</div>
      <div class="td">row 1-1</div>
      <div class="td">row 1-2</div>
      <div class="td">row 1-3</div>
      <div class="td">row 1-4</div>
    </div>
    <div class="tr">
      <div class="td">row 2-0</div>
      <div class="td">row 2-1</div>
      <div class="td">row 2-2</div>
      <div class="td">row 2-3</div>
      <div class="td">row 2-4</div>
    </div>
    <div class="tr">
      <div class="td">row 3-0</div>
      <div class="td">row 3-1</div>
      <div class="td">row 3-2</div>
      <div class="td">row 3-3</div>
      <div class="td">row 3-4</div>
    </div>
    <div class="tr">
      <div class="td">row 4-0</div>
      <div class="td">row 4-1</div>
      <div class="td">row 4-2</div>
      <div class="td">row 4-3</div>
      <div class="td">row 4-4</div>
    </div>
    <div class="tr">
      <div class="td">row 5-0</div>
      <div class="td">row 5-1</div>
      <div class="td">row 5-2</div>
      <div class="td">row 5-3</div>
      <div class="td">row 5-4</div>
    </div>
    <div class="tr">
      <div class="td">row 6-0</div>
      <div class="td">row 6-1</div>
      <div class="td">row 6-2</div>
      <div class="td">row 6-3</div>
      <div class="td">row 6-4</div>
    </div>
    <div class="tr">
      <div class="td">row 7-0</div>
      <div class="td">row 7-1</div>
      <div class="td">row 7-2</div>
      <div class="td">row 7-3</div>
      <div class="td">row 7-4</div>
    </div>
    <div class="tr">
      <div class="td">row 1-0</div>
      <div class="td">row 1-1</div>
      <div class="td">row 1-2</div>
      <div class="td">row 1-3</div>
      <div class="td">row 1-4</div>
    </div>
    <div class="tr">
      <div class="td">row 2-0</div>
      <div class="td">row 2-1</div>
      <div class="td">row 2-2</div>
      <div class="td">row 2-3</div>
      <div class="td">row 2-4</div>
    </div>
    <div class="tr">
      <div class="td">row 3-0</div>
      <div class="td">row 3-1</div>
      <div class="td">row 3-2</div>
      <div class="td">row 3-3</div>
      <div class="td">row 3-4</div>
    </div>
    <div class="tr">
      <div class="td">row 4-0</div>
      <div class="td">row 4-1</div>
      <div class="td">row 4-2</div>
      <div class="td">row 4-3</div>
      <div class="td">row 4-4</div>
    </div>
    <div class="tr">
      <div class="td">row 5-0</div>
      <div class="td">row 5-1</div>
      <div class="td">row 5-2</div>
      <div class="td">row 5-3</div>
      <div class="td">row 5-4</div>
    </div>
    <div class="tr">
      <div class="td">row 6-0</div>
      <div class="td">row 6-1</div>
      <div class="td">row 6-2</div>
      <div class="td">row 6-3</div>
      <div class="td">row 6-4</div>
    </div>
    <div class="tr">
      <div class="td">row 7-0</div>
      <div class="td">row 7-1</div>
      <div class="td">row 7-2</div>
      <div class="td">row 7-3</div>
      <div class="td">row 7-4</div>
    </div>
  </div>
</div>

Ответы [ 3 ]

0 голосов
/ 16 сентября 2018

Может быть, использовать другую структуру и прокручивать только внутренние строки / столбцы. Добавлен скрипт JQuery, чтобы он работал.

$( ".fixed_header" ).scroll(function() {
    var fixedHeader = $( ".fixed_header" );
    $( ".aaa" ).scrollTop(fixedHeader.scrollTop());
});
.fixed_header {
  width: 300px;
  height: 300px;
  overflow: scroll;
  display: flex;
  flex-direction: column;
}

.td,
.th {
  background-color: antiquewhite;
  width: 100px;
  float: left;
}

.thead {
  position: sticky;
  top: 0px;
}

.th {
  font-weight: bold;
}

.tr {
  display: block;
  clear: both;
  width: 500px;
}

.thead>div>div:nth-child(1) {
  left: 0;
  top: 0;

}

.content{
   position: relative;
   
}
.sticky-column{
    width: 100px;
    height: 280px;
    position: absolute;
    top: 0px;
    left: 0px;
    display: flex;
    flex-direction: column;
}

.data{
  margin-left: 100px;
}

.aaa{
  overflow: hidden;
  height: 2800px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="content">
      <div class="sticky-column">
        <div>
          <div class="th">Col 1</div>
        </div>
        <div class="aaa">
          <div class="td">row 1-0</div>
          <div class="td">row 2-0</div>
          <div class="td">row 3-0</div>
          <div class="td">row 4-0</div>
          <div class="td">row 5-0</div>
          <div class="td">row 6-0</div>
          <div class="td">row 7-0</div>
          <div class="td">row 1-0</div>
          <div class="td">row 2-0</div>
          <div class="td">row 3-0</div>
          <div class="td">row 4-0</div>
          <div class="td">row 5-0</div>
          <div class="td">row 6-0</div>
          <div class="td">row 7-0</div>
          <div class="td">row 1-0</div>
          <div class="td">row 2-0</div>
          <div class="td">row 3-0</div>
          <div class="td">row 4-0</div>
          <div class="td">row 5-0</div>
          <div class="td">row 6-0</div>
          <div class="td">row 7-0</div>
        </div>
      </div>
       <div class="data">
     

<div class="fixed_header">
  <div class="thead">
    <div class="tr">

      <div class="th">Col 2</div>
      <div class="th">Col 3</div>
      <div class="th">Col 4</div>
      <div class="th">Col 5</div>
    </div>
  </div>
  <div class="tbody">
    
        <div class="tr">
          
          <div class="td">row 1-1</div>
          <div class="td">row 1-2</div>
          <div class="td">row 1-3</div>
          <div class="td">row 1-4</div>
        </div>
        <div class="tr">
         
          <div class="td">row 2-1</div>
          <div class="td">row 2-2</div>
          <div class="td">row 2-3</div>
          <div class="td">row 2-4</div>
        </div>
        <div class="tr">
         
          <div class="td">row 3-1</div>
          <div class="td">row 3-2</div>
          <div class="td">row 3-3</div>
          <div class="td">row 3-4</div>
        </div>
        <div class="tr">
         
          <div class="td">row 4-1</div>
          <div class="td">row 4-2</div>
          <div class="td">row 4-3</div>
          <div class="td">row 4-4</div>
        </div>
        <div class="tr">
         
          <div class="td">row 5-1</div>
          <div class="td">row 5-2</div>
          <div class="td">row 5-3</div>
          <div class="td">row 5-4</div>
        </div>
        <div class="tr">
         
          <div class="td">row 6-1</div>
          <div class="td">row 6-2</div>
          <div class="td">row 6-3</div>
          <div class="td">row 6-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 7-1</div>
          <div class="td">row 7-2</div>
          <div class="td">row 7-3</div>
          <div class="td">row 7-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 1-1</div>
          <div class="td">row 1-2</div>
          <div class="td">row 1-3</div>
          <div class="td">row 1-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 2-1</div>
          <div class="td">row 2-2</div>
          <div class="td">row 2-3</div>
          <div class="td">row 2-4</div>
        </div>
        <div class="tr">
         
          <div class="td">row 3-1</div>
          <div class="td">row 3-2</div>
          <div class="td">row 3-3</div>
          <div class="td">row 3-4</div>
        </div>
        <div class="tr">
         
          <div class="td">row 4-1</div>
          <div class="td">row 4-2</div>
          <div class="td">row 4-3</div>
          <div class="td">row 4-4</div>
        </div>
        <div class="tr">
         
          <div class="td">row 5-1</div>
          <div class="td">row 5-2</div>
          <div class="td">row 5-3</div>
          <div class="td">row 5-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 6-1</div>
          <div class="td">row 6-2</div>
          <div class="td">row 6-3</div>
          <div class="td">row 6-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 7-1</div>
          <div class="td">row 7-2</div>
          <div class="td">row 7-3</div>
          <div class="td">row 7-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 1-1</div>
          <div class="td">row 1-2</div>
          <div class="td">row 1-3</div>
          <div class="td">row 1-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 2-1</div>
          <div class="td">row 2-2</div>
          <div class="td">row 2-3</div>
          <div class="td">row 2-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 3-1</div>
          <div class="td">row 3-2</div>
          <div class="td">row 3-3</div>
          <div class="td">row 3-4</div>
        </div>
        <div class="tr">
         
          <div class="td">row 4-1</div>
          <div class="td">row 4-2</div>
          <div class="td">row 4-3</div>
          <div class="td">row 4-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 5-1</div>
          <div class="td">row 5-2</div>
          <div class="td">row 5-3</div>
          <div class="td">row 5-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 6-1</div>
          <div class="td">row 6-2</div>
          <div class="td">row 6-3</div>
          <div class="td">row 6-4</div>
        </div>
        <div class="tr">
          
          <div class="td">row 7-1</div>
          <div class="td">row 7-2</div>
          <div class="td">row 7-3</div>
          <div class="td">row 7-4</div>
        </div>
      </div>
    </div>
  </div>
</div>
0 голосов
/ 17 сентября 2018

В конце концов мне удалось решить эту проблему, указав thead z-index 1 - это решило проблему без JavaScript

.fixed_header {
  width: 300px;
  height: 300px;
  overflow: scroll;
}

.td,
.th {
  background-color: antiquewhite;
  width: 100px;
  float: left;
}

.thead {
  position: sticky;
  top: 0px;
  z-index:1;
}

.th {
  font-weight: bold;
}

.tr {
  display: block;
  clear: both;
  width: 500px;
}

.thead>div>div:nth-child(1) {
  left: 0;
  top: 0;
  position: sticky;
  
}

div.tbody>div.tr>div:nth-child(1) {
  position: sticky;
  left: 0;
  
}
<div class="fixed_header">
  <div class="thead">
    <div class="tr">
      <div class="th">Col 1</div>
      <div class="th">Col 2</div>
      <div class="th">Col 3</div>
      <div class="th">Col 4</div>
      <div class="th">Col 5</div>
    </div>
  </div>
  <div class="tbody">
    <div class="tr">
      <div class="td">row 1-0</div>
      <div class="td">row 1-1</div>
      <div class="td">row 1-2</div>
      <div class="td">row 1-3</div>
      <div class="td">row 1-4</div>
    </div>
    <div class="tr">
      <div class="td">row 2-0</div>
      <div class="td">row 2-1</div>
      <div class="td">row 2-2</div>
      <div class="td">row 2-3</div>
      <div class="td">row 2-4</div>
    </div>
    <div class="tr">
      <div class="td">row 3-0</div>
      <div class="td">row 3-1</div>
      <div class="td">row 3-2</div>
      <div class="td">row 3-3</div>
      <div class="td">row 3-4</div>
    </div>
    <div class="tr">
      <div class="td">row 4-0</div>
      <div class="td">row 4-1</div>
      <div class="td">row 4-2</div>
      <div class="td">row 4-3</div>
      <div class="td">row 4-4</div>
    </div>
    <div class="tr">
      <div class="td">row 5-0</div>
      <div class="td">row 5-1</div>
      <div class="td">row 5-2</div>
      <div class="td">row 5-3</div>
      <div class="td">row 5-4</div>
    </div>
    <div class="tr">
      <div class="td">row 6-0</div>
      <div class="td">row 6-1</div>
      <div class="td">row 6-2</div>
      <div class="td">row 6-3</div>
      <div class="td">row 6-4</div>
    </div>
    <div class="tr">
      <div class="td">row 7-0</div>
      <div class="td">row 7-1</div>
      <div class="td">row 7-2</div>
      <div class="td">row 7-3</div>
      <div class="td">row 7-4</div>
    </div>
    <div class="tr">
      <div class="td">row 1-0</div>
      <div class="td">row 1-1</div>
      <div class="td">row 1-2</div>
      <div class="td">row 1-3</div>
      <div class="td">row 1-4</div>
    </div>
    <div class="tr">
      <div class="td">row 2-0</div>
      <div class="td">row 2-1</div>
      <div class="td">row 2-2</div>
      <div class="td">row 2-3</div>
      <div class="td">row 2-4</div>
    </div>
    <div class="tr">
      <div class="td">row 3-0</div>
      <div class="td">row 3-1</div>
      <div class="td">row 3-2</div>
      <div class="td">row 3-3</div>
      <div class="td">row 3-4</div>
    </div>
    <div class="tr">
      <div class="td">row 4-0</div>
      <div class="td">row 4-1</div>
      <div class="td">row 4-2</div>
      <div class="td">row 4-3</div>
      <div class="td">row 4-4</div>
    </div>
    <div class="tr">
      <div class="td">row 5-0</div>
      <div class="td">row 5-1</div>
      <div class="td">row 5-2</div>
      <div class="td">row 5-3</div>
      <div class="td">row 5-4</div>
    </div>
    <div class="tr">
      <div class="td">row 6-0</div>
      <div class="td">row 6-1</div>
      <div class="td">row 6-2</div>
      <div class="td">row 6-3</div>
      <div class="td">row 6-4</div>
    </div>
    <div class="tr">
      <div class="td">row 7-0</div>
      <div class="td">row 7-1</div>
      <div class="td">row 7-2</div>
      <div class="td">row 7-3</div>
      <div class="td">row 7-4</div>
    </div>
    <div class="tr">
      <div class="td">row 1-0</div>
      <div class="td">row 1-1</div>
      <div class="td">row 1-2</div>
      <div class="td">row 1-3</div>
      <div class="td">row 1-4</div>
    </div>
    <div class="tr">
      <div class="td">row 2-0</div>
      <div class="td">row 2-1</div>
      <div class="td">row 2-2</div>
      <div class="td">row 2-3</div>
      <div class="td">row 2-4</div>
    </div>
    <div class="tr">
      <div class="td">row 3-0</div>
      <div class="td">row 3-1</div>
      <div class="td">row 3-2</div>
      <div class="td">row 3-3</div>
      <div class="td">row 3-4</div>
    </div>
    <div class="tr">
      <div class="td">row 4-0</div>
      <div class="td">row 4-1</div>
      <div class="td">row 4-2</div>
      <div class="td">row 4-3</div>
      <div class="td">row 4-4</div>
    </div>
    <div class="tr">
      <div class="td">row 5-0</div>
      <div class="td">row 5-1</div>
      <div class="td">row 5-2</div>
      <div class="td">row 5-3</div>
      <div class="td">row 5-4</div>
    </div>
    <div class="tr">
      <div class="td">row 6-0</div>
      <div class="td">row 6-1</div>
      <div class="td">row 6-2</div>
      <div class="td">row 6-3</div>
      <div class="td">row 6-4</div>
    </div>
    <div class="tr">
      <div class="td">row 7-0</div>
      <div class="td">row 7-1</div>
      <div class="td">row 7-2</div>
      <div class="td">row 7-3</div>
      <div class="td">row 7-4</div>
    </div>
  </div>
</div>
0 голосов
/ 16 сентября 2018

удалить "позиция: липкая;"в этих 2 местах, и теперь он работает нормально.

.thead>div>div:nth-child(1) {
left: 0;
top: 0;
}

div.tbody>div.tr>div:nth-child(1) {
left: 0;

модифицированный код здесь -

.fixed_header {
  width: 300px;
  height: 300px;
  overflow: scroll;
}

.td,
.th {
  background-color: antiquewhite;
  width: 100px;
  float: left;
}

.thead {
  position: sticky;
  top: 0px;
}

.th {
  font-weight: bold;
}

.tr {
  display: block;
  clear: both;
  width: 500px;
}

.thead>div>div:nth-child(1) {
  left: 0;
  top: 0;
}

div.tbody>div.tr>div:nth-child(1) {
  left: 0;
<div class="fixed_header">
  <div class="thead">
    <div class="tr">
      <div class="th">Col 1</div>
      <div class="th">Col 2</div>
      <div class="th">Col 3</div>
      <div class="th">Col 4</div>
      <div class="th">Col 5</div>
    </div>
  </div>
  <div class="tbody">
    <div class="tr">
      <div class="td">row 1-0</div>
      <div class="td">row 1-1</div>
      <div class="td">row 1-2</div>
      <div class="td">row 1-3</div>
      <div class="td">row 1-4</div>
    </div>
    <div class="tr">
      <div class="td">row 2-0</div>
      <div class="td">row 2-1</div>
      <div class="td">row 2-2</div>
      <div class="td">row 2-3</div>
      <div class="td">row 2-4</div>
    </div>
    <div class="tr">
      <div class="td">row 3-0</div>
      <div class="td">row 3-1</div>
      <div class="td">row 3-2</div>
      <div class="td">row 3-3</div>
      <div class="td">row 3-4</div>
    </div>
    <div class="tr">
      <div class="td">row 4-0</div>
      <div class="td">row 4-1</div>
      <div class="td">row 4-2</div>
      <div class="td">row 4-3</div>
      <div class="td">row 4-4</div>
    </div>
    <div class="tr">
      <div class="td">row 5-0</div>
      <div class="td">row 5-1</div>
      <div class="td">row 5-2</div>
      <div class="td">row 5-3</div>
      <div class="td">row 5-4</div>
    </div>
    <div class="tr">
      <div class="td">row 6-0</div>
      <div class="td">row 6-1</div>
      <div class="td">row 6-2</div>
      <div class="td">row 6-3</div>
      <div class="td">row 6-4</div>
    </div>
    <div class="tr">
      <div class="td">row 7-0</div>
      <div class="td">row 7-1</div>
      <div class="td">row 7-2</div>
      <div class="td">row 7-3</div>
      <div class="td">row 7-4</div>
    </div>
    <div class="tr">
      <div class="td">row 1-0</div>
      <div class="td">row 1-1</div>
      <div class="td">row 1-2</div>
      <div class="td">row 1-3</div>
      <div class="td">row 1-4</div>
    </div>
    <div class="tr">
      <div class="td">row 2-0</div>
      <div class="td">row 2-1</div>
      <div class="td">row 2-2</div>
      <div class="td">row 2-3</div>
      <div class="td">row 2-4</div>
    </div>
    <div class="tr">
      <div class="td">row 3-0</div>
      <div class="td">row 3-1</div>
      <div class="td">row 3-2</div>
      <div class="td">row 3-3</div>
      <div class="td">row 3-4</div>
    </div>
    <div class="tr">
      <div class="td">row 4-0</div>
      <div class="td">row 4-1</div>
      <div class="td">row 4-2</div>
      <div class="td">row 4-3</div>
      <div class="td">row 4-4</div>
    </div>
    <div class="tr">
      <div class="td">row 5-0</div>
      <div class="td">row 5-1</div>
      <div class="td">row 5-2</div>
      <div class="td">row 5-3</div>
      <div class="td">row 5-4</div>
    </div>
    <div class="tr">
      <div class="td">row 6-0</div>
      <div class="td">row 6-1</div>
      <div class="td">row 6-2</div>
      <div class="td">row 6-3</div>
      <div class="td">row 6-4</div>
    </div>
    <div class="tr">
      <div class="td">row 7-0</div>
      <div class="td">row 7-1</div>
      <div class="td">row 7-2</div>
      <div class="td">row 7-3</div>
      <div class="td">row 7-4</div>
    </div>
    <div class="tr">
      <div class="td">row 1-0</div>
      <div class="td">row 1-1</div>
      <div class="td">row 1-2</div>
      <div class="td">row 1-3</div>
      <div class="td">row 1-4</div>
    </div>
    <div class="tr">
      <div class="td">row 2-0</div>
      <div class="td">row 2-1</div>
      <div class="td">row 2-2</div>
      <div class="td">row 2-3</div>
      <div class="td">row 2-4</div>
    </div>
    <div class="tr">
      <div class="td">row 3-0</div>
      <div class="td">row 3-1</div>
      <div class="td">row 3-2</div>
      <div class="td">row 3-3</div>
      <div class="td">row 3-4</div>
    </div>
    <div class="tr">
      <div class="td">row 4-0</div>
      <div class="td">row 4-1</div>
      <div class="td">row 4-2</div>
      <div class="td">row 4-3</div>
      <div class="td">row 4-4</div>
    </div>
    <div class="tr">
      <div class="td">row 5-0</div>
      <div class="td">row 5-1</div>
      <div class="td">row 5-2</div>
      <div class="td">row 5-3</div>
      <div class="td">row 5-4</div>
    </div>
    <div class="tr">
      <div class="td">row 6-0</div>
      <div class="td">row 6-1</div>
      <div class="td">row 6-2</div>
      <div class="td">row 6-3</div>
      <div class="td">row 6-4</div>
    </div>
    <div class="tr">
      <div class="td">row 7-0</div>
      <div class="td">row 7-1</div>
      <div class="td">row 7-2</div>
      <div class="td">row 7-3</div>
      <div class="td">row 7-4</div>
    </div>
  </div>
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...