ΠŸΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ Π½Π° Python ΠΈ Objective-C Π² Mac OS

ΠŸΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ Π½Π° Python ΠΈ Objective-C ΠΏΠΎΠ΄ Mac OS ΠΈ для iPhone / iPod Touch

Html Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ: ΠšΡ€Π°ΡΠΈΠ²ΠΎΠ΅ ΠΎΡ„ΠΎΡ€ΠΌΠ»Π΅Π½ΠΈΠ΅ Ρ‚Π°Π±Π»ΠΈΡ†

Π‘ΠΎΠ΄Π΅Ρ€ΠΆΠ°Π½ΠΈΠ΅

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° ΠΈ Css

Π― Ρ…ΠΎΡ‡Ρƒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> ΠΈ CSS.

Π­Ρ‚ΠΎ ΠΌΠΎΠΉ ΠΎΠ±Ρ€Π°Π·Π΅Ρ† Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.

<body>
  <form>
      <div>
             <div>
                <div align="center">Customer ID</div>
                <div >Customer Name</div>
                <div >Customer Address</div>
             </div>
            <div>
                  <div>001</div>
                <div>002</div>
                <div>003</div>
            </div>
            <div>
                <div>xxx</div>
                <div>yyy</div>
                <div>www</div>
           </div>
            <div>
                <div>ttt</div>
                <div>uuu</div>
                <div>Mkkk</div>
           </div>

      </div>
  </form>
</body>

И Π‘Ρ‚ΠΈΠ»ΡŒ:

<style type="text/css">
    . divTable
    {
        display:  table;
        width:auto;
        background-color:#eee;
        border:1px solid  #666666;
        border-spacing:5px;/*cellspacing:poor IE support for  this*/
       /* border-collapse:separate;*/
    }

    .divRow
    {
       display:table-row;
       width:auto;
    }

    .divCell
    {
        float:left;/*fix for  buggy browsers*/
        display:table-column;
        width:200px;
        background-color:#ccc;
    }
</style>

Но эта Ρ‚Π°Π±Π»ΠΈΡ†Π° Π½Π΅ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ с IE7 ΠΈ Π½ΠΈΠΆΠ΅ вСрсии. ΠŸΠΎΠΆΠ°Π»ΡƒΠΉΡΡ‚Π°, Π΄Π°ΠΉΡ‚Π΅ ΠΌΠ½Π΅ своС Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ ΠΈ ΠΈΠ΄Π΅ΠΈ.
Бпасибо.

html

css

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ

Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ


Kumara Β  Β 

16 июня 2010 в 12:30

8 ΠΎΡ‚Π²Π΅Ρ‚ΠΎΠ²




270

.div-table {
  display: table;         
  width: auto;         
  background-color: #eee;         
  border: 1px solid #666666;         
  border-spacing: 5px; /* cellspacing:poor IE support for  this */
}
.div-table-row {
  display: table-row;
  width: auto;
  clear: both;
}
.div-table-col {
  float: left; /* fix for  buggy browsers */
  display: table-column;         
  width: 200px;         
  background-color: #ccc;  
}

ЗапускаСмый Ρ„Ρ€Π°Π³ΠΌΠ΅Π½Ρ‚ ΠΊΠΎΠ΄Π°:

.div-table {
  display: table;         
  width: auto;         
  background-color: #eee;         
  border: 1px solid #666666;         
  border-spacing: 5px; /* cellspacing:poor IE support for  this */
}
.div-table-row {
  display: table-row;
  width: auto;
  clear: both;
}
.div-table-col {
  float: left; /* fix for  buggy browsers */
  display: table-column;         
  width: 200px;         
  background-color: #ccc;  
}
<body>
  <form>
      <div>
             <div>
                <div align="center">Customer ID</div>
                <div >Customer Name</div>
                <div >Customer Address</div>
             </div>
            <div>
                  <div>001</div>
                <div>002</div>
                <div>003</div>
            </div>
            <div>
                <div>xxx</div>
                <div>yyy</div>
                <div>www</div>
           </div>
            <div>
                <div>ttt</div>
                <div>uuu</div>
                <div>Mkkk</div>
           </div>

      </div>
  </form>
</body>

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Shiva Komuravelly Β  Β 

12 июля 2011 в 11:36



94

div s Π½Π΅ слСдуСт ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ для Ρ‚Π°Π±Π»ΠΈΡ‡Π½Ρ‹Ρ… Π΄Π°Π½Π½Ρ‹Ρ…. Π­Ρ‚ΠΎ Ρ‚Π°ΠΊ ΠΆΠ΅ Π½Π΅ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ, ΠΊΠ°ΠΊ ΠΈ использованиС Ρ‚Π°Π±Π»ΠΈΡ† для ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ <table> . Π­Ρ‚ΠΎ Π»Π΅Π³ΠΊΠΎ, сСмантичСски ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ, ΠΈ Π²Ρ‹ Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΡ‚Π΅ Ρ‡Π΅Ρ€Π΅Π· 5 ΠΌΠΈΠ½ΡƒΡ‚.

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Kobi Β  Β 

16 июня 2010 в 12:32



9

Π­Ρ‚ΠΎ старая Ρ‚Π΅ΠΌΠ°, Π½ΠΎ я ΠΏΠΎΠ΄ΡƒΠΌΠ°Π», Ρ‡Ρ‚ΠΎ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΎΠΏΡƒΠ±Π»ΠΈΠΊΠΎΠ²Π°Ρ‚ΡŒ своС Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅. НСдавно я столкнулся с Ρ‚ΠΎΠΉ ΠΆΠ΅ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠΎΠΉ, ΠΈ я Ρ€Π΅ΡˆΠΈΠ» Π΅Π΅, слСдуя трСхэтапному ΠΏΠΎΠ΄Ρ…ΠΎΠ΄Ρƒ , описанному Π½ΠΈΠΆΠ΅, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΎΡ‡Π΅Π½ΡŒ прост Π±Π΅Π· ΠΊΠ°ΠΊΠΈΡ…-Π»ΠΈΠ±ΠΎ слоТных CSS .

(NOTE : ΠšΠΎΠ½Π΅Ρ‡Π½ΠΎ, для соврСмСнных Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ΠΎΠ² использованиС Π·Π½Π°Ρ‡Π΅Π½ΠΈΠΉ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π° table ΠΈΠ»ΠΈ table-row ΠΈΠ»ΠΈ table-cell для отобраТСния CSS Ρ€Π΅ΡˆΠΈΠ»ΠΎ Π±Ρ‹ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡƒ. Но ΠΏΠΎΠ΄Ρ…ΠΎΠ΄, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ я использовал, Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎ Ρ…ΠΎΡ€ΠΎΡˆΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ Π² соврСмСнных ΠΈ старых Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°Ρ…, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΎΠ½ Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ эти значСния для Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π° display CSS.)

3-Π¨ΠΠ“ΠžΠ’Π«Π™ ΠŸΠ ΠžΠ‘Π’ΠžΠ™ ΠŸΠžΠ”Π₯ΠžΠ”

Для Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с divs, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ячСйки ΠΈ строки, ΠΊΠ°ΠΊ Π² элСмСнтС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ ΠΏΠΎΠ΄Ρ…ΠΎΠ΄.

  1. Π—Π°ΠΌΠ΅Π½ΠΈΡ‚Π΅ элСмСнт Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π½Π° Π±Π»ΠΎΠΊ div (ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ класс .table )
  2. Π—Π°ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт tr ΠΈΠ»ΠΈ th Π½Π° Π±Π»ΠΎΠΊ div (ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ класс .row )
  3. Π—Π°ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт td встроСнным Π±Π»ΠΎΠΊΠΎΠΌ div (ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ класс .cell )
.table {display:block; }
.row { display:block;}
.cell {display:inline-block;}
    <h3>Table below using table element</h3>
    <table cellspacing="0" >
       <tr>
          <td>Mike</td>
          <td>36 years</td>
          <td>Architect</td>
       </tr>
       <tr>
          <td>Sunil</td>
          <td>45 years</td>
          <td>Vice President aas</td>
       </tr>
       <tr>
          <td>Jason</td>
          <td>27 years</td>
          <td>Junior Developer</td>
       </tr>
    </table>
    <h3>Table below is using Divs only</h3>
    <div>
       <div>
          <div>
             Mike
          </div>
          <div>
             36 years
          </div>
          <div>
             Architect
          </div>
       </div>
       <div>
          <div>
             Sunil
          </div>
          <div>
             45 years
          </div>
          <div>
             Vice President
          </div>
       </div>
       <div>
          <div>
             Jason
          </div>
          <div>
             27 years
          </div>
          <div>
             Junior Developer
          </div>
       </div>
    </div>

UPDATE 1

Π§Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±ΠΎΠΉΡ‚ΠΈ эффСкт, ΠΏΡ€ΠΈ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ одинаковая ΡˆΠΈΡ€ΠΈΠ½Π° Π½Π΅ сохраняСтся Π²ΠΎ всСх ячСйках столбца, ΠΊΠ°ΠΊ ΡƒΠΏΠΎΠΌΠΈΠ½Π°Π»ΠΎΡΡŒ thatslch Π² ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ, ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ любой ΠΈΠ· Π΄Π²ΡƒΡ… ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΎΠ², ΠΏΡ€ΠΈΠ²Π΅Π΄Π΅Π½Π½Ρ‹Ρ… Π½ΠΈΠΆΠ΅.

  • Π£ΠΊΠ°ΠΆΠΈΡ‚Π΅ ΡˆΠΈΡ€ΠΈΠ½Ρƒ для класса cell

    ячСйка {display:inline-block; width:340px;}

  • Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ CSS соврСмСнных Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ΠΎΠ², ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½ΠΈΠΆΠ΅.

    .table {display:table; }
    .row { display:table-row;}
    .cell {display:table-cell;}

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Sunil Β  Β 

03 июня 2016 в 17:43


  • Как ΠΎΠ±Π½ΠΎΠ²ΠΈΡ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π΅Π³Π° div с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ajax php

    Π£ мСня Π΅ΡΡ‚ΡŒ событиС ajax table click, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ ΠΏΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚ Π΄Π°Π½Π½Ρ‹Π΅ Π±Π°Π·Ρ‹ Π΄Π°Π½Π½Ρ‹Ρ… Π² соотвСтствии с ΠΈΠΌΠ΅Π½Π΅ΠΌ ΠΊΠ»ΠΈΠΊΠ° ΠΈΠ· ΠΏΠ΅Ρ€Π²ΠΎΠΉ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π΅Ρ‚ Π²Ρ‚ΠΎΡ€ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠ΅ΠΉ ΠΎ сотрудникС. ΠŸΡ€ΠΎΠ±Π»Π΅ΠΌΠ° Ρ‚Π΅ΠΏΠ΅Ρ€ΡŒ Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ΡΡ Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ Π΄Π°Π½Π½Ρ‹Π΅ ΠΎ сотрудниках Π½Π°ΠΊΠ°ΠΏΠ»ΠΈΠ²Π°ΡŽΡ‚ΡΡ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π²ΠΎ Π²Ρ‚ΠΎΡ€ΠΎΠΉ Ρ‚Π°Π±Π»ΠΈΡ†Π΅, я Ρ…ΠΎΡ‡Ρƒ ΠΎΠ±Π½ΠΎΠ²Π»ΡΡ‚ΡŒ…

  • Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π΅Π³Π° DIV с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Jquery?

    Π― создал Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π΄Π°Π½Π½Ρ‹Ρ… с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ <script> var table = ‘<table border=0 id=tblTestCases>’; table+=<tr bgcolor=’#e6e6e6′><td colspan=’3′>Number of text boxes = + $searchObject.find(‘[type=text]’).length + </td></tr>;…



4

Если Π² <table> Π΅ΡΡ‚ΡŒ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ Π²Π°ΠΌ Π½Π΅ нравится, ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ, Π²Ρ‹ ΠΌΠΎΠ³Π»ΠΈ Π±Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ„Π°ΠΉΠ» сброса ?

ΠΈΠ»ΠΈ

Ссли Π²Π°ΠΌ это Π½ΡƒΠΆΠ½ΠΎ для ΠΌΠ°ΠΊΠ΅Ρ‚Π° страницы, ΠΎΠ·Π½Π°ΠΊΠΎΠΌΡŒΡ‚Π΅ΡΡŒ с ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π°ΠΌΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π° cssplay для проСктирования Π²Π΅Π±-сайтов Π±Π΅Π· Ρ‚Π°Π±Π»ΠΈΡ†.

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Urszula Karzelek Β  Β 

16 июня 2010 в 12:39



4

Π― Π½Π΅ Π²ΠΈΠΆΡƒ Π½ΠΈΠΊΠ°ΠΊΠΎΠ³ΠΎ ΠΎΡ‚Π²Π΅Ρ‚Π°, учитывая сСтку-Css. Π― Π΄ΡƒΠΌΠ°ΡŽ, Ρ‡Ρ‚ΠΎ это ΠΎΡ‡Π΅Π½ΡŒ элСгантный ΠΏΠΎΠ΄Ρ…ΠΎΠ΄: grid-css Π΄Π°ΠΆΠ΅ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Π΅Ρ‚ ΠΏΡ€ΠΎΠΌΠ΅ΠΆΡƒΡ‚ΠΊΠΈ строк ΠΈ столбцов. Π—Π΄Π΅ΡΡŒ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°ΠΉΡ‚ΠΈ ΠΎΡ‡Π΅Π½ΡŒ Ρ…ΠΎΡ€ΠΎΡˆΡƒΡŽ ΡΡ‚Π°Ρ‚ΡŒΡŽ:

https://medium.com/@js_tut/css-grid-tutorial-filling-in-the-gaps-c596c9534611

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Neo Β  Β 

17 октября 2018 Π² 04:50



2

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹ΠΉ Ρ‚ΠΈΠΏ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°; это Ρ€Π΅ΡˆΠΈΡ‚ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡƒ. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ строку Π½ΠΈΠΆΠ΅ Π² Π½Π°Ρ‡Π°Π»ΠΎ Ρ„Π°ΠΉΠ»Π° HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


abcd Β  Β 

14 ΠΌΠ°Ρ€Ρ‚Π° 2012 Π² 06:14



2

НСмного НЕ ПО Π’Π•ΠœΠ•, Π½ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΌΠΎΡ‡ΡŒ ΠΊΠΎΠΌΡƒ-Ρ‚ΠΎ для Π±ΠΎΠ»Π΅Π΅ чистого HTML…
CSS

.common_table{
    display:table;
    border-collapse:collapse;
    border:1px solid grey;
    }
.common_table DIV{
    display:table-row;
    border:1px solid grey;
    }
.common_table DIV DIV{
    display:table-cell;
    }

HTML

<DIV>
   <DIV><DIV>this is a cell</DIV></DIV>
   <DIV><DIV>this is a cell</DIV></DIV>
</DIV>

Π Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ Π½Π° Chrome ΠΈ Firefox

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Harijs KrΕ«tainis Β  Β 

08 января 2016 Π² 07:44



2

ΠŸΡ€ΠΈ создании ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΎΠ³ΠΎ Π½Π°Π±ΠΎΡ€Π° Ρ‚Π΅Π³ΠΎΠ² ΠΌΠ°ΠΊΠ΅Ρ‚Π° я нашСл Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ ΠΎΡ‚Π²Π΅Ρ‚ Π½Π° эту ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡƒ. Π—Π΄Π΅ΡΡŒ прСдставлСн ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΠΉ Π½Π°Π±ΠΎΡ€ Ρ‚Π΅Π³ΠΎΠ² ΠΈ ΠΈΡ… классы CSS.

HTML

<layout-table>
   <layout-header> 
       <layout-column> 1 a</layout-column>
       <layout-column>  </layout-column>
       <layout-column> 3 </layout-column>
       <layout-column> 4 </layout-column>
   </layout-header>

   <layout-row> 
       <layout-column> a </layout-column>
       <layout-column> a 1</layout-column>
       <layout-column> a </layout-column>
       <layout-column> a </layout-column>
   </layout-row>

   <layout-footer> 
       <layout-column> 1 </layout-column>
       <layout-column>  </layout-column>
       <layout-column> 3 b</layout-column>
       <layout-column> 4 </layout-column>
   </layout-footer>
</layout-table>

CSS

layout-table
{
    display : table;
    clear : both;
    table-layout : fixed;
    width : 100%;
}

layout-table:unresolved
{
    color : red;
    border: 1px blue solid;
    empty-cells : show;
}

layout-header, layout-footer, layout-row 
{
    display : table-row;
    clear : both;   
    empty-cells : show;
    width : 100%;
}

layout-column 
{ 
    display : table-column;
    float : left;
    width : 25%;
    min-width : 25%;
    empty-cells : show;
    box-sizing: border-box;
    /* border: 1px solid white; */
    padding : 1px 1px 1px 1px;
}

layout-row:nth-child(even)
{ 
    background-color : lightblue;
}

layout-row:hover 
{ background-color: #f5f5f5 }

ΠšΠ»ΡŽΡ‡ΠΎΠΌ ΠΊ Ρ‚ΠΎΠΌΡƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ пустыС ячСйки ΠΈ ячСйки Π² Ρ†Π΅Π»ΠΎΠΌ ΠΈΠΌΠ΅Π»ΠΈ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹ΠΉ Ρ€Π°Π·ΠΌΠ΅Ρ€, являСтся Ρ€Π°Π·ΠΌΠ΅Ρ€ ΠΊΠΎΡ€ΠΎΠ±ΠΊΠΈ ΠΈ Π·Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅. Π“Ρ€Π°Π½ΠΈΡ†Π° Π±ΡƒΠ΄Π΅Ρ‚ Π΄Π΅Π»Π°Ρ‚ΡŒ Ρ‚ΠΎ ΠΆΠ΅ самоС, Π½ΠΎ создаСт линию Π² строкС. Обивка-Π½Π΅Ρ‚. И, хотя я Π΅Ρ‰Π΅ Π½Π΅ ΠΏΡ€ΠΎΠ±ΠΎΠ²Π°Π», я Π΄ΡƒΠΌΠ°ΡŽ, Ρ‡Ρ‚ΠΎ Margin Π±ΡƒΠ΄Π΅Ρ‚ Π΄Π΅ΠΉΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΠΈ Π·Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅, заставляя ΠΈ ΠΏΡƒΡΡ‚ΡƒΡŽ ячСйку ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ Π²ΠΈΠ·ΡƒΠ°Π»ΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ.

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


E Net Arch Β  Β 

27 июля 2016 в 18:32



ΠŸΠΎΡ…ΠΎΠΆΠΈΠ΅ вопросы:

ΠŸΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ стилСй CSS Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΊ ΠΎΠ΄Π½ΠΎΠΌΡƒ Div

Π£ мСня Π΅ΡΡ‚ΡŒ навигационная панСль, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ я сдСлал с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ bootstrap CSS. Π― Ρ…ΠΎΡ‚Π΅Π» Π±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π΅Π³ΠΎ Π½Π° свой сайт, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΡƒΠΆΠ΅ ΠΈΠΌΠ΅Π΅Ρ‚ свою Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ стилСй CSS, ΠΈ ΠΊΠΎΠ³Π΄Π° я ΠΏΡ€ΠΈΠΊΡ€Π΅ΠΏΠ»ΡΡŽ ΠΎΠ±Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ стилСй,…

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ div ΠΈ CSS

Π£ мСня Π΅ΡΡ‚ΡŒ Ρ‚Π΅Π³ΠΈ div Π² ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΌ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅: <div>first</div> <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div>…

Ρ†Π΅Π½Ρ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ Π°Π±ΡΠΎΠ»ΡŽΡ‚Π½ΠΎΠ³ΠΎ div с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ css

Π― всСгда ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ JQuery для Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΠΎΠ³ΠΎ цСнтрирования div, Π½ΠΎ Π½Π° этот Ρ€Π°Π· я дСлаю ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ Π±Π΅Π· ΠΊΠ°ΠΊΠΎΠΉ-Π»ΠΈΠ±ΠΎ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΊΠΈ JQuery ΠΈΠ»ΠΈ Javascript. поэтому я Ρ…ΠΎΡ‡Ρƒ Ρ†Π΅Π½Ρ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ div Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ css ΠΈ…

ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> Π±Π΅Π· использования Ρ‚Π΅Π³Π° dispaly:table

ΠœΠΎΠΆΠ΅Ρ‚ Π»ΠΈ ΠΊΡ‚ΠΎ-Π½ΠΈΠ±ΡƒΠ΄ΡŒ ΠΏΠΎΠΌΠΎΡ‡ΡŒ ΠΌΠ½Π΅ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с Ρ‚Π΅Π³ΠΎΠΌ div ΠΈ Π±Π΅Π· использования свойства display:table Π² asp.net mvc3. Π― Ρ…ΠΎΡ‡Ρƒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ эту Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ динамичСски с Π³Ρ€Π°Π½ΠΈΡ†Π°ΠΌΠΈ.

ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΈΠ΄Π΅Π°Π»ΡŒΠ½ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ 5Ρ…5 с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> , ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ выглядит ΠΊΠ°ΠΊ использованиС Ρ‚Π΅Π³Π° <table>

Π― создал ΠΌΠ½ΠΎΠ³ΠΎ Ρ‚Π°Π±Π»ΠΈΡ† с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <table> , Π½ΠΎ Π½Π΅ знаю, ΠΊΠ°ΠΊ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ Ρ‚ΠΎΡ‚ ΠΆΠ΅ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> . Π― пытался ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ‚ΠΎ ΠΆΠ΅ самоС, Π½ΠΎ ΠΏΠΎΠΊΠ° Π½Π΅ добился успСха. Π― ΠΏΡ€ΠΎΠ±ΡƒΡŽ…

Как ΠΎΠ±Π½ΠΎΠ²ΠΈΡ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π΅Π³Π° div с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ajax php

Π£ мСня Π΅ΡΡ‚ΡŒ событиС ajax table click, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ ΠΏΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚ Π΄Π°Π½Π½Ρ‹Π΅ Π±Π°Π·Ρ‹ Π΄Π°Π½Π½Ρ‹Ρ… Π² соотвСтствии с ΠΈΠΌΠ΅Π½Π΅ΠΌ ΠΊΠ»ΠΈΠΊΠ° ΠΈΠ· ΠΏΠ΅Ρ€Π²ΠΎΠΉ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π΅Ρ‚ Π²Ρ‚ΠΎΡ€ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠ΅ΠΉ ΠΎ сотрудникС. ΠŸΡ€ΠΎΠ±Π»Π΅ΠΌΠ° Ρ‚Π΅ΠΏΠ΅Ρ€ΡŒ…

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π΅Π³Π° DIV с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Jquery?

Π― создал Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π΄Π°Π½Π½Ρ‹Ρ… с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ <script> var table = ‘<table border=0 id=tblTestCases>’; table+=<tr bgcolor=’#e6e6e6′><td colspan=’3′>Number of text boxes = +…

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΏΠΎ CSS для Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… Ρ‚Π΅Π³ΠΎΠ² div?

Π£ мСня Π΅ΡΡ‚ΡŒ страница с 6 Ρ‚Π΅Π³Π°ΠΌΠΈ <div> ΠΈ Π½Π΅Ρ‚ доступа ΠΊ Html этой страницы. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ я ΠΏΡ‹Ρ‚Π°ΡŽΡΡŒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с css для этих ΠΏΠΎΠ»Π΅ΠΉ. ΠŸΠΎΠΆΠ°Π»ΡƒΠΉΡΡ‚Π°, смотритС ΠΏΡ€ΠΈΠ»Π°Π³Π°Π΅ΠΌΡƒΡŽ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΡƒ : Код Html выглядит…

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> ΠΈ bootstrap?

Π£ мСня Π΅ΡΡ‚ΡŒ ΠΊΠΎΠ΄ Π½ΠΈΠΆΠ΅, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ‚Π΅Π³ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹. Но я Ρ…ΠΎΡ‡Ρƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ‚Π° ΠΆΠ΅ Ρ‚Π°Π±Π»ΠΈΡ†Π° использовала Ρ‚Π΅Π³ div. Π― пытался, Π½ΠΎ Π½Π΅ смог ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ‚ΠΎ ΠΆΠ΅ самоС. НиТС я Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΡ€ΠΈΠ»ΠΎΠΆΠΈΠ» ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅. ΠŸΠΎΠΆΠ°Π»ΡƒΠΉΡΡ‚Π°, ΠΏΠΎΠΌΠΎΠ³ΠΈΡ‚Π΅…

Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ 2-ΠΌΠ΅Ρ€Π½ΠΎΠΉ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ с div Π±Π΅Π· Ρ‚Π΅Π³Π° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ javascript

Π― Ρ…ΠΎΡ‡Ρƒ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° div Π±Π΅Π· Ρ‚Π΅Π³Π° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ с использованиСм javascript. Π― сдСлал это сам, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ div, Π½ΠΎ я Π½Π΅ ΠΌΠΎΠ³Ρƒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ js. МнС Π½ΡƒΠΆΠ΅Π½ порядковый Π½ΠΎΠΌΠ΅Ρ€ Π²Π½ΡƒΡ‚Ρ€ΠΈ…

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³ΠΎΠ² div?

Π­Ρ‚ΠΎΡ‚ вопрос Π½Π° самом Π΄Π΅Π»Π΅ ΠΏΡ€ΠΈΡˆΠ΅Π» ΠΈΠ· ΠΌΠΎΠΈΡ… экспСримСнтов с Ρ„Ρ€Π΅ΠΉΠΌΠ²ΠΎΡ€ΠΊΠΎΠΌ GWT, Π½ΠΎ я Ρ€Π΅ΡˆΠΈΠ» ΡƒΠΏΡ€ΠΎΡΡ‚ΠΈΡ‚ΡŒ этот вопрос.

Π― ΠΏΡ‹Ρ‚Π°ΡŽΡΡŒ Π·Π°ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ‡Π½Ρ‹ΠΉ Ρ‚Π΅Π³ Π½Π° divs. Как я ΠΌΠΎΠ³Ρƒ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΠΎ Π²Ρ‹Ρ€ΠΎΠ²Π½ΡΡ‚ΡŒ Π΄Π²Π° Ρ‚Π΅Π³Π° DIV, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ содСрТат Π΄Π²Π° Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎ Π²Ρ‹Ρ€ΠΎΠ²Π½Π΅Π½Π½Ρ‹Ρ… Ρ‚Π΅Π³Π° DIV ?

Π’ΠΎΡ‚ Ρ‡Ρ‚ΠΎ Ρƒ мСня Π΅ΡΡ‚ΡŒ:

<!doctype html>
<html>
<body>
<div>
    <div>
        <div >Name:</div>
        <div >Address:</div>
    </div>
    <div>
        <div >test1</div>
        <div >test2</div>
    </div>
</div>
</body>
</html>

Π­Ρ‚ΠΎ оказываСтся Π² ΠΌΠΎΠΉ Ρ…Ρ€ΠΎΠΌ 15.0.874.106 ΠΌ:

Name:
Address:
test1
test2

Π³Π΄Π΅ я ΠΈ ΠΎΠΆΠΈΠ΄Π°Π» Π΅Π³ΠΎ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ:

Name:    test1
Address: test2

НС ΠΌΠΎΠ³Π»ΠΈ Π±Ρ‹ Π²Ρ‹ ΠΌΠ½Π΅ ΠΏΠΎΠΌΠΎΡ‡ΡŒ, поТалуйста ?

html

css

css-tables

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ

Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ


expert Β  Β 

13 ноября 2011 Π² 08:04

7 ΠΎΡ‚Π²Π΅Ρ‚ΠΎΠ²


  • ΠžΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Ρ‚Π΅Π³ΠΎΠ² div с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ jQuery

    Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ VS.Net 2008. Π― создал Π²Π΅Π±-ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Ajax Π² C#. Π² webform1 Ρƒ мСня Π΅ΡΡ‚ΡŒ 6 Ρ‚Π΅Π³ΠΎΠ² div. Π’ ΠΊΠ°ΠΆΠ΄ΠΎΠΌ ΠΈΠ· Ρ‚Π΅Π³ΠΎΠ² div, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ я Ρ…ΠΎΡ‡Ρƒ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ Ρ„Π°ΠΉΠ» .acsx. Π—Π΄Π΅ΡΡŒ я ΠΌΠΎΠ³Ρƒ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒΡΡ ΠΌΠ΅ΠΆΠ΄Ρƒ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΠΈΠ· Π²ΠΊΠ»Π°Π΄ΠΎΠΊ, созданных с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ DIV ΠΈ Jquery. Π’Π΅ΠΏΠ΅Ρ€ΡŒ, ΠΊΠΎΠ³Π΄Π° я Π½Π°Ρ…ΠΎΠΆΡƒΡΡŒ Π² UserControl1.acsx ΠΈ наТимаю…

  • Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> ΠΈ Css

    Π― Ρ…ΠΎΡ‡Ρƒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> ΠΈ CSS. Π­Ρ‚ΠΎ ΠΌΠΎΠΉ ΠΎΠ±Ρ€Π°Π·Π΅Ρ† Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹. <body> <form id=form1> <div class=divTable> <div class=headRow> <div class=divCell align=center>Customer ID</div> <div class=divCell>Customer Name</div> <div…



14

HTML Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ подходят для прСдставлСния Ρ‚Π°Π±Π»ΠΈΡ‡Π½Ρ‹Ρ… Π΄Π°Π½Π½Ρ‹Ρ…. ΠŸΡ€ΠΎΡΡ‚ΠΎ Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ для ΠΎΠ±Ρ‰Π΅ΠΉ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ. Однако Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΏΠΎ-ΠΏΡ€Π΅ΠΆΠ½Π΅ΠΌΡƒ Π»ΡƒΡ‡ΡˆΠ΅ подходят для Ρ‚Π°Π±Π»ΠΈΡ‡Π½Ρ‹Ρ… Π΄Π°Π½Π½Ρ‹Ρ….

UPDATE: Π’ дальнСйшСм Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚ΡŒΡΡ ΠΊ спСцификации ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ сСтки CSS3: http://www.w3.org/TR/css3-grid-layout/

Но ΠΊΠ°ΠΊ Π΅ΡΡ‚ΡŒ, Ссли Π²Ρ‹ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π·Π°ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π΅Π³ΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ ΠΏΠΎ ΠΊΠ°ΠΊΠΎΠΉ-Π»ΠΈΠ±ΠΎ ΠΏΡ€ΠΈΡ‡ΠΈΠ½Π΅, я Π±Ρ‹ установил всС столбцы ΠΊΠ°ΠΊ Ρ„ΠΈΠΊΡΠΈΡ€ΠΎΠ²Π°Π½Π½ΡƒΡŽ ΡˆΠΈΡ€ΠΈΠ½Ρƒ, ΠΏΠ»Π°Π²Π°ΡŽΡ‰ΡƒΡŽ Π²Π»Π΅Π²ΠΎ ΠΈ Ρ‡ΠΈΡΡ‚ΡƒΡŽ Π² ΠΏΠ΅Ρ€Π²ΠΎΠΌ столбцС. Если Π²Π°ΠΌ Π½ΡƒΠΆΠ½Π° разная ΡˆΠΈΡ€ΠΈΠ½Π° для Ρ€Π°Π·Π½Ρ‹Ρ… столбцов, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Π΅ классы для этих столбцов ΠΈ Π·Π°Π΄Π°Ρ‚ΡŒ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΡƒΡŽ ΡˆΠΈΡ€ΠΈΠ½Ρƒ. Но Ссли Π² вашСй Ρ‚Π°Π±Π»ΠΈΡ†Π΅ Π΅ΡΡ‚ΡŒ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΠ΅ Π΄Π°Π½Π½Ρ‹Π΅, Π²Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒΡΡ, Ρ‡Ρ‚ΠΎ overflow:hidden Π²ΠΊΠ»ΡŽΡ‡Π΅Π½, ΠΈΠ½Π°Ρ‡Π΅ ΠΎΠ½ сломаСт Π²Π°ΡˆΡƒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ.

Π― вставил ΠΊΠΎΠ΄ сюда, Π½ΠΎ я Ρ‚Π°ΠΊΠΆΠ΅ создал ссылку jsfiddle .

Π’ΠΎΡ‚ html:

<div>

    <div>Name:</div>
    <div>test1</div>

    <div>Address:</div>
    <div>test2</div>

</div>

И стили:

.table .column{
   width: 100px;
   float: left;
}

.table .column.first{
   clear: left;   
}

Однако Π²Ρ‹ ΡΡ‚ΠΎΠ»ΠΊΠ½Π΅Ρ‚Π΅ΡΡŒ с ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠ°ΠΌΠΈ, ΠΊΠΎΠ³Π΄Π° тСкст Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ измСнится. Π­Ρ‚ΠΎ Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Π΄Π΅ΠΉΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ ΠΊΠ°ΠΊ стол. НапримСр, ΠΊΠΎΠ³Π΄Π° тСкст ячСйки пСрСносится Π½Π° ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΡƒΡŽ строку, ΠΎΠ½ Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π΅Π³ΡƒΠ»ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ высоту всСх ячССк Π² этой строкС, ΠΊΠ°ΠΊ Π²Ρ‹ ΠΎΠΆΠΈΠ΄Π°Π»ΠΈ Π±Ρ‹ ΠΎΡ‚ ячСйки. ΠžΡ‚ΡΡŽΠ΄Π° ΠΈ ΠΏΠ΅Ρ€Π΅ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅: скрыто ΠΈΠ»ΠΈ просто ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ HTML.

НадСюсь, это ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚…

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Homer6 Β  Β 

13 ноября 2011 Π² 08:11



11

Π― Π΄ΡƒΠΌΠ°ΡŽ, Ρ‡Ρ‚ΠΎ для ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π°, Ρƒ вас Π΅ΡΡ‚ΡŒ фактичСская Ρ‚Π°Π±Π»ΠΈΡ†Π°, Π±Ρ‹Π»ΠΎ Π±Ρ‹ Π±ΠΎΠ»Π΅Π΅ умСстно, ΠΎΠ΄Π½Π°ΠΊΠΎ; Π²Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π²Ρ€ΠΎΠ΄Π΅ этого:

<body>
 <div>
  <div>
   <div>Name:</div>
   <div>test1</div>
  </div>
  <div>
   <div>Address:</div>
   <div>test2</div>
  </div>
 </div>
</body>

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


neurotik Β  Β 

13 ноября 2011 Π² 08:18



1

    <div>
        <div>
            <div >Name:</div>
            <div >Address:</div>
        </div>
        <div>
            <div >test1</div>
            <div >test2</div>
        </div>
<div></div>
    </div>

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Moe Sweet Β  Β 

13 ноября 2011 Π² 08:08


  • Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ div

    Π― Ρ…ΠΎΡ‡Ρƒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°ΠΊΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, Π½ΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ div вмСсто table <style type=text/css> body{ font-family:Segoe UI, Tahoma } td { padding:0px 5px 10px 5px; } .username { white-space:nowrap; vertical-align:top; text-align:right; width:auto; color:DodgerBlue; } </style> <table width=500px…

  • Как ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ эту Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³ΠΎΠ² <table> , <tr> , <td> ΠΈ <div> ?

    Π― Ρ…ΠΎΡ‡Ρƒ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, Π½ΠΎ Ρƒ мСня Π²ΠΎΠ·Π½ΠΈΠΊΠ»ΠΈ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ трудности с выяснСниСм Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊΠΈΠ΅ элСмСнты ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ, ΠΊΠΎΠ³Π΄Π°. На Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚ эта Ρ‚Π°Π±Π»ΠΈΡ†Π° Ρ€Π΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Π½Π° с использованиСм Ρ‚Π΅Π³ΠΎΠ² table , ΠΏΡ€ΠΈΡ‡Π΅ΠΌ пСрвая строка выполняСтся с использованиСм Ρ‚Π΅Π³ΠΎΠ² tr ΠΈ td . РСальная ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠ° Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ΡΡ Π²…



1

CSS3 ΠΈΠΌΠ΅Π΅Ρ‚ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π±ΠΈΠ»Π΅Ρ‚:

.tabl {width:400px;border:1px solid blue;display:table}
.row {height:40px;display:table-row}
.cell {border:1px solid black;display:table-cell}
    <div>
 <div>
  <div> CELL one</div>
  <div> CELL two</div>
  <div> CELL three</div></div>
 <div>
  <div> CELL four
  </div><div> CELL five</div>
  <div> 
   <div>
    <div>
     <div>CELL 6A</div>
     <div>CELL6B</div>
    </div>
   </div>
  </div>
 </div>
</div>

Π­Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ связано со структурой, которая выглядит ΠΊΠ°ΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Π°, Π’ этом случаС я Π²ΠΊΠ»ΡŽΡ‡ΠΈΠ» Π²Π»ΠΎΠΆΠ΅Π½Π½ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ:

Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅, Π²Ρ‹, вСроятно, ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ внСшнюю ΠΎΠ±ΠΎΠ»ΠΎΡ‡ΠΊΡƒ, Π² ΠΎΡ‚Π»ΠΈΡ‡ΠΈΠ΅ ΠΎΡ‚ Ρ€Π΅Π°Π»ΡŒΠ½ΠΎΠΉ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, строки ΠΈ ячСйки, ΠΏΠΎΡ…ΠΎΠΆΠ΅, Π² Π½Π΅ΠΉ Π½Π΅ Π½ΡƒΠΆΠ΄Π°ΡŽΡ‚ΡΡ. К соТалСнию, это Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π² соврСмСнных Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°Ρ…, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‚ CSS3, Ρ‡Ρ‚ΠΎ ΠΈΡΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ IE, Π²ΠΊΠ»ΡŽΡ‡Π°Ρ IE9.

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


COBOLdinosaur Β  Β 

13 ноября 2011 Π² 08:22



1

вашС Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ΡΡ Π² ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΌ :-
PLease ΠΏΡ€ΠΎΠ²Π΅Ρ€ΡŒΡ‚Π΅ это

 <style type="text/css">
     .Table
     {
      display: table;
     }
     .Row
     {
      display: table-row;
     }
     .Cell
     {
      display: table-cell;
     }
    </style>
 <!doctypehtml>
    <html>
    <body>
    <div>
     <div>
      <p>Name:</p>
     </div>
     <div>
      <p>Test1</p>
     </div>
    </div>
    <div>
     <div>
      <p>Address:</p>
     </div>
     <div>
      <p>Test2</p>
     </div>
    </div>
    </body>
    </html>

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Muder Surti Β  Β 

10 дСкабря 2013 Π² 11:47



0

Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π΄ΠΈΠ½Π°ΠΌΠΈΡ‡Π΅ΡΠΊΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ‡Π½ΡƒΡŽ структуру, ΠΏΠΎΠΏΡ€ΠΎΠ±ΡƒΠΉΡ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ jqGrid ( Π΄Π΅ΠΌΠΎ )

Или Ссли ваша Ρ†Π΅Π»ΡŒ другая ΠΈ Π²Ρ‹ всС Π΅Ρ‰Π΅ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΏΠΎΠΉΡ‚ΠΈ с div? ΠŸΠΎΠΏΡ€ΠΎΠ±ΡƒΠΉ это..

ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ float:left; вмСсто display:inline . Float сТимаСт div Π΄ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π° содСрТимого, освобоТдая мСсто для Π΄Ρ€ΡƒΠ³ΠΈΡ… элСмСнтов. Π­Ρ‚ΠΎ заставляСт Π΄Ρ€ΡƒΠ³ΠΈΠ΅ элСмСнты Ρ€Π°Π·ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒΡΡ рядом с ΠΏΠ»Π°Π²Π°ΡŽΡ‰ΠΈΠΌ элСмСнтом.

Π˜ΡΠΏΡ€Π°Π²Π»Π΅Π½Π½Ρ‹ΠΉ ΠΊΠΎΠ΄:

<!doctype html>
<html>
<body>
<div>
    <div>
        <div >Name:</div>
        <div >Address:</div>
    </div>
    <div>
        <div >test1</div>
        <div >test2</div>
    </div>
</div>
</body>
</html>

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Pavan Kondapuram Β  Β 

13 ноября 2011 Π² 08:18




0

Бпособ Мо довольно ΠΊΡ€ΡƒΡ‚ΠΎΠΉ, Π½ΠΎ ΠΎΠ½ Π½Π΅ стандартный.
Π­Ρ‚ΠΎ Π»ΡƒΡ‡ΡˆΠΈΠΉ способ.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ CSS ΠΊΠΎΠΌΠ°Π½Π΄Ρƒ «float» Ρ‚Π°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ это:

HTML Код:

  .gwt-Label
    {
        float: left;
        width: 50%
        }
<!doctype html>
    <html>
    <head>
        <link href="Style.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <div>
        <div>
            <div >Name:</div>
            <div >test1</div>
        </div>
        <div>
            <div >Address:</div>
            <div >test2</div>
        </div>
    </div>
    </body>
    </html>



  

Или Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΠΌΠ΅Ρ‚ΡŒ всС это Π² ΠΎΠ΄Π½ΠΎΠΌ мСстС:

<!doctype html>
    <html>
    <head>
    
        <style type="text/css">
            .gwt-Label{
            float: left;
            width: 50%
            }
        </style>
    
    </head>
    <body>
    <div>
        <div>
            <div >Name:</div>
            <div >test1</div>
        </div>
        <div>
            <div >Address:</div>
            <div >test2</div>
        </div>
    </div>
    </body>
    </html>

ΠŸΠΎΠ΄Π΅Π»ΠΈΡ‚ΡŒΡΡ


Mahyar Kakaee Β  Β 

13 ноября 2011 Π² 08:20


ΠŸΠΎΡ…ΠΎΠΆΠΈΠ΅ вопросы:

ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> Π±Π΅Π· использования Ρ‚Π΅Π³Π° dispaly:table

ΠœΠΎΠΆΠ΅Ρ‚ Π»ΠΈ ΠΊΡ‚ΠΎ-Π½ΠΈΠ±ΡƒΠ΄ΡŒ ΠΏΠΎΠΌΠΎΡ‡ΡŒ ΠΌΠ½Π΅ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с Ρ‚Π΅Π³ΠΎΠΌ div ΠΈ Π±Π΅Π· использования свойства display:table Π² asp.net mvc3. Π― Ρ…ΠΎΡ‡Ρƒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ эту Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ динамичСски с Π³Ρ€Π°Π½ΠΈΡ†Π°ΠΌΠΈ.

Как я ΠΌΠΎΠ³Ρƒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°ΠΊΡƒΡŽ систСму Ρ‚Π΅Π³ΠΎΠ², ΠΊΠ°ΠΊ stackoverflow.com?

Π― ΡΠΎΠ±ΠΈΡ€Π°ΡŽΡΡŒ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ сайт для ΠΏΡƒΠ±Π»ΠΈΠΊΠ°Ρ†ΠΈΠΈ с Ρ‚Π΅Π³Π°ΠΌΠΈ. Π’Π΅Π³ΠΈ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ Π΄ΠΎ пяти количСство Ρ‚Π΅Π³ΠΎΠ², ΠΊΠ°ΠΊ Π² stackoverflow.com. ΠœΠΎΠΆΠ΅Ρ‚ Π»ΠΈ ΠΊΡ‚ΠΎ-Π½ΠΈΠ±ΡƒΠ΄ΡŒ ΡΠΊΠ°Π·Π°Ρ‚ΡŒ систСму Ρ‚Π΅Π³ΠΎΠ² StackOverflow? РСляционная систСма Π±Π°Π·…

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π½ΠΎΠ²ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ со строками с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ jquery ΠΈ ΠΎΠ±Π΅Ρ€Π½ΡƒΡ‚ΡŒ Π΅Π΅ Π²Π½ΡƒΡ‚Ρ€ΠΈ div

Π― Ρ…ΠΎΡ‚Π΅Π» Π±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π²Π½ΡƒΡ‚Ρ€ΠΈ элСмСнта div Π’ ΠΌΠΎΠ΅ΠΌ Ρ„Π°ΠΉΠ»Π΅ .html Ρƒ мСня Π΅ΡΡ‚ΡŒ Π²ΠΎΡ‚ это <div> </div> Π’ ΠΌΠΎΠ΅ΠΌ js-Ρ„Π°ΠΉΠ»Π΅ я Ρ…ΠΎΡ‡Ρƒ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π½ΠΎΠ²ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ со строками ΠΈ Π΄Π°Π½Π½Ρ‹ΠΌΠΈ Как я…

ΠžΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Ρ‚Π΅Π³ΠΎΠ² div с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ jQuery

Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ VS.Net 2008. Π― создал Π²Π΅Π±-ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Ajax Π² C#. Π² webform1 Ρƒ мСня Π΅ΡΡ‚ΡŒ 6 Ρ‚Π΅Π³ΠΎΠ² div. Π’ ΠΊΠ°ΠΆΠ΄ΠΎΠΌ ΠΈΠ· Ρ‚Π΅Π³ΠΎΠ² div, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ я Ρ…ΠΎΡ‡Ρƒ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ Ρ„Π°ΠΉΠ» .acsx. Π—Π΄Π΅ΡΡŒ я ΠΌΠΎΠ³Ρƒ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒΡΡ ΠΌΠ΅ΠΆΠ΄Ρƒ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΠΈΠ·…

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> ΠΈ Css

Π― Ρ…ΠΎΡ‡Ρƒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <div> ΠΈ CSS. Π­Ρ‚ΠΎ ΠΌΠΎΠΉ ΠΎΠ±Ρ€Π°Π·Π΅Ρ† Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹. <body> <form id=form1> <div class=divTable> <div class=headRow> <div class=divCell…

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ div

Π― Ρ…ΠΎΡ‡Ρƒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°ΠΊΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, Π½ΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ div вмСсто table <style type=text/css> body{ font-family:Segoe UI, Tahoma } td { padding:0px 5px 10px 5px; } .username { white-space:nowrap;…

Как ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ эту Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³ΠΎΠ² <table> , <tr> , <td> ΠΈ <div> ?

Π― Ρ…ΠΎΡ‡Ρƒ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, Π½ΠΎ Ρƒ мСня Π²ΠΎΠ·Π½ΠΈΠΊΠ»ΠΈ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ трудности с выяснСниСм Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊΠΈΠ΅ элСмСнты ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ, ΠΊΠΎΠ³Π΄Π°. На Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚ эта Ρ‚Π°Π±Π»ΠΈΡ†Π° Ρ€Π΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Π½Π° с использованиСм Ρ‚Π΅Π³ΠΎΠ² table…

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π²Ρ€Π΅ΠΌΠ΅Π½Π½ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ· Ρ‚Π΅Π³ΠΎΠ²?

Π£ мСня Π΅ΡΡ‚ΡŒ product_table с product_id срСди Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… Π΄Ρ€ΡƒΠ³ΠΈΡ… ΠΏΠΎΠ»Π΅ΠΉ. Π― создаю tag_table с 2 полями, tag_id ΠΈ tag_name . Π’Π΅Π³ΠΈ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ Π»ΡŽΠ±Ρ‹ΠΌΠΈ, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ «silver» ΠΈΠ»ΠΈ «penn…

Π’Π°Π±Π»ΠΈΡ†Ρ‹ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³ΠΎΠ² div

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³ΠΎΠ² div Ρ‚Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ столбцы Π² строкС ΠΈΠΌΠ΅Π»ΠΈ ΡˆΠΈΡ€ΠΈΠ½Ρƒ, ΠΎΡΠ½ΠΎΠ²Π°Π½Π½ΡƒΡŽ Π½Π° доступном пространствС Π² столбцС div. Π’ ΠΏΡ€ΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π½ΠΈΠΆΠ΅ ΠΊΠΎΠ΄Π΅ пСрвая строка 3 столбца Π΄ΠΎΠ»ΠΆΠ½Π°…

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΏΠΎ CSS для Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… Ρ‚Π΅Π³ΠΎΠ² div?

Π£ мСня Π΅ΡΡ‚ΡŒ страница с 6 Ρ‚Π΅Π³Π°ΠΌΠΈ <div> ΠΈ Π½Π΅Ρ‚ доступа ΠΊ Html этой страницы. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ я ΠΏΡ‹Ρ‚Π°ΡŽΡΡŒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с css для этих ΠΏΠΎΠ»Π΅ΠΉ. ΠŸΠΎΠΆΠ°Π»ΡƒΠΉΡΡ‚Π°, смотритС ΠΏΡ€ΠΈΠ»Π°Π³Π°Π΅ΠΌΡƒΡŽ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΡƒ : Код Html выглядит…

HTML. Как Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ | Π–ΠΈΠ·Π½ΡŒ — это Π΄Π²ΠΈΠΆΠ΅Π½ΠΈΠ΅! А тСстированиС

Π›ΡŽΠ±Π°Ρ Ρ‚Π°Π±Π»ΠΈΡ†Π° состоит ΠΈΠ· строк ΠΈ столбцов. На ΠΈΡ… пСрСсСчСнии β€” ячСйки. ΠŸΠ΅Ρ€Π²Π°Ρ строа Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ β€” строка с Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°ΠΌΠΈ.Β 

Π’Π°Π±Π»ΠΈΡ†Π° Π² Π±Π»ΠΎΠ³Π΅ ΠΈΠ»ΠΈ Π²ΠΎΡ€Π΄Π΅

ΠšΠΎΡ€ΠΎΡ‚ΠΊΠΎ ΠΎ Π³Π»Π°Π²Π½ΠΎΠΌ

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌ Ρ‚Π΅Π³ΠΈ

  • table Β  Β β€” Π½Π°Ρ‡ΠΈΠ½Π°Π΅ΠΌ Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ
  • tr Β  Β  Β  Β  β€” строка Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, содСрТит Π² сСбС Π½Π°Π±ΠΎΡ€ th ΠΈΠ»ΠΈ td
  • th Β  Β  Β  Β β€” ячСйка Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° Π² строкС tr. Бколько эл-ΠΎΠ² <th> β€” ΡΡ‚ΠΎΠ»ΡŒΠΊΠΎ столбцов Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅.
  • td Β  Β  Β  Β β€” ячСйка Π² строкС tr

ΠŸΠΎΠ΄Ρ€ΠΎΠ±Π½Π΅Π΅ ΠΎ Ρ‚Π΅Π³Π°Ρ…

Π’Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π΅Π³ΠΎΠ² table Π±ΡƒΠ΄Π΅Ρ‚ наша Ρ‚Π°Π±Π»ΠΈΡ†Π°.
Π€ΠΎΡ€ΠΌΠΈΡ€ΡƒΠ΅ΠΌ Π΅Π΅ построчно. TR β€” ΠΎΠ΄Π½Π° строка. ΠžΡ‚ΠΊΡ€Ρ‹Π²Π°Π΅ΠΌ Ρ‚Π΅Π³ TR ΠΈ Π²Π½ΡƒΡ‚Ρ€ΠΈ пСрСчисляСм ячСйки ΠΎΠ΄Π½Ρƒ Π·Π° Π΄Ρ€ΡƒΠ³ΠΎΠΉ.

<table>
<!— Π‘Ρ‚Ρ€ΠΎΠΊΠ° Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ² —>
<tr>
<th>НазваниС столбца 1</th>
<th>НазваниС столбца 2</th>
</tr>
<!— Β ΠŸΠ΅Ρ€Π²Π°Ρ строка послС Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ².Β 
Β  Β  Β  Β  Β  Β  Β  Β  ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт td — ячСйка строки —>
<tr>
<td>Π­Ρ‚Π° ячСйка относится ΠΊ столбцу 1</td>
<td>Π­Ρ‚Π° ячСйка относится ΠΊ столбцу 2</td>
</tr>
<!—  Вторая строка Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ —>
<tr>
<td>Π­Ρ‚Π° ячСйка относится ΠΊ столбцу 1</td>
<td>Π­Ρ‚Π° ячСйка относится ΠΊ столбцу 2</td>
</tr>
Β </table>

Π‘ΠΌ Ρ‚Π°ΠΊΠΆΠ΅:
ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ Π² ΠΊΠΎΠ΄Π΅ β€” ΠΊΠ°ΠΊ Ρ€Π°ΡΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ

CSS-ΠΊΠΎΠ΄

Π§Ρ‚ΠΎΠ±Ρ‹ Ρ‚Π°Π±Π»ΠΈΡ†Π° ΠΎΡ‚Ρ€ΠΈΡΠΎΠ²Ρ‹Π²Π°Π»Π°ΡΡŒ Π² Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅, Π½ΡƒΠΆΠ½ΠΎ Π² Ρ€Π°Π·Π΄Π΅Π» Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ нСбольшой CSS-ΠΊΠΎΠ΄:

<head>
Β  Β  Β <meta http-equiv=»Content-Type» content=»text/html; charset=windows-1251″ />
<!— ΠŸΡ€ΠΎΡΡ‚ΠΎ нСбольшой Ρ„Ρ€Π°Π³ΠΌΠΏΠ΅Π½Ρ‚ CSS-ΠΊΠΎΠ΄Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΌΠΎΠΆΠ½ΠΎ Π±Ρ‹Π»ΠΎ Π²ΠΈΠ΄Π΅Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π²Β 
Β  Β  Β  Β  Β Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅. НС Π΄ΡƒΠΌΠ°ΠΉΡ‚Π΅ ΠΏΠΎΠΊΠ° ΠΎ Π½Π΅ΠΌ πŸ™‚ —>
<style type = «text/css»>
td, th {border: 1px solid black;}
</style>
</head>

ΠŸΡ€ΠΈΠΌΠ΅Ρ€

НарисуСм Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°ΠΌΠΈ Π±Π°Π³ΠΎΠ² ΠΈ ΡƒΠ»ΡƒΡ‡ΡˆΠ΅Π½ΠΈΠΉ ΠΈΠ· ΠΏΡƒΠ½ΠΊΡ‚Π° 3 ΡΡ‚Π°Ρ‚ΡŒΠΈ «Как Π·Π°Π²ΠΎΠ΄ΠΈΡ‚ΡŒ Π·Π°Π΄Π°Ρ‡ΠΈ Π² Π±Π°Π³-Ρ‚Ρ€Π΅ΠΊΠ΅Ρ€Β».

<!— Π’Π΅Π³ table ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ начинаСтся Ρ‚Π°Π±Π»ΠΈΡ†Π° —>
<table>
<!— Π­Ρ‚ΠΎ пСрвая строка, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ ΠΌΡ‹ Π½Π°Ρ‡ΠΈΠ½Π°Π΅ΠΌ Ρ‚Π΅Π³ΠΎΠΌ tr.Β 
ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт tr Ρ„ΠΎΡ€ΠΌΠΈΡ€ΡƒΠ΅Ρ‚ строку Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹. НС столбСц! —>
<tr>
<!— ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт th — Π½Π°Π·Π²Π°Π½ΠΈΠ΅ столбца Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.Β 
Β  Β ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈΒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΏΠ΅Ρ€Π΅Ρ‡ΠΈΡΠ»ΡΡŽΡ‚ΡΡ ΠΎΠ΄ΠΈΠ½ Π·Π° Π΄Ρ€ΡƒΠ³ΠΈΠΌ.Β 
Β  Β Π’ Ρ‚Π°ΠΊΠΎΠΉ ΠΏΠΎΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ ΠΎΠ½ΠΈ ΠΈ ΠΎΠ±Ρ€Π°Π·ΡƒΡŽΡ‚ строку tr —>
<th>Π‘Π°Π³</th>
<th>Π£Π»ΡƒΡ‡ΡˆΠ΅Π½ΠΈΠ΅</th>
</tr>
<!— Β ΠŸΠ΅Ρ€Π²Π°Ρ строка послС Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ². ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт td — ячСйка строки —>
<tr>
<!— Π­Ρ‚Π° ячСйка относится ΠΊ столбцу Β«Π‘Π°Π³Β» —>
<td>МоТно Π·Π°Ρ€Π΅Π³ΠΈΡΡ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ с ΠΈΠΌΠ΅Π½Π΅ΠΌ ΠšΡ‚ΡƒΠ»Ρ…Ρƒ</td>
<!— Π­Ρ‚Π° ячСйка относится ΠΊ столбцу Β«Π£Π»ΡƒΡ‡ΡˆΠ΅Π½ΠΈΠ΅Β» —>
<td>Π—Π°ΠΏΡ€Π΅Ρ‚ΠΈΡ‚ΡŒ Ρ€Π΅Π³ΠΈΡΡ‚Ρ€Π°Ρ†ΠΈΡŽ с ΠΈΠΌΠ΅Π½Π΅ΠΌ ΠšΡ‚ΡƒΠ»Ρ…Ρƒ</td>
</tr>
<!—  Вторая строка Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ —>
<tr>
<!— Π­Ρ‚Π° ячСйка относится ΠΊ столбцу Β«Π‘Π°Π³Β» —>
<td>Π‘ΠΎΠΎΠ±Ρ‰Π΅Π½ΠΈΠ΅ ΠΎΠ± ошибкС ΡƒΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚ Π½Π° Π½Π΅Π²Π΅Ρ€Π½Ρ‹ΠΉ ΠΏΠ°Ρ€ΠΎΠ»ΡŒ ΠΏΡ€ΠΈ Π²Π²ΠΎΠ΄Π΅ нСдопустимого ΠΈΠΌΠ΅Π½ΠΈ</td>
<!— Π­Ρ‚Π° ячСйка относится ΠΊ столбцу Β«Π£Π»ΡƒΡ‡ΡˆΠ΅Π½ΠΈΠ΅Β» —>
<td>Π’Ρ‹Π²ΠΎΠ΄ΠΈΡ‚ΡŒ Π² сообщСниС ΠΎΠ± ошибкС Π΄Π΅Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ ΠΏΠΎ ΠΏΡ€ΠΈΡ‡ΠΈΠ½Π΅</td>
</tr>
</table>

ΠŸΠΎΠ»Π½Ρ‹ΠΉ ΠΊΠΎΠ΄ β€”Β simple_table.html

Π’ΠΎΡ‚ Ρ‡Ρ‚ΠΎ Ρƒ нас ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ

ΠžΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π² Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅

Π‘Ρ‚Ρ€Π°ΡˆΠ½Π΅Π½ΡŒΠΊΠ°Ρ? Π”Π°. Но Ρ‡ΠΈΡ‚Π°Π±Π΅Π»ΡŒΠ½Π°Ρ.Β 
А ΠΎ красивостях ΠΏΠΎΠ³ΠΎΠ²ΠΎΡ€ΠΈΠΌ ΠΏΠΎΡ‚ΠΎΠΌ.

PS β€” Π΄ΠΎΠ±Π°Π²ΠΈΠ»Π° ΡΡ‚Π°Ρ‚ΡŒΡŽ Π² ΠΏΠΎΠ»Π½Ρ‹ΠΉ список моих конспСктов Π»Π΅ΠΊΡ†ΠΈΠΉ ΠΏΠΎ HTML & CSS

Π’Π΅Π³ TABLE. Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ HTML-Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ | web-sprints

Π”ΠΎΠ²ΠΎΠ»ΡŒΠ½ΠΎ часто Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ‚ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎΡΡ‚ΡŒ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π½Π° сайт ΠΎΠ΄Π½Ρƒ ΠΈΠ»ΠΈ нСсколько Ρ‚Π°Π±Π»ΠΈΡ† с Π΄Π°Π½Π½Ρ‹ΠΌΠΈ. ΠšΠΎΠ½Π΅Ρ‡Π½ΠΎ, ΠΌΠΎΠΆΠ½ΠΎ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π² графичСском Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€Π΅ ΠΈ Π²ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π½Π° страницу лишь ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅. Однако, Π³ΠΎΡ€Π°Π·Π΄ΠΎ Π±ΠΎΠ»Π΅Π΅ Π³ΠΈΠ±ΠΊΠΈΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ – использованиС HTMLβ€”Ρ‚Π΅Π³Π° table. Π­Ρ‚ΠΎ позволяСт Π²Π°ΠΌ динамичСски ΠΌΠ΅Π½ΡΡ‚ΡŒ внСшний Π²ΠΈΠ΄ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ (Ρ‡Π΅Ρ€Π΅Π· CSS)ΠΈ Π΅Π΅ содСрТимоС (посрСдством PHP ΠΈΠ»ΠΈ JS).

Π‘Π°ΠΌ ΠΏΠΎ сСбС Ρ‚Π΅Π³ table создаСт ΠΏΡƒΡΡ‚ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π±Π΅Π· ΠΊΠΎΠ»ΠΎΠ½ΠΎΠΊ ΠΈ строк. Π”Π°Π±Ρ‹ Π² Π½Π΅ΠΉ появились эти самыС ΠΊΠΎΠ»ΠΎΠ½ΠΊΠΈ ΠΈ строки, Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π²Π½ΡƒΡ‚Ρ€ΡŒ table Π΄Ρ€ΡƒΠ³ΠΈΠ΅ Ρ‚Π΅Π³ΠΈ, Π° ΠΈΠΌΠ΅Π½Π½ΠΎ – trΒ ΠΈ td. Π’Π΅Π³ tr позволяСт ΡΡ„ΠΎΡ€ΠΌΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΡƒΡŽ ΠΏΡƒΡΡ‚ΡƒΡŽ строку Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ (Π±Π΅Π· ячССк), Π° td – ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΡƒΡŽ ячСйку Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π΅ΠΊΡƒΡ‰Π΅ΠΉ строки. ΠšΠΎΠ»ΠΈΡ‡Π΅ΡΡ‚Π²ΠΎ элСмСнтов td ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ количСство ΠΊΠΎΠ»ΠΎΠ½ΠΎΠΊ Π² строкС. Если Π² Ρ€Π°Π·Π½Ρ‹Ρ… строках количСство td отличаСтся Π΄Ρ€ΡƒΠ³ ΠΎΡ‚ Π΄Ρ€ΡƒΠ³Π°, Ρ‚ΠΎ Ρ‚Π°Π±Π»ΠΈΡ†Π° ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠ΅Ρ€Π΅ΠΊΠΎΡΠΈΡ‚ΡŒΡΡ. Π’ΠΎΡ‚ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ ΠΊΠΎΠ΄Π° простой Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, состоящСй ΠΈΠ· ΠΎΠ΄Π½ΠΎΠΉ строки ΠΈ Π΄Π²ΡƒΡ… ячССк Π² Π½Π΅ΠΉ:

<table>
<tr>
<td>1_ячСйка</td>
<td>2_ячСйка</td>
</tr>
</table>



<table>

Β Β <tr>

Β Β Β Β <td>1_ячСйка</td>

Β Β Β Β <td>2_ячСйка</td>

Β Β </tr>

</table>

ΠŸΡ€ΠΈ создании Ρ‚Π°Π±Π»ΠΈΡ† ΠΌΠΎΠ³ΡƒΡ‚ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ Ρ‚Π°ΠΊΠΈΠ΅ Π½Π΅ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ элСмСнты, ΠΊΠ°ΠΊ thead, tbody, Π° Ρ‚Π°ΠΊΠΆΠ΅ tfoot. ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ элСмСнт thead Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ Π² сСбС ΠΎΠ΄Π½Ρƒ ΠΈΠ»ΠΈ нСсколько строк (tr), ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π±ΡƒΠ΄ΡƒΡ‚ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒΡΡ Π²Π²Π΅Ρ€Ρ…Ρƒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ (ΠΏΠ΅Ρ€Π²Ρ‹Π΅ строки). tbody ΠΌΠΎΠΆΠ΅Ρ‚ Π·Π°ΠΊΠ»ΡŽΡ‡Π°Ρ‚ΡŒΒ Π² сСбя строки, Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°ΡŽΡ‰ΠΈΠ΅ΡΡ Π² срСднСй части Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹. tfoot ΠΌΠΎΠΆΠ΅Ρ‚ Π·Π°ΠΊΠ»ΡŽΡ‡Π°Ρ‚ΡŒ Π² сСбя строки, Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°ΡŽΡ‰ΠΈΠ΅ΡΡ Π² Π½ΠΈΠΆΠ½Π΅ΠΉ части Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ (Π² ΠΊΠΎΠ΄Π΅ Π΄Π°Π½Π½Ρ‹ΠΉ Π±Π»ΠΎΠΊ всСгда Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΈΠ΄Ρ‚ΠΈ сразу послС thead). tbody ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΡ€ΠΈΡΡƒΡ‚ΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ сразу Π² Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… экзСмплярах. Π§Ρ‚ΠΎ касаСтся thead ΠΈ tfoot, Ρ‚ΠΎ ΠΈΡ… максимальноС количСство Ρ€Π°Π²Π½ΠΎ 1.

ВСрнСмся ΠΊ основному Ρ‚Π΅Π³Ρƒ table. Он ΠΌΠΎΠΆΠ΅Ρ‚ ΠΎΠ±Π»Π°Π΄Π°Ρ‚ΡŒ мноТСством Ρ€Π°Π·Π½Ρ‹Ρ… Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ΠΎΠ². НиТС пСрСчислим Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΈΠ· Π½ΠΈΡ….

  1. align. ЗадаСтся Ρ‚ΠΈΠΏ выравнивания Π²ΠΎ всСх ячСйках Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ (Π»Π΅Π²ΠΎ, ΠΏΡ€Π°Π²ΠΎ, Ρ†Π΅Π½Ρ‚Ρ€).
  2. cols. ЗадаСтся число ΠΊΠΎΠ»ΠΎΠ½ΠΎΠΊ (ΠΌΠΎΠΆΠ΅Ρ‚ Π²Ρ‹ΡΡ‡ΠΈΡ‚Ρ‹Π²Π°Ρ‚ΡŒΡΡ, исходя ΠΈΠ· количСства элСмСнтов td, Π½ΠΎ явноС ΡƒΠΊΠ°Π·Π°Π½ΠΈΠ΅ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ускоряСт построСниС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹).
  3. background. УказываСтся URL—адрСс Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠΉ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΈ.
  4. width. УказываСтся ΡˆΠΈΡ€ΠΈΠ½Π° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π² пиксСлях ΠΈΠ»ΠΈ ΠΏΡ€ΠΎΡ†Π΅Π½Ρ‚Π°Ρ… ΠΎΡ‚ ΡˆΠΈΡ€ΠΈΠ½Ρ‹ Ρ€ΠΎΠ΄ΠΈΡ‚Π΅Π»ΡŒΡΠΊΠΎΠ³ΠΎ HTML—элСмСнта.
  5. Β border. ЗадаСтся Ρ‚ΠΎΠ»Ρ‰ΠΈΠ½Π° Π±ΠΎΡ€Π΄Π΅Ρ€Π° (Π³Ρ€Π°Π½ΠΈΡ†Ρ‹) Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.
  6. cellpadding ΠΈ cellspacing. Π­Ρ‚ΠΎ Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½ΠΈΠ΅ отступы Π² ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ячСйкС ΠΈ расстояниС ΠΌΠ΅ΠΆΠ΄Ρƒ ячСйками соотвСтствСнно.
  7. rules. Π—Π΄Π΅ΡΡŒ ΡƒΠΊΠ°Π·Ρ‹Π²Π°ΡŽΡ‚ΡΡ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ отобраТСния Π³Ρ€Π°Π½ΠΈΡ† ΠΌΠ΅ΠΆΠ΄Ρƒ ячСйками (Π²ΠΎΠΊΡ€ΡƒΠ³ всСх ячССк, Π²ΠΎΠΊΡ€ΡƒΠ³ Π³Ρ€ΡƒΠΏΠΏ thead / tbody / tfoot, Π²ΠΎΠΊΡ€ΡƒΠ³ ΠΊΠΎΠ»ΠΎΠ½ΠΎΠΊ ΠΈ Ρ‚.Π΄.).

Π­Π»Π΅ΠΌΠ΅Π½Ρ‚ td (ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Π°Ρ ячСйка Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹) ΠΎΠ±Π»Π°Π΄Π°Π΅Ρ‚ ΠΏΠΎΡ‡Ρ‚ΠΈ Ρ‚Π΅ΠΌΠΈ ΠΆΠ΅ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π°ΠΌΠΈ. Π’ΡƒΡ‚ Ρ‚ΠΎΠΆΠ΅ Π΅ΡΡ‚ΡŒ align, background, width ΠΈ Ρ‚.Π΄. ΠšΡ€ΠΎΠΌΠ΅ Ρ‚ΠΎΠ³ΠΎ, появляСтся нСсколько Π½ΠΎΠ²Ρ‹Ρ… Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ΠΎΠ². rowspan позволяСт ΡΠΊΠ»Π΅ΠΈΡ‚ΡŒ нСсколько ячССк ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ (Π² ΠΎΠ΄Π½ΠΎΠΉ строкС). Число Π² Π·Π½Π°Ρ‡Π΅Π½ΠΈΠΈ этого Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π° – это ΠΈ Π΅ΡΡ‚ΡŒ количСство ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΡΠ΅ΠΌΡ‹Ρ… ячССк. colspan Π΄Π΅Π»Π°Π΅Ρ‚ Ρ‚ΠΎ ΠΆΠ΅ самоС, Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈ (ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΡΠ΅Ρ‚ нСсколько ячССк Π² ΠΎΠ΄Π½ΠΎΠΉ ΠΊΠΎΠ»ΠΎΠ½ΠΊΠ΅). Атрибут valign позволяСт ΠΏΡ€ΠΈΠΌΠ΅Π½ΡΡ‚ΡŒ ΠΊ ячСйкС Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎΠ΅ Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ (Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ ΠΊΡ€Π°ΠΉ, Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΡ€Π°ΠΉ, Ρ†Π΅Π½Ρ‚Ρ€).

3.3. Π―Ρ‡Π΅ΠΉΠΊΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹. HTML, XHTML ΠΈ CSS Π½Π° 100%

Π§ΠΈΡ‚Π°ΠΉΡ‚Π΅ Ρ‚Π°ΠΊΠΆΠ΅








3.9. Установка Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠ³ΠΎ Ρ†Π²Π΅Ρ‚Π° ΠΈΠ»ΠΈ рисунка ячСйки



3.9. Установка Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠ³ΠΎ Ρ†Π²Π΅Ρ‚Π° ΠΈΠ»ΠΈ рисунка ячСйки
Π’ HTML Π²ΠΎΠ·ΠΌΠΎΠΆΠ½Ρ‹ Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Π΅ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Ρ‹ установки Ρ„ΠΎΠ½ΠΎΠ²ΠΎΠ³ΠΎ Ρ†Π²Π΅Ρ‚Π° ΠΈΠ»ΠΈ рисунка. Благодаря Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Ρƒ bgcolor ΠΌΠΎΠΆΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΡΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ содСрТимого ячСйки, строки, Π³Ρ€ΡƒΠΏΠΏΡ‹ столбцов, Π³Ρ€ΡƒΠΏΠΏΡ‹ строк, Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Ρ†Π΅Π»ΠΈΠΊΠΎΠΌ.Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΠΊΠΎΠ½ΡΡ‚Ρ€ΡƒΠΊΡ†ΠΈΡŽ &lt;td bgcolor=






ΠŸΡƒΡΡ‚Ρ‹Π΅ ячСйки



ΠŸΡƒΡΡ‚Ρ‹Π΅ ячСйки
CSS позволяСт ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ, ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒ Π»ΠΈ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ пустых ячССк. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π·Π°Π΄Π°Ρ‚ΡŒ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ пустых ячССк, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ свойство CSS empty-cells. Π­Ρ‚ΠΎ свойство управляСт прСдставлСниСм Π³Ρ€Π°Π½ΠΈΡ† Π²ΠΎΠΊΡ€ΡƒΠ³ ячССк, Π½Π΅ ΠΈΠΌΠ΅ΡŽΡ‰ΠΈΡ… Π²ΠΈΠ΄ΠΈΠΌΠΎΠ³ΠΎ содСрТимого. БчитаСтся, Ρ‡Ρ‚ΠΎ Π²ΠΈΠ΄ΠΈΠΌΠΎΠ³ΠΎ






Как Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ строку, столбСц ΠΈ ячСйки



Как Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ строку, столбСц ΠΈ ячСйки
Если Π½ΡƒΠΆΠ½ΠΎ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ ΠΏΡ€ΠΎΠ΄Π΅Π»Π°Ρ‚ΡŒ с тСкстом ΠΎΠ΄Π½ΠΎΠ²Ρ€Π΅ΠΌΠ΅Π½Π½ΠΎ Π² Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… ячСйках, ΠΈΡ… ΡƒΠ΄ΠΎΠ±Π½ΠΎ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ ΠΏΡ€ΠΈΠ΅ΠΌΡ‹.β€’Β Π§Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ столбСц, ΠΏΠΎΠ΄Π²Π΅Π΄ΠΈΡ‚Π΅ ΡƒΠΊΠ°Π·Π°Ρ‚Π΅Π»ΡŒ ΠΌΡ‹ΡˆΠΈ ΠΊ Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ Π³Ρ€Π°Π½ΠΈΡ†Π΅ ΠΈ, ΠΊΠΎΠ³Π΄Π° ΠΎΠ½ ΠΏΡ€ΠΈΠΌΠ΅Ρ‚ Π²ΠΈΠ΄ малСнькой Ρ‡Π΅Ρ€Π½ΠΎΠΉ






Π’Π°Π±Π»ΠΈΡ†Ρ‹



Π’Π°Π±Π»ΠΈΡ†Ρ‹

Команда TABLE осущСствляСт созданиС пустой Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ΠΎΠ² Π² Ρ‡Π΅Ρ€Ρ‚Π΅ΠΆΠ΅. ВызываСтся ΠΊΠΎΠΌΠ°Π½Π΄Π° ΠΈΠ· ΠΏΠ°Π΄Π°ΡŽΡ‰Π΅Π³ΠΎ мСню Draw ? Table… ΠΈΠ»ΠΈ Ρ‰Π΅Π»Ρ‡ΠΊΠΎΠΌ Π½Π° ΠΏΠΈΠΊΡ‚ΠΎΠ³Ρ€Π°ΠΌΠΌΠ΅ Table… Π½Π° ΠΏΠ°Π½Π΅Π»ΠΈ инструмСнтов Draw. Π’ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚Π΅ открываСтся Π΄ΠΈΠ°Π»ΠΎΠ³ΠΎΠ²ΠΎΠ΅ ΠΎΠΊΠ½ΠΎ вставки Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Insert Table – рис. 10.8.

Рис. 10.8.






Π―Ρ‡Π΅ΠΉΠΊΠΈ ΠΎΠ±Ρ€Π°Π·Ρ†ΠΎΠ² ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»ΠΎΠ²



Π―Ρ‡Π΅ΠΉΠΊΠΈ ΠΎΠ±Ρ€Π°Π·Ρ†ΠΎΠ² ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»ΠΎΠ²
По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ ΠΏΡ€ΠΈ Ρ€Π°Π±ΠΎΡ‚Π΅ Π½Π°Π΄ Π½ΠΎΠ²ΠΎΠΉ сцСной Material Editor (Π Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€ ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»ΠΎΠ²) ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚ ΡˆΠ΅ΡΡ‚ΡŒ ячССк с ΠΎΠ±Ρ€Π°Π·Ρ†Π°ΠΌΠΈ ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»ΠΎΠ². Π©Π΅Π»Ρ‡ΠΎΠΊ Π½Π° ячСйкС Π°ΠΊΡ‚ΠΈΠ²ΠΈΠ·ΠΈΡ€ΡƒΠ΅Ρ‚ Π΅Π΅ ΠΈ измСняСт Ρ†Π²Π΅Ρ‚ Π΅Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Π½Π° Π±Π΅Π»Ρ‹ΠΉ. Если ячСйка ΠΎΠ±Ρ€Π°Π·Ρ†Π° содСрТит ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π», ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ






Π€ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΠΉ ячСйки



Π€ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ Π°ΠΊΡ‚ΠΈΠ²Π½ΠΎΠΉ ячСйки
Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠΎ своСму ΡƒΡΠΌΠΎΡ‚Ρ€Π΅Π½ΠΈΡŽ Π½Π°ΡΡ‚Ρ€Π°ΠΈΠ²Π°Ρ‚ΡŒ прСдставлСниС Π΄Π°Π½Π½Ρ‹Ρ… Π² любой ячСйкС Π»ΠΈΠ±ΠΎ Π΄ΠΈΠ°ΠΏΠ°Π·ΠΎΠ½Π΅, Ρ‚ΠΎ Π΅ΡΡ‚ΡŒ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π°ΠΊΡ‚ΠΈΠ²Π½ΡƒΡŽ ячСйку ΠΈΠ»ΠΈ Π²Ρ‹ Π΄Π΅Π»Π΅Π½Π½Ρ‹ΠΉ Π΄ΠΈΠ°ΠΏΠ°Π·ΠΎΠ½. Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΠ΅Ρ€Π΅ΠΉΡ‚ΠΈ Π² Π΄Π°Π½Π½Ρ‹ΠΉ Ρ€Π΅ΠΆΠΈΠΌ, Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅ ΠΊΠΎΠΌΠ°Π½Π΄Ρƒ контСкстного мСню Π€ΠΎΡ€ΠΌΠ°Ρ‚ ячССк






Π’Π°Π±Π»ΠΈΡ†Ρ‹



Π’Π°Π±Π»ΠΈΡ†Ρ‹
Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚Ρ‹ Ρ€Π°Π±ΠΎΡ‚Ρ‹ с Ρ‚Π°Π±Π»ΠΈΡ†Π°ΠΌΠΈ Π² Word-2003 Π·Π½Π°Ρ‡ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΡƒΡΠΎΠ²Π΅Ρ€ΡˆΠ΅Π½ΡΡ‚Π²ΠΎΠ²Π°Π½Ρ‹ ΠΏΠΎ ΡΡ€Π°Π²Π½Π΅Π½ΠΈΡŽ с ΠΏΡ€Π΅Π΄Ρ‹Π΄ΡƒΡ‰ΠΈΠΌΠΈ вСрсиями этой ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹. Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π² тСкстС Word ΠΌΠΎΠΆΠ½ΠΎ Π±ΡƒΠΊΠ²Π°Π»ΡŒΠ½ΠΎ двумя двиТСниями ΠΌΡ‹ΡˆΠΊΠΈ.Π‘Π°ΠΌΡ‹ΠΉ простой способ – Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ. Π’ΠΎΠΉΠ΄ΠΈΡ‚Π΅ Π² мСню Π’Π°Π±Π»ΠΈΡ†Π°






Π―Ρ‡Π΅ΠΉΠΊΠΈ



Π―Ρ‡Π΅ΠΉΠΊΠΈ
Π€ΠΎΡ€ΠΌΠ°Ρ‚ Π΄Π°Π½Π½Ρ‹Ρ…ΠšΠ°ΠΆΠ΄ΡƒΡŽ ΠΈΠ· ячССк Excel ΠΌΠΎΠΆΠ½ΠΎ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ Ρ€Π°Π·Π½Ρ‹ΠΌΠΈ Ρ‚ΠΈΠΏΠ°ΠΌΠΈ Π΄Π°Π½Π½Ρ‹Ρ…: тСкстом, числСнными значСниями, Π΄Π°ΠΆΠ΅ Π³Ρ€Π°Ρ„ΠΈΠΊΠΎΠΉ. ΠŸΡ€Π°Π²Π΄Π°, для Ρ‚ΠΎΠ³ΠΎ Ρ‡Ρ‚ΠΎΠ±Ρ‹ ввСдСнная Π²Π°ΠΌΠΈ информация ΠΎΠ±Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π»Π°ΡΡŒ ΠΊΠΎΡ€Ρ€Π΅ΠΊΡ‚Π½ΠΎ, Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ ΠΏΡ€ΠΈΡΠ²ΠΎΠΈΡ‚ΡŒ ячСйкС (Π° Ρ‡Π°Ρ‰Π΅ Ρ†Π΅Π»ΠΎΠΌΡƒ столбцу ΠΈΠ»ΠΈ строкС)






2.6. Π’Π°Π±Π»ΠΈΡ†Ρ‹



2.6. Π’Π°Π±Π»ΠΈΡ†Ρ‹
2.6.1. Π¦ΠΈΡ„Ρ€ΠΎΠ²ΠΎΠΉ ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π» для достиТСния Π»ΡƒΡ‡ΡˆΠ΅ΠΉ наглядности ΠΈ сравнимости ΠΏΠΎΠΊΠ°Π·Π°Ρ‚Π΅Π»Π΅ΠΉ, ΠΊΠ°ΠΊ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ, слСдуСт ΠΎΡ„ΠΎΡ€ΠΌΠ»ΡΡ‚ΡŒ Π² Π²ΠΈΠ΄Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.2.6.2. ΠžΡ„ΠΎΡ€ΠΌΠ»Π΅Π½ΠΈΠ΅ Ρ‚Π°Π±Π»ΠΈΡ† Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΠΏΡ€ΠΎΠΈΠ·Π²ΠΎΠ΄ΠΈΡ‚ΡŒΡΡ Π² соотвСтствии с трСбованиями Π“ΠžΠ‘Π’ 1.5-85.Π’Π°Π±Π»ΠΈΡ†Π° ΠΌΠΎΠΆΠ΅Ρ‚ ΠΈΠΌΠ΅Ρ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ слСдуСт






14.5. Π―Ρ‡Π΅ΠΉΠΊΠΈ



14.5. Π―Ρ‡Π΅ΠΉΠΊΠΈ
КаТдая ячСйка ΠΈΠΌΠ΅Π΅Ρ‚ адрСс, Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ ΠΈ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚. АдрСс позволяСт ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚ΡŒΡΡ ΠΊ Π·Π½Π°Ρ‡Π΅Π½ΠΈΡŽ ячСйки ΠΏΡ€ΠΈ написании Ρ„ΠΎΡ€ΠΌΡƒΠ». Π—Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ΠΌ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ всС, Ρ‡Ρ‚ΠΎ ΡƒΠ³ΠΎΠ΄Π½ΠΎ β€” строка, число, Ρ„ΠΎΡ€ΠΌΡƒΠ»Π°, Π΄Π°Ρ‚Π°, рисунок ΠΈ Ρ‚.Β Π΄. Π€ΠΎΡ€ΠΌΠ°Ρ‚ Π·Π°Π΄Π°Π΅Ρ‚, ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ Ρ‚ΠΎ ΠΈΠ»ΠΈ ΠΈΠ½ΠΎΠ΅ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅. Как






14.5.1. АдрСс ячСйки



14.5.1. АдрСс ячСйки
Π‘Π½Π°Ρ‡Π°Π»Π° разбСрСмся с адрСсом ячСйки. ВсС ΠΌΡ‹ ΠΈΠ³Ρ€Π°Π»ΠΈ Π² дСтствС Π² морской Π±ΠΎΠΉ. ΠŸΡ€ΠΈΠ½Ρ†ΠΈΠΏ адрСсации ячССк Π² Excel Ρ‚Π°ΠΊΠΎΠΉ ΠΆΠ΅. Π―Ρ‡Π΅ΠΉΠΊΠ°, которая стоит Π½Π° пСрСсСчСнии ΠΏΠ΅Ρ€Π²ΠΎΠΉ ΠΊΠΎΠ»ΠΎΠ½ΠΊΠΈ (имя ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ А) ΠΈ ΠΏΠ΅Ρ€Π²ΠΎΠ³ΠΎ ряда (Π΅Π³ΠΎ Π½ΠΎΠΌΠ΅Ρ€ 1), Π±ΡƒΠ΄Π΅Ρ‚ Π½Π°Π·Ρ‹Π²Π°Ρ‚ΡŒΡΡ А1 β€” это ΠΈ Π΅ΡΡ‚ΡŒ адрСс ячСйки.






14.5.2. Π—Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ ячСйки



14.5.2. Π—Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ ячСйки
Как ΠΈ Π² случаС с Word, просто Π½Π°Ρ‡ΠΈΠ½Π°ΠΉΡ‚Π΅ Π²Π²ΠΎΠ΄ΠΈΡ‚ΡŒ тСкст ΠΈΠ»ΠΈ числа. НС Π±Π΅ΡΠΏΠΎΠΊΠΎΠΉΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π²Π²Π΅Π΄Π΅Π½Π½ΠΎΠ΅ Π²Π°ΠΌΠΈ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ Π²Ρ‹Ρ…ΠΎΠ΄ΠΈΡ‚ Π·Π° Ρ€Π°ΠΌΠΊΠΈ ячСйки β€” это ΠΏΠΎΠΏΡ€Π°Π²ΠΈΠΌΠΎ. Для измСнСния ΡˆΠΈΡ€ΠΈΠ½Ρ‹ ячСйки ΡƒΡ…Π²Π°Ρ‚ΠΈΡ‚Π΅ΡΡŒ Π·Π° Π³Ρ€Π°Π½ΠΈΡ†Ρƒ ΠΊΠΎΠ»ΠΎΠ½ΠΊΠΈ ΠΈ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°ΠΉΡ‚Π΅ Π΅Π΅, ΠΏΠΎΠΊΠ° Π½Π΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€






14.5.3. Π€ΠΎΡ€ΠΌΠ°Ρ‚ ячСйки



14.5.3. Π€ΠΎΡ€ΠΌΠ°Ρ‚ ячСйки
Π€ΠΎΡ€ΠΌΠ°Ρ‚ Π·Π°Π΄Π°Π΅Ρ‚, ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ ячСйки. Π€ΠΎΡ€ΠΌΠ°Ρ‚ тСсно связан с Ρ‚ΠΈΠΏΠΎΠΌ Π΄Π°Π½Π½Ρ‹Ρ… ячСйки. Π’ΠΈΠΏ Π·Π°Π΄Π°Π΅Ρ‚Π΅ Π²Ρ‹ сами. Если Π²Ρ‹ Π²Π²Π΅Π»ΠΈ число, Ρ‚ΠΎ это числовой Ρ‚ΠΈΠΏ Π΄Π°Π½Π½Ρ‹Ρ…. Excel сама стараСтся ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ ΠΏΠΎ Ρ‚ΠΈΠΏΡƒ Π΄Π°Π½Π½Ρ‹Ρ…. НапримСр, Ссли Π²Ρ‹ Π²Π²Π΅Π»ΠΈ тСкст, Ρ‚ΠΎ






6.2.2. Π€ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΡƒΠ΅ΠΌ ячСйки Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹



6.2.2. Π€ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΡƒΠ΅ΠΌ ячСйки Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹
Для выполнСния задания Π½Π°ΠΌ понадобится ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π» Ρ€Π°Π·Π΄. 5.2.5.Π—Π°Π΄Π°Π½ΠΈΠ΅Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΈ ΠΎΡ‚Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½Π° рис.Β 6.27. Π­Π»Π΅ΠΊΡ‚Ρ€ΠΎΠ½Π½Ρ‹ΠΉ Π²ΠΈΠ΄ задания находится Π² Ρ„Π°ΠΉΠ»Π΅: /numbers/tasks/6.2.2.pdf.1.Β ΠžΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ Ρ„Π°ΠΉΠ» ΡƒΠΏΡ€. numbers, хранящийся Π² ΠΏΠ°ΠΏΠΊΠ΅






Π’Π²ΠΎΠ΄ Π΄Π°Π½Π½Ρ‹Ρ… Π² ячСйки



Π’Π²ΠΎΠ΄ Π΄Π°Π½Π½Ρ‹Ρ… Π² ячСйки
Для заполнСния ячСйки Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π΄Π°Π½Π½Ρ‹ΠΌΠΈ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π΅.1. Π’Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Π½ΡƒΠΆΠ½ΡƒΡŽ ячСйку.2. ВвСсти тСкст, число ΠΈΠ»ΠΈ Ρ„ΠΎΡ€ΠΌΡƒΠ»Ρƒ.3. ΠΠ°ΠΆΠ°Ρ‚ΡŒ Π»ΡŽΠ±ΡƒΡŽ ΠΈΠ· клавиш пСрСмСщСния ΠΏΠΎ листу, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ ΠΊΠ»Π°Π²ΠΈΡˆΡƒ со стрСлкой ΠΈΠ»ΠΈ Enter для ΠΏΠ΅Ρ€Π΅Ρ…ΠΎΠ΄Π° ΠΊ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΉ ячСйкС.ΠŸΡ€ΠΈ Π²Π²ΠΎΠ΄Π΅














HTML Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹

Π’Π°Π±Π»ΠΈΡ†Ρ‹ ΡΠΎΠ·Π΄Π°ΡŽΡ‚ΡΡ ΠΏΡ€ΠΈ ΠΏΠΎΠΌΠΎΡ‰ΠΈ ΠΏΠ°Ρ€Π½ΠΎΠ³ΠΎ Ρ‚Π΅Π³Π° <table>, Π²Π½ΡƒΡ‚Ρ€ΠΈ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ³ΠΎ ΠΏΡ€ΠΎΠΏΠΈΡΡ‹Π²Π°ΡŽΡ‚ΡΡ Ρ‚Π΅Π³ΠΈ для создания строк Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ – <tr>...</tr>, ΠΈ Ρ‚Π΅Π³ΠΈ для создания ячССк Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ – <td>...</td>:

<table>
    <tr>
        <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
    </tr>
    <tr>
        <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
    </tr>
    <tr>
        <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
    </tr>
</table>

Данная Ρ‚Π°Π±Π»ΠΈΡ†Π° содСрТит Ρ‚Ρ€ΠΈ строки, Π² ΠΊΠ°ΠΆΠ΄ΠΎΠΉ строкС ΠΏΠΎ Ρ‚Ρ€ΠΈ ячСйки. Π’ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅ ΠΎΠ½Π° отобразится Ρ‚Π°ΠΊ:

По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Π° Π² Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π΅ отобраТаСтся Π±Π΅Π· Π³Ρ€Π°Π½ΠΈΡ† ΠΈ отступов. Π­Ρ‚ΠΈ свойства ΠΏΡ€ΠΎΠΏΠΈΡΡ‹Π²Π°ΡŽΡ‚ΡΡ Ρ‡Π΅Ρ€Π΅Π· CSS.

Π’Π°Π±Π»ΠΈΡ†Π° с шапкой ΠΈ ΠΏΠΎΠ΄Π²Π°Π»ΠΎΠΌ

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅ ΡˆΠ°ΠΏΠΊΡƒ ΠΈ ΠΏΠΎΠ΄Π²Π°Π», для этого ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‚Π°ΠΊΡƒΡŽ ΠΊΠΎΠ½ΡΡ‚Ρ€ΡƒΠΊΡ†ΠΈΡŽ:

<table>
    <thead>
        <tr>
            <th>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² шапкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</th>
            <th>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² шапкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</th>
            <th>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² шапкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</th>
        </td>
    </thead>
    <tfoot>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² ΠΏΠΎΠ΄Π²Π°Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² ΠΏΠΎΠ΄Π²Π°Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² ΠΏΠΎΠ΄Π²Π°Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
    </tfoot>
    <tbody>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
    </tbody>
</table>

Π¨Π°ΠΏΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π»Π΅ΠΆΠΈΡ‚ Π² ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Π΅ thead, ячСйки Π² шапкС ΠΏΡ€ΠΎΠΏΠΈΡΡ‹Π²Π°ΡŽΡ‚ΡΡ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π° <th>...</th>. По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ тСкст Π² ячСйках шапки Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ располоТСн ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ ΠΈ Π²Ρ‹Π΄Π΅Π»Π΅Π½ ΠΆΠΈΡ€Π½Ρ‹ΠΌ ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠΌ.

Подвал Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π»Π΅ΠΆΠΈΡ‚ Π² ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Π΅ tfoot. НСсмотря Π½Π° Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ ΠΏΠΎΠ΄Π²Π°Π» Π² ΠΊΠΎΠ΄Π΅ ΠΈΠ΄Π΅Ρ‚ сразу послС шапки, Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ ΠΎΡ‚ΠΎΠ±Ρ€Π°Π·ΠΈΡ‚ Π΅Π³ΠΎ Π² самом Π½ΠΈΠ·Ρƒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Ρ‚.Π΅. послС ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Π° tbody.

ОсновноС содСрТимоС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ принято ΠΏΡ€ΠΎΠΏΠΈΡΡ‹Π²Π°Ρ‚ΡŒ Π² ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Π΅ tbody.

ОбъСдинСниС ячССк ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ

Для Ρ‚ΠΎΠ³ΠΎ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ нСсколько ячССк Π² строкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ colspan. Допустим Π² нашСй Ρ‚Π°Π±Π»ΠΈΡ†Π΅ ΠΌΡ‹ Ρ…ΠΎΡ‚ΠΈΠΌ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ Π΄Π²Π΅ ячСйки Π² шапкС, для этого для ΠΏΠ΅Ρ€Π²ΠΎΠΉ ячСйки записываСм Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ colspan со Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ΠΌ Π΄Π²Π°: <td colspan="2">, ΠΈ удаляСм ячСйку, ΠΈΠ΄ΡƒΡ‰ΡƒΡŽ послС этой:

<table>
    <thead>
        <tr>
            <th colspan="2">Π―Ρ‡Π΅ΠΉΠΊΠ° Π² шапкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</th>
            <th>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² шапкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</th>
        </td>
    </thead>
    <tfoot>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² ΠΏΠΎΠ΄Π²Π°Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² ΠΏΠΎΠ΄Π²Π°Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² ΠΏΠΎΠ΄Π²Π°Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
    </tfoot>
    <tbody>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
    </tbody>
</table>

ОбъСдинСниС ячССк ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈ

Π§Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ ячСйки ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ rowspan. Допустим Π² Ρ‚Π΅Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π½Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ ΠΏΠ΅Ρ€Π²ΡƒΡŽ ячСйку ΠΏΠ΅Ρ€Π²ΠΎΠΉ строки с ΠΏΠ΅Ρ€Π²ΠΎΠΉ ячСйкой Π²Ρ‚ΠΎΡ€ΠΎΠΉ строки, для этого для ΠΏΠ΅Ρ€Π²ΠΎΠΉ ячСйки Π² ΠΏΠ΅Ρ€Π²ΠΎΠΉ строкС Π½ΡƒΠΆΠ½ΠΎ Π·Π°ΠΏΠΈΡΠ°Ρ‚ΡŒ <td rowspan="2">, ΠΈ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ ΠΏΠ΅Ρ€Π²ΡƒΡŽ ячСйку Π²ΠΎ Π²Ρ‚ΠΎΡ€ΠΎΠΉ строкС:

<table>
    <thead>
        <tr>
            <th>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² шапкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</th>
            <th>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² шапкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</th>
            <th>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² шапкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</th>
        </td>
    </thead>
    <tfoot>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² ΠΏΠΎΠ΄Π²Π°Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² ΠΏΠΎΠ΄Π²Π°Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Π² ΠΏΠΎΠ΄Π²Π°Π»Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
    </tfoot>
    <tbody>
        <tr>
            <td rowspan="2">Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
        <tr>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
            <td>Π―Ρ‡Π΅ΠΉΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹</td>
        </td>
    </tbody>
</table>

Π’ΠΈΠ΄Π΅ΠΎ ΠΊ ΡƒΡ€ΠΎΠΊΡƒ

Как ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Ρ‚Π΅Π³ ΠΈ Css

Π­Ρ‚ΠΎ старая Π²Π΅Ρ‚ΠΊΠ°, Π½ΠΎ я Ρ€Π΅ΡˆΠΈΠ» ΠΎΠΏΡƒΠ±Π»ΠΈΠΊΠΎΠ²Π°Ρ‚ΡŒ своС Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅. НСдавно я столкнулся с Ρ‚ΠΎΠΉ ΠΆΠ΅ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠΎΠΉ, ΠΈ я Ρ€Π΅ΡˆΠΈΠ» Π΅Π΅, слСдуя трСхэтапному ΠΏΠΎΠ΄Ρ…ΠΎΠ΄Ρƒ, описанному Π½ΠΈΠΆΠ΅, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΎΡ‡Π΅Π½ΡŒ прост Π±Π΅Π· ΠΊΠ°ΠΊΠΎΠ³ΠΎ-Π»ΠΈΠ±ΠΎ слоТного CSS .

(ΠŸΠ Π˜ΠœΠ•Π§ΠΠΠ˜Π•. ΠšΠΎΠ½Π΅Ρ‡Π½ΠΎ, для соврСмСнных Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ΠΎΠ² использованиС значСния Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π° CSS Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈΠ»ΠΈ строки Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈΠ»ΠΈ ячСйки Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ для отобраТСния ΠΌΠΎΠΆΠ΅Ρ‚ Ρ€Π΅ΡˆΠΈΡ‚ΡŒ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡƒ. Но ΠΏΠΎΠ΄Ρ…ΠΎΠ΄, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ я использовал, Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎ Ρ…ΠΎΡ€ΠΎΡˆΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ Π² соврСмСнных ΠΈ старых Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°Ρ…, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΎΠ½ Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ эти значСния для отобраТСния Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π° CSS.)

3-Ρ… ΡˆΠ°Π³ΠΎΠ²Ρ‹ΠΉ простой ΠΏΠΎΠ΄Ρ…ΠΎΠ΄

Для Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ с элСмСнтами div, поэтому Π²Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚Π΅ ячСйки ΠΈ строки, ΠΊΠ°ΠΊ Π² элСмСнтС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠΉ ΠΏΠΎΠ΄Ρ…ΠΎΠ΄.

  1. Π—Π°ΠΌΠ΅Π½ΠΈΡ‚Π΅ элСмСнт Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π½Π° Π±Π»ΠΎΠΊ div (ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ .tableкласс)
  2. Π—Π°ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт tr ΠΈΠ»ΠΈ th Π±Π»ΠΎΠΊΠΎΠΌ div (ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ .rowкласс)
  3. Π—Π°ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт td Π½Π° встроСнный Π±Π»ΠΎΠΊ div (ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ .cellкласс)
.table {display:block; }
.row { display:block;}
.cell {display:inline-block;}
    <h3>Table below using table element</h3>
    <table cellspacing="0" >
       <tr>
          <td>Mike</td>
          <td>36 years</td>
          <td>Architect</td>
       </tr>
       <tr>
          <td>Sunil</td>
          <td>45 years</td>
          <td>Vice President aas</td>
       </tr>
       <tr>
          <td>Jason</td>
          <td>27 years</td>
          <td>Junior Developer</td>
       </tr>
    </table>
    <h3>Table below is using Divs only</h3>
    <div>
       <div>
          <div>
             Mike
          </div>
          <div>
             36 years
          </div>
          <div>
             Architect
          </div>
       </div>
       <div>
          <div>
             Sunil
          </div>
          <div>
             45 years
          </div>
          <div>
             Vice President
          </div>
       </div>
       <div>
          <div>
             Jason
          </div>
          <div>
             27 years
          </div>
          <div>
             Junior Developer
          </div>
       </div>
    </div>

ΠžΠ‘ΠΠžΠ’Π›Π•ΠΠ˜Π• 1

Π§Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±ΠΎΠΉΡ‚ΠΈ эффСкт ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠΉ ΡˆΠΈΡ€ΠΈΠ½Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π½Π΅ поддСрТиваСтся Π²ΠΎ всСх ячСйках столбца, ΠΊΠ°ΠΊ упомянуто thatslchΠ² ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ, ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ любой ΠΈΠ· Π΄Π²ΡƒΡ… ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΎΠ² Π½ΠΈΠΆΠ΅.

  • Π£ΠΊΠ°ΠΆΠΈΡ‚Π΅ ΡˆΠΈΡ€ΠΈΠ½Ρƒ для cellкласса

    cell {display: inline-block; ΡˆΠΈΡ€ΠΈΠ½Π°: 340px;}

  • Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ CSS соврСмСнных Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ΠΎΠ², ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½ΠΈΠΆΠ΅.

    .table {display: table; } .row {display: table-row;} .cell {display: table-cell;}

HTML-Ρ‚Π°Π±Π»ΠΈΡ† — Π£Ρ‡Π΅Π±Π½ΠΎΠ΅ пособиС ΠΏΠΎ Ρ‚Π°Π±Π»ΠΈΡ†Π°ΠΌ с ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠΌ ΠΊΠΎΠ΄Π°

Когда Π²Ρ‹ создаСтС ΠΏΡ€ΠΎΠ΅ΠΊΡ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΏΡ€Π΅Π΄ΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ Π΄Π°Π½Π½Ρ‹Π΅ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎ, Π²Π°ΠΌ понадобится Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΉ способ отобраТСния ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΅Π΅ Π±Ρ‹Π»ΠΎ Π»Π΅Π³ΠΊΠΎ Ρ‡ΠΈΡ‚Π°Ρ‚ΡŒ ΠΈ ΠΏΠΎΠ½ΠΈΠΌΠ°Ρ‚ΡŒ.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ, Π² зависимости ΠΎΡ‚ Ρ‚ΠΈΠΏΠ° Π΄Π°Π½Π½Ρ‹Ρ…, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Ρ‹Π±ΠΈΡ€Π°Ρ‚ΡŒ ΠΌΠ΅ΠΆΠ΄Ρƒ Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹ΠΌΠΈ ΠΌΠ΅Ρ‚ΠΎΠ΄Π°ΠΌΠΈ прСдставлСния с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ элСмСнтов HTML.

Π’ Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²Π΅ случаСв Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΡƒΠ΄ΠΎΠ±Π½Π΅Π΅ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒ большиС ΠΎΠ±ΡŠΠ΅ΠΌΡ‹ структурированных Π΄Π°Π½Π½Ρ‹Ρ…. Π’ΠΎΡ‚ ΠΏΠΎΡ‡Π΅ΠΌΡƒ Π² этой ΡΡ‚Π°Ρ‚ΡŒΠ΅ ΠΌΡ‹ ΡƒΠ·Π½Π°Π΅ΠΌ, ΠΊΠ°ΠΊ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π² HTML, Π° Π·Π°Ρ‚Π΅ΠΌ ΠΊΠ°ΠΊ ΠΈΡ… ΡΡ‚ΠΈΠ»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ.

Но ΠΎΠ±ΠΎ всСм ΠΏΠΎ порядку — Ρ‡Ρ‚ΠΎ Ρ‚Π°ΠΊΠΎΠ΅ Ρ‚Π°Π±Π»ΠΈΡ†Π° Π² HTML?

Π§Ρ‚ΠΎ Ρ‚Π°ΠΊΠΎΠ΅ Ρ‚Π°Π±Π»ΠΈΡ†Π° Π² HTML?

Π’Π°Π±Π»ΠΈΡ†Π° — это Π½Π΅ Ρ‡Ρ‚ΠΎ ΠΈΠ½ΠΎΠ΅, ΠΊΠ°ΠΊ способ прСдставлСния Π΄Π°Π½Π½Ρ‹Ρ… Π² строках ΠΈ столбцах. ΠœΡ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅ΠΌ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΊΠ°ΠΊ Π³Ρ€ΡƒΠΏΠΏΡƒ строк, каТдая ΠΈΠ· ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… содСрТит Π³Ρ€ΡƒΠΏΠΏΡƒ ячССк.

Π’Π°Π±Π»ΠΈΡ†Ρ‹

HTML ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡŽΡ‚ Π²Π΅Π±-Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠ°ΠΌ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒ Π΄Π°Π½Π½Ρ‹Π΅ Π² строках ΠΈ столбцах. Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π°Π±Π»ΠΈΡ† Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΠΏΠΎΡ€ΡΠ΄ΠΎΡ‡ΠΈΠ²Π°Ρ‚ΡŒ Π΄Π°Π½Π½Ρ‹Π΅, Ρ‚Π°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ тСкст, изобраТСния, ссылки, Π΄Ρ€ΡƒΠ³ΠΈΠ΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄Ρ€ΡƒΠ³ΠΎΠ΅, Π² строки ΠΈ столбцы ячССк.

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π² HTML, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ элСмСнты.Π’Π°Π±Π»ΠΈΡ†Π° ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ объявлСна ​​с использованиСм Ρ‚Ρ€Π΅Ρ… основных элСмСнтов, Π° ΠΈΠΌΠ΅Π½Π½ΠΎ:

  • <Ρ‚Π°Π±Π»ΠΈΡ†Π°> — это основной ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€.

  • — прСдставляСт строки.
  • — ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для создания ячССк Π΄Π°Π½Π½Ρ‹Ρ….
Бинтаксис Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ HTML:
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
     Π―Ρ‡Π΅ΠΉΠΊΠ° 1 
     Π―Ρ‡Π΅ΠΉΠΊΠ° 2 
     Π―Ρ‡Π΅ΠΉΠΊΠ° 3 
  
  
     Π―Ρ‡Π΅ΠΉΠΊΠ° 4 
     Π―Ρ‡Π΅ΠΉΠΊΠ° 5 
     Π―Ρ‡Π΅ΠΉΠΊΠ° 6 
  

  
Π―Ρ‡Π΅ΠΉΠΊΠ° 1 Π―Ρ‡Π΅ΠΉΠΊΠ° 2 Π―Ρ‡Π΅ΠΉΠΊΠ° 3
Π―Ρ‡Π΅ΠΉΠΊΠ° 4 Π―Ρ‡Π΅ΠΉΠΊΠ° 5 Π―Ρ‡Π΅ΠΉΠΊΠ° 6

Π’Π΅ΠΏΠ΅Ρ€ΡŒ, ΠΊΠΎΠ³Π΄Π° ΠΌΡ‹ ΠΈΠ·ΡƒΡ‡ΠΈΠ»ΠΈ Π±Π°Π·ΠΎΠ²ΡƒΡŽ структуру Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ HTML, ΠΏΠΎΡ€Π° ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π±ΠΎΠ»Π΅Π΅ ΠΏΠΎΠ»Π΅Π·Π½ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½Π½Ρ‹ΠΌΠΈ функциями — ΠΊΠ°ΠΊ ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ элСмСнты, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π²

.

Как Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π² HTML

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Π΅Π³Π°

. Π­Ρ‚ΠΎΡ‚ Ρ‚Π΅Π³ Π·Π°ΠΌΠ΅Π½ΠΈΡ‚ Ρ‚Π΅Π³

, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для прСдставлСния фактичСских ячССк Π΄Π°Π½Π½Ρ‹Ρ….

ΠžΠ±Ρ‹Ρ‡Π½ΠΎ Π²Ρ‹ Π΄Π΅Π»Π°Π΅Ρ‚Π΅ Π²Π΅Ρ€Ρ…Π½ΡŽΡŽ строку Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½ΠΈΠΆΠ΅. Но Π²Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ элСмСнт

Π² любой строкС. Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Ρ‹ Π² Ρ‚Π΅Π³Π΅

, ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°ΡŽΡ‚ΡΡ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ ΠΈ ΠΏΠΎΠ»ΡƒΠΆΠΈΡ€Π½Ρ‹ΠΌ ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠΌ.
ΠŸΡ€ΠΈΠΌΠ΅Ρ€ с

  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
Компания Π‘Π²ΡΠ·Π°Ρ‚ΡŒΡΡ Π‘Ρ‚Ρ€Π°Π½Π°
TechMania ΠœΠ°Ρ€ΠΈΡ ГСрмания
ΠšΠΎΠΌΠΌΠ΅Ρ€Ρ‡Π΅ΡΠΊΠΈΠΉ Ρ†Π΅Π½Ρ‚Ρ€ Ѐранциско МСксика
Компания ΠšΠΎΠ½Ρ‚Π°ΠΊΡ‚ Π‘Ρ‚Ρ€Π°Π½Π°
TechMania ΠœΠ°Ρ€ΠΈΡ ГСрмания
ΠšΠΎΠΌΠΌΠ΅Ρ€Ρ‡Π΅ΡΠΊΠΈΠΉ Ρ†Π΅Π½Ρ‚Ρ€ Ѐранциско МСксика

Π’ ΠΏΡ€ΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π²Ρ‹ΡˆΠ΅ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ ΠΌΡ‹ Π²ΠΈΠ΄ΠΈΠΌ Ρ€ΠΎΠ»ΡŒ, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ ΠΈΠ³Ρ€Π°Π΅Ρ‚ Ρ‚Π΅Π³

— ΠΎΠ½ прСдоставляСт ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ для ΠΎΡΡ‚Π°Π»ΡŒΠ½Ρ‹Ρ… ячССк Π² столбцах, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ ΠΎΠ½ ΠΏΡ€ΠΈΠ½Π°Π΄Π»Π΅ΠΆΠΈΡ‚.

Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ области Π² HTML

Атрибут области опрСдСляСт способ ΡΠ²ΡΠ·Π°Ρ‚ΡŒ ячСйки Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΈ ячСйки Π΄Π°Π½Π½Ρ‹Ρ… Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅.

Атрибут области опрСдСляСт, являСтся Π»ΠΈ ячСйка Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ для столбца ΠΈΠ»ΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ для строки.

Π­Ρ‚ΠΎΡ‚ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ объявлСн Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π² ячСйкС Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΈ ΠΏΡ€ΠΈΠ½ΠΈΠΌΠ°Π΅Ρ‚ значСния Β«colΒ», Β«rowΒ», Β«colgroupΒ» ΠΈ Β«rowgroupΒ». ЗначСния Β«colΒ» ΠΈ Β«rowΒ» ΡƒΠΊΠ°Π·Ρ‹Π²Π°ΡŽΡ‚, Ρ‡Ρ‚ΠΎ ячСйка Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° прСдоставляСт ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° для ΠΎΡΡ‚Π°Π»ΡŒΠ½Ρ‹Ρ… ячССк Π² столбцС ΠΈΠ»ΠΈ строкС (соотвСтствСнно), Π³Π΄Π΅ ΠΎΠ½Π° располоТСна.

Бинтаксис Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π° области
  
  

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ Π² ΠΊΠΎΠ΄Π΅

  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
     Π”Π΅Π½ΡŒ 
     БСгодня 
     Π—Π°Π²Ρ‚Ρ€Π° 
     Ρ‡Π΅Ρ‚Π²Π΅Ρ€Π³ 
  

  
     УсловиС 
     Π‘ΠΎΠ»Π½Π΅Ρ‡Π½ΠΎ 
     ΠŸΡ€Π΅ΠΈΠΌΡƒΡ‰Π΅ΡΡ‚Π²Π΅Π½Π½ΠΎ солнСчно 
     НСбольшая ΠΎΠ±Π»Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ 
  

  
     Π’Π΅ΠΌΠΏΠ΅Ρ€Π°Ρ‚ΡƒΡ€Π° 
     19 Β° C 
     17 Β° C 
     12 Β° C 
  

  
Π”Π΅Π½ΡŒ БСгодня Π—Π°Π²Ρ‚Ρ€Π° Π§Π΅Ρ‚Π²Π΅Ρ€Π³
БостояниС Π‘ΠΎΠ»Π½Π΅Ρ‡Π½Ρ‹ΠΉ ΠŸΡ€Π΅ΠΈΠΌΡƒΡ‰Π΅ΡΡ‚Π²Π΅Π½Π½ΠΎ солнСчно ΠŸΠ΅Ρ€Π΅ΠΌΠ΅Π½Π½Π°Ρ ΠΎΠ±Π»Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ
Π’Π΅ΠΌΠΏΠ΅Ρ€Π°Ρ‚ΡƒΡ€Π° 19 Β° Π‘ 17 Β° Π‘ 12 Β° Π‘

Как Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ подпись ΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Π΅

Π­Ρ‚ΠΎ Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π΄Π΅Π»Π°Π΅Ρ‚ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π±ΠΎΠ»Π΅Π΅ Ρ‡ΠΈΡ‚Π°Π΅ΠΌΠΎΠΉ.Π’ основном Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для описания Π΄Π°Π½Π½Ρ‹Ρ…, прСдставлСнных Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅.

Π§Ρ‚ΠΎΠ±Ρ‹ Π²ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ элСмСнт

сразу послС ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰Π΅Π³ΠΎ Ρ‚Π΅Π³Π° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.

Бинтаксис подписи
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
   
   

  

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ Π² ΠΊΠΎΠ΄Π΅

  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
   Расход Ρ‚ΠΎΠΏΠ»ΠΈΠ²Π° Π°Π²Ρ‚ΠΎΠΌΠΎΠ±ΠΈΠ»Π΅ΠΉ Π²ΠΎ врСмя Π΄Ρ€Π°ΠΉΠ²-тСстов 
  
     ΠΠ²Ρ‚ΠΎΠΌΠΎΠ±ΠΈΠ»ΡŒ 
     ΡΠ½Π²Π°Ρ€ΡŒ 
     Ρ„Π΅Π²Ρ€Π°Π»ΡŒ 
     ΠΌΠ°Ρ€Ρ‚ 
  
  
     G-Wagon 
     30 Π³Π°Π»Π»ΠΎΠ½ΠΎΠ² 
     82 Π³Π°Π»Π»ΠΎΠ½Π° 
     70 Π³Π°Π»Π»ΠΎΠ½ΠΎΠ² 
  

  
Расход Ρ‚ΠΎΠΏΠ»ΠΈΠ²Π° Π°Π²Ρ‚ΠΎΠΌΠΎΠ±ΠΈΠ»Π΅ΠΉ ΠΏΡ€ΠΈ Ρ…ΠΎΠ΄ΠΎΠ²Ρ‹Ρ… испытаниях
ΠΠ²Ρ‚ΠΎΠΌΠΎΠ±ΠΈΠ»ΡŒ Π―Π½Π²Π°Ρ€ΡŒ Π€Π΅Π²Ρ€Π°Π»ΡŒ ΠœΠ°Ρ€Ρ‚
G-Wagon 30 Π³Π°Π»Π»ΠΎΠ½ΠΎΠ² 82 Π³Π°Π»Π»ΠΎΠ½Π° 70 Π³Π°Π»Π»ΠΎΠ½ΠΎΠ²

Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ€Π°Π·Π±ΠΈΠ΅Π½ΠΈΠ΅ ячССк Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅ HTML

Π’Ρ‹ ΠΌΠΎΠ³Π»ΠΈ Π²ΠΈΠ΄Π΅Ρ‚ΡŒ ячСйки, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π·Π°Π½ΠΈΠΌΠ°ΡŽΡ‚ Π΄Π²Π° ΠΈΠ»ΠΈ Π±ΠΎΠ»Π΅Π΅ столбца ΠΈΠ»ΠΈ строки Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅.Π­Ρ‚ΠΎ называСтся ΠΎΡ…Π²Π°Ρ‚ΠΎΠΌ ячССк.

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ячСйки, ΠΎΡ…Π²Π°Ρ‚Ρ‹Π²Π°ΡŽΡ‰ΠΈΠ΅ строки ΠΈ столбцы, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π΄Π²Π° Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π°:

ΠΈ

. Для этой Ρ€Π°Π±ΠΎΡ‚Ρ‹ Π²Π°ΠΌ понадобятся Π΄Π²Π° Π΄Ρ€ΡƒΠ³ΠΈΡ… Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π° ячССк: colspan для Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΠΎΠ³ΠΎ ΠΈ rowspan для Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎΠ³ΠΎ ΠΎΡ…Π²Π°Ρ‚Π°.

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΡ€ΠΈΡΠ²ΠΎΠΈΡ‚ΡŒ этим Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π°ΠΌ цСлочислСнноС Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅, большСС, Ρ‡Π΅ΠΌ ноль, ΠΏΡ€Π΅Π΄ΡΡ‚Π°Π²Π»ΡΡŽΡ‰Π΅Π΅ количСство ячССк, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΎΡ…Π²Π°Ρ‚ΠΈΡ‚ΡŒ.

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ Π² ΠΊΠΎΠ΄Π΅:
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
     
     Π”Π΅Π½ΡŒ 1 
     Π”Π΅Π½ΡŒ 2 
     Π”Π΅Π½ΡŒ 3 
     Π”Π΅Π½ΡŒ 4 
  
  
     Майк (Ρ€Π°Π½Π΅Π½) 
     0 ΠΊΠΌ 
     4 ΠΊΠΌ 
  
  
     Бьюзан 
     23 ΠΊΠΌ 
     18 ΠΊΠΌ 
     19 ΠΊΠΌ 
     15 ΠΊΠΌ 
  
  
Π”Π΅Π½ΡŒ 1 Π”Π΅Π½ΡŒ 2 Π”Π΅Π½ΡŒ 3 Π”Π΅Π½ΡŒ 4
Майк (Ρ€Π°Π½Π΅Π½) 0 ΠΊΠΌ 4 ΠΊΠΌ
Бьюзан 23 км 18 км 19 км 15 км

ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎ Π² ΠΏΡ€ΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π²Ρ‹ΡˆΠ΅ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ Ρƒ нас Π΅ΡΡ‚ΡŒ ячСйка, ΠΎΡ…Π²Π°Ρ‚Ρ‹Π²Π°ΡŽΡ‰Π°Ρ 3 ячСйки, ΠΊΠ°ΠΊ ΡƒΠΊΠ°Π·Π°Π½ΠΎ colspan .Π’ΠΎ ΠΆΠ΅ самоС происходит Π² случаС rowspan , Π½ΠΎ Π² этом случаС это Π±ΡƒΠ΄Π΅Ρ‚ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎΠ΅ ΠΏΠ΅Ρ€Π΅ΠΊΡ€Ρ‹Ρ‚ΠΈΠ΅.

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ ΠΊΠΎΠ΄Π°:
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
     
     Π‘Π°Π·ΠΎΠ²Ρ‹ΠΉ 
     ΠŸΠΎΠ»Π½Ρ‹ΠΉ 
  
  
     Настройка 
     БСсплатно! 
     49,99 долл. БША 
  
  
     ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ Π³ΠΎΠ΄ 
     19,99 долл. БША 
  
  
     Π’Ρ‚ΠΎΡ€ΠΎΠΉ Π³ΠΎΠ΄ 
     9 Π΄ΠΎΠ»Π»Π°Ρ€ΠΎΠ² БША.99 
     29,99 долл. БША 
  

  
Π‘Π°Π·ΠΎΠ²Ρ‹ΠΉ ΠŸΠΎΠ»Π½Ρ‹ΠΉ
Настройка БСсплатно! $ 49,99
ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ Π³ΠΎΠ΄ $ 19.99
Π’Ρ‚ΠΎΡ€ΠΎΠΉ Π³ΠΎΠ΄ $ 9,99 29,99 Π΄ΠΎΠ»Π». БША

ΠŸΡ€ΠΈ использовании colspan ΠΈ rowspan ΡƒΠ±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΠΎΠ±ΡŠΡΠ²Π»ΡΠ΅Ρ‚Π΅ ΠΈΡ… ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ·Π±Π΅ΠΆΠ°Ρ‚ΡŒ пСрСкрытия ячССк.

Как Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, тСкст ΠΈ Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ» Π² Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ HTML

Π’Π°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΠΈ Π½Π° Π²Π΅Π±-сайтах с трСмя основными Ρ€Π°Π·Π΄Π΅Π»Π°ΠΌΠΈ, Ρ‚Π°Π±Π»ΠΈΡ†Π° Ρ‚ΠΎΠΆΠ΅. ΠœΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚ΡŒ наши Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π½Π° Ρ‚Ρ€ΠΈ основныС части: Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ», Ρ‚Π΅Π»ΠΎ ΠΈ Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ».

  • — ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для создания ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎΠ³ΠΎ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.

  • — ΡƒΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚ ΠΎΡΠ½ΠΎΠ²Π½ΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.

  • — создаСт ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹ΠΉ Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ» для Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.

Π§Ρ‚ΠΎΠ±Ρ‹ Π»ΡƒΡ‡ΡˆΠ΅ ΠΏΠΎΠ½ΡΡ‚ΡŒ, ΠΊΠ°ΠΊ это Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚, Π΄Π°Π²Π°ΠΉΡ‚Π΅ рассмотрим ΠΏΡ€ΠΈΠΌΠ΅Ρ€ с использованиСм Π΄Π°Π½Π½Ρ‹Ρ… ΠΈΠ· Π΄Π²ΡƒΡ… Π³Ρ€ΡƒΠΏΠΏ. Π’Π°Π±Π»ΠΈΡ†Π° ΠΈΠΌΠ΅Π΅Ρ‚ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ со строками, Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ» со сводкой Π΄Π°Π½Π½Ρ‹Ρ… ΠΈ Π±Π»ΠΎΠΊ строк, ΡΠΎΡΡ‚Π°Π²Π»ΡΡŽΡ‰ΠΈΡ… Ρ‚Π΅Π»ΠΎ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹:

  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       
       Π­Π½Ρ‚ΠΎΠ½ΠΈ 
       Π›ΠΈΠΎΠ½ 
    
    
       Π”Π°Ρ‚Π° 
       Π”ΠΎΡ…ΠΎΠ΄ 
       Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ 
       Π”ΠΎΡ…ΠΎΠ΄ 
       Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ 
    
  

  
    
       15 июля 
       200,00 долл. БША 
       50,00 долл. БША 
       0 Π΄ΠΎΠ»Π»Π°Ρ€ΠΎΠ² 
       0 Π΄ΠΎΠ»Π»Π°Ρ€ΠΎΠ² 
    
    
       28 июля 
       0,00 долл. БША 
       100,00 долл. БША 
       100,00 долл. БША 
       0,00 долл. БША 
    
  
    
  <Ρ„ΡƒΡ‚>
    
       Баланс 
       20,00 Π΄ΠΎΠ»Π»Π°Ρ€ΠΎΠ² БША 
       10,00 Π΄ΠΎΠ»Π»Π°Ρ€ΠΎΠ² БША 
    
  
  
Π­Π½Ρ‚ΠΎΠ½ΠΈ Π›ΠΈΠΎΠ½
Π”Π°Ρ‚Π° Π”ΠΎΡ…ΠΎΠ΄ Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Π”ΠΎΡ…ΠΎΠ΄ Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚
07/15 $ 200,00 $ 50,00 $ 0 $ 0
28 июля $ 0,00 $ 100,00 $ 100,00 $ 0,00
ВСсы $ 20,00 $ 10,00

Π’Π°Π±Π»ΠΈΡ†Π° ΠΌΠΎΠΆΠ΅Ρ‚ ΠΈΠΌΠ΅Ρ‚ΡŒ Π±ΠΎΠ»Π΅Π΅ ΠΎΠ΄Π½ΠΎΠ³ΠΎ Ρ‚Π΅Π»Π°.Π’ Ρ‚Π°ΠΊΠΎΠΌ сцСнарии ΠΊΠ°ΠΆΠ΄ΠΎΠ΅ Ρ‚Π΅Π»ΠΎ Π³Ρ€ΡƒΠΏΠΏΠΈΡ€ΡƒΠ΅Ρ‚ связанныС Π΄Ρ€ΡƒΠ³ с Π΄Ρ€ΡƒΠ³ΠΎΠΌ строки.

Как ΡΡ‚ΠΈΠ»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ HTML с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ CSS

Π’ Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²Π΅ Ρ‚Π°Π±Π»ΠΈΡ†, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ Π²ΠΈΠ΄ΠΈΡ‚Π΅, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ Ρ€Π°Π·Π½Ρ‹Π΅ Ρ†Π²Π΅Ρ‚Π° ΠΈ ΠΌΠ΅Ρ‚ΠΎΠ΄Ρ‹ стилизации, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°Π·Π»ΠΈΡ‡Π°Ρ‚ΡŒ ΠΈΡ… Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ ΠΈ Π²Π°ΠΆΠ½Ρ‹Π΅ значСния. Π’ ΠΊΠΎΠ½Ρ†Π΅ ΠΊΠΎΠ½Ρ†ΠΎΠ², ΠΊΡ‚ΠΎ Π·Π°Ρ…ΠΎΡ‡Π΅Ρ‚ ΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π½Π° Π΄Π°Π½Π½Ρ‹Π΅, Ρ€Π°Π·Π΄Π΅Π»Π΅Π½Π½Ρ‹Π΅ ΠΎΠ΄Π½ΠΎΠΉ строкой …?

Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΡΡ‚ΠΈΠ»ΡŒ Π² Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, Π²Π°ΠΌ потрСбуСтся ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Ρ„Π°ΠΉΠ» .css, Π½Π° ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹ Π±ΡƒΠ΄Π΅Ρ‚Π΅ ΡΡΡ‹Π»Π°Ρ‚ΡŒΡΡ Π² своСм основном Ρ„Π°ΠΉΠ»Π΅ HTML.

Π’ ΠΏΡ€ΠΈΠ²Π΅Π΄Π΅Π½Π½ΠΎΠΌ Π²Ρ‹ΡˆΠ΅ ΠΊΠΎΠ΄Π΅ ΠΌΡ‹ создали ΠΏΡ€ΠΎΡΡ‚ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ структурныС элСмСнты, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΡ‹ рассмотрСли Π² ΡΡ‚Π°Ρ‚ΡŒΠ΅.

ΠœΡ‹ Ρ‚Π°ΠΊΠΆΠ΅ пошли дальшС ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΠ»ΠΈ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ стиля, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ наш стол Π±ΠΎΠ»Π΅Π΅ ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΌ. Π’Π°Π±Π»ΠΈΡ†Π° Ρ‚Π°ΠΊΠΆΠ΅ ΠΈΠΌΠ΅Π΅Ρ‚ фиксированный Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, поэтому Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‡ΠΈΠ²Π°Ρ‚ΡŒ большой объСм Π΄Π°Π½Π½Ρ‹Ρ… ΠΈ ΠΏΠΎ-ΠΏΡ€Π΅ΠΆΠ½Π΅ΠΌΡƒ Π²ΠΈΠ΄Π΅Ρ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ³ΠΎ столбца.

Когда ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π² HTML

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π² своСм HTML ΠΌΠ½ΠΎΠ³ΠΎ Ρ€Π°Π·.

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Ссли Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΡΡ€Π°Π²Π½ΠΈΡ‚ΡŒ ΠΈ ΡΠΎΠΏΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π΄Π°Π½Π½Ρ‹Π΅ с ΠΎΠ±Ρ‰ΠΈΠΌΠΈ характСристиками

Π’Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π΅Π³ΠΎ, Ссли Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄Π°Ρ‚ΡŒ ΠΎΠ±Π·ΠΎΡ€ числовых Π΄Π°Π½Π½Ρ‹Ρ….

Π’Π°Π±Π»ΠΈΡ†Π° ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΌΠΎΡ‡ΡŒ читатСлям быстро Π½Π°ΠΉΡ‚ΠΈ ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½ΡƒΡŽ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ, ΠΈΠ·Π»ΠΎΠΆΠ΅Π½Π½ΡƒΡŽ Π² ясной Ρ„ΠΎΡ€ΠΌΠ΅.

Π—Π°ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅

Π’Π°Π±Π»ΠΈΡ†Ρ‹ — ΠΎΡ‚Π»ΠΈΡ‡Π½Ρ‹ΠΉ способ прСдставлСния Ρ‚Π°Π±Π»ΠΈΡ‡Π½Ρ‹Ρ… Π΄Π°Π½Π½Ρ‹Ρ…, ΠΈ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΈΡ…, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π±Π°Π·ΠΎΠ²Ρ‹Π΅ элСмСнты HTML, Ρ‚Π°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ

,

,

.

И Π²Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ стиля, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ΠΈ Ρ…ΠΎΡ€ΠΎΡˆΠΎ выглядСли ΠΈ Ρ‡Π΅Ρ‚ΠΊΠΎ прСдставляли Π΄Π°Π½Π½Ρ‹Π΅.

Π’ Π·Π°ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅, Π΄Π°Π²Π°ΠΉΡ‚Π΅ создадим Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ основныС Ρ‚Π΅ΠΌΡ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΡ‹ рассмотрСли Π² этой ΡΡ‚Π°Ρ‚ΡŒΠ΅:

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ€Π°ΠΌΠΊΡƒ ΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Π΅ Π² Office для Mac

Π’ зависимости ΠΎΡ‚ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ Π²Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚Π΅, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ ΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Π΅ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π³Π°Π»Π΅Ρ€Π΅ΠΈ стилСй Π³Ρ€Π°Π½ΠΈΡ†, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π·Π°Ρ€Π°Π½Π΅Π΅ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Π½Π½Ρ‹ΠΉ ΡΡ‚ΠΈΠ»ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈΠ»ΠΈ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ свою ΡΠΎΠ±ΡΡ‚Π²Π΅Π½Π½ΡƒΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ.

Π‘Π»ΠΎΠ²ΠΎ

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π³Π°Π»Π΅Ρ€Π΅ΡŽ стилСй Π³Ρ€Π°Π½ΠΈΡ†, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ

Π‘Π°ΠΌΡ‹ΠΉ быстрый способ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Π² Word — ΠΈΠ· Π³Π°Π»Π΅Ρ€Π΅ΠΈ стилСй Π³Ρ€Π°Π½ΠΈΡ†.

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΌΠ°Ρ€ΠΊΠ΅Ρ€ пСрСмСщСния Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ , Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ.

    ΠŸΠΎΡΠ²ΠΈΡ‚ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠ° Table Tools Design . (Π’ Office для Mac ΠΏΠΎΡΠ²Π»ΡΡŽΡ‚ΡΡ Π²ΠΊΠ»Π°Π΄ΠΊΠΈ Table Design ΠΈ Layout . Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π²ΠΊΠ»Π°Π΄ΠΊΡƒ Table Design .)

  2. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π‘Ρ‚ΠΈΠ»ΠΈ Π³Ρ€Π°Π½ΠΈΡ† ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  3. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Borders ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅, Π³Π΄Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

    Π‘ΠΎΠ²Π΅Ρ‚: Π§Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ для части Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, ΡƒΠ±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹Π±Ρ€Π°Π½ Border Painter , Π° Π·Π°Ρ‚Π΅ΠΌ Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΊΠ°ΠΆΠ΄ΡƒΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ, ΠΊΠΎΡ‚ΠΎΡ€ΡƒΡŽ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ.Word примСняСт ΡΡ‚ΠΈΠ»ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹ ΡƒΠΆΠ΅ Π²Ρ‹Π±Ρ€Π°Π»ΠΈ, ΠΈ Π²Π°ΠΌ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Π²Ρ‹Π±ΠΈΡ€Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ для добавлСния Π³Ρ€Π°Π½ΠΈΡ†Ρ‹

ΠŸΡ€ΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ Π·Π°Ρ€Π°Π½Π΅Π΅ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Π½Π½ΠΎΠ³ΠΎ стиля стола — Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ быстрый способ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ ваш стол.Π‘Ρ‚ΠΈΠ»ΠΈ Ρ‚Π°Π±Π»ΠΈΡ† Π΄ΠΎΠ±Π°Π²Π»ΡΡŽΡ‚ согласованныС Π³Ρ€Π°Π½ΠΈΡ†Ρ‹, Π·Π°Ρ‚Π΅Π½Π΅Π½ΠΈΠ΅ ΠΈ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ тСкста.

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π²ΠΊΠ»Π°Π΄ΠΊΡƒ Table Tools Design (Π²ΠΊΠ»Π°Π΄ΠΊΠ° Table Design Π² Office для Mac).

  2. Π’ Π³Π°Π»Π΅Ρ€Π΅Π΅ Π‘Ρ‚ΠΈΠ»ΠΈ Ρ‚Π°Π±Π»ΠΈΡ† Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ стили Π³Π°Π»Π΅Ρ€Π΅ΠΈ, Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ стрСлку Π•Ρ‰Π΅ . (Π­Ρ‚Π° стрСлка отобраТаСтся ΠΏΠΎΠ΄ Π³Π°Π»Π΅Ρ€Π΅Π΅ΠΉ Π² Office для Mac.)

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π½Π°ΡΡ‚Ρ€Π°ΠΈΠ²Π°Π΅ΠΌΡƒΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ

Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΡΠΎΠ±ΡΡ‚Π²Π΅Π½Π½ΡƒΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ†Π²Π΅Ρ‚, ΡˆΠΈΡ€ΠΈΠ½Ρƒ, ΡΡ‚ΠΈΠ»ΡŒ Π»ΠΈΠ½ΠΈΠΈ ΠΈ мСсто, Π³Π΄Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  1. Π’ Word ΠΈΠ»ΠΈ Outlook Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΌΠ°Ρ€ΠΊΠ΅Ρ€ пСрСмСщСния Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ , Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ.

    Π’ PowerPoint Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π² любом мСстС внСшнСй Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ Π΅Π΅. (ΠœΠ°Ρ€ΠΊΠ΅Ρ€ пСрСмСщСния Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π½Π΅ отобраТаСтся Π² PowerPoint.)

  2. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π²ΠΊΠ»Π°Π΄ΠΊΡƒ Table Tools Design (Π²ΠΊΠ»Π°Π΄ΠΊΠ° Table Tools Π² Office для Mac).

  3. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ свой Π±ΠΎΡ€Π΄ΡŽΡ€.

    Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π‘Ρ‚ΠΈΠ»ΡŒ Π»ΠΈΠ½ΠΈΠΈ ( Π‘Ρ‚ΠΈΠ»ΡŒ ΠΏΠ΅Ρ€Π° Π² PowerPoint) ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ.

    Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π’ΠΎΠ»Ρ‰ΠΈΠ½Π° Π»ΠΈΠ½ΠΈΠΈ ( Π’ΠΎΠ»Ρ‰ΠΈΠ½Π° ΠΏΠ΅Ρ€Π° Π² PowerPoint) ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½ΡƒΡŽ ΡˆΠΈΡ€ΠΈΠ½Ρƒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

    Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Pen Color ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ†Π²Π΅Ρ‚.

  4. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Borders ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

    Π‘ΠΎΠ²Π΅Ρ‚: Π§Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ для части Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, ΡƒΠ±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹Π±Ρ€Π°Π½ Border Painter , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΊΠ°ΠΆΠ΄ΡƒΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅.Word добавляСт Ρ€Π°ΠΌΠΊΡƒ Π² стилС, ΡˆΠΈΡ€ΠΈΠ½Π΅ ΠΈ Ρ†Π²Π΅Ρ‚Π΅, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ ΡƒΠΆΠ΅ Π²Ρ‹Π±Ρ€Π°Π»ΠΈ, ΠΈ Π²Π°ΠΌ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Π²Ρ‹Π±ΠΈΡ€Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ.

PowerPoint

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ для добавлСния Π³Ρ€Π°Π½ΠΈΡ†Ρ‹

ΠŸΡ€ΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ Π·Π°Ρ€Π°Π½Π΅Π΅ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Π½Π½ΠΎΠ³ΠΎ стиля стола — быстрый способ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ ваш стол срСди Π΄Ρ€ΡƒΠ³ΠΈΡ….Π‘Ρ‚ΠΈΠ»ΠΈ Ρ‚Π°Π±Π»ΠΈΡ† Π΄ΠΎΠ±Π°Π²Π»ΡΡŽΡ‚ согласованныС Π³Ρ€Π°Π½ΠΈΡ†Ρ‹, Π·Π°Ρ‚Π΅Π½Π΅Π½ΠΈΠ΅ ΠΈ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ тСкста.

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π²ΠΊΠ»Π°Π΄ΠΊΡƒ Table Tools Design (Π²ΠΊΠ»Π°Π΄ΠΊΠ° Table Design Π² Office для Mac).

  2. Π’ Π³Π°Π»Π΅Ρ€Π΅Π΅ Π‘Ρ‚ΠΈΠ»ΠΈ Ρ‚Π°Π±Π»ΠΈΡ† Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ стили Π³Π°Π»Π΅Ρ€Π΅ΠΈ, Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ стрСлку Π•Ρ‰Π΅ . (Π­Ρ‚Π° стрСлка отобраТаСтся ΠΏΠΎΠ΄ Π³Π°Π»Π΅Ρ€Π΅Π΅ΠΉ Π² Office для Mac.)

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π½Π°ΡΡ‚Ρ€Π°ΠΈΠ²Π°Π΅ΠΌΡƒΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ

Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΡΠΎΠ±ΡΡ‚Π²Π΅Π½Π½ΡƒΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ, Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ†Π²Π΅Ρ‚, ΡˆΠΈΡ€ΠΈΠ½Ρƒ, ΡΡ‚ΠΈΠ»ΡŒ Π»ΠΈΠ½ΠΈΠΈ ΠΈ мСсто, Π³Π΄Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  1. Π’ Word ΠΈΠ»ΠΈ Outlook Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΌΠ°Ρ€ΠΊΠ΅Ρ€ пСрСмСщСния Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ , Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ.

    Π’ PowerPoint Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π² любом мСстС внСшнСй Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ Π΅Π΅. (ΠœΠ°Ρ€ΠΊΠ΅Ρ€ пСрСмСщСния Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π½Π΅ отобраТаСтся Π² PowerPoint.)

  2. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π²ΠΊΠ»Π°Π΄ΠΊΡƒ Table Tools Design (Π²ΠΊΠ»Π°Π΄ΠΊΠ° Table Tools Π² Office для Mac).

  3. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ свой Π±ΠΎΡ€Π΄ΡŽΡ€.

    Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π‘Ρ‚ΠΈΠ»ΡŒ Π»ΠΈΠ½ΠΈΠΈ ( Π‘Ρ‚ΠΈΠ»ΡŒ ΠΏΠ΅Ρ€Π° Π² PowerPoint) ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΡΡ‚ΠΈΠ»ΡŒ.

    Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π’ΠΎΠ»Ρ‰ΠΈΠ½Π° Π»ΠΈΠ½ΠΈΠΈ ( Π’ΠΎΠ»Ρ‰ΠΈΠ½Π° ΠΏΠ΅Ρ€Π° Π² PowerPoint) ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½ΡƒΡŽ ΡˆΠΈΡ€ΠΈΠ½Ρƒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

    Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Pen Color ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Ρ†Π²Π΅Ρ‚.

  4. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Borders ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

    Π‘ΠΎΠ²Π΅Ρ‚: Π§Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ для части Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, ΡƒΠ±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹Π±Ρ€Π°Π½ Border Painter , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΊΠ°ΠΆΠ΄ΡƒΡŽ Π³Ρ€Π°Π½ΠΈΡ†Ρƒ Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅.Word добавляСт Ρ€Π°ΠΌΠΊΡƒ Π² стилС, ΡˆΠΈΡ€ΠΈΠ½Π΅ ΠΈ Ρ†Π²Π΅Ρ‚Π΅, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ ΡƒΠΆΠ΅ Π²Ρ‹Π±Ρ€Π°Π»ΠΈ, ΠΈ Π²Π°ΠΌ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Π²Ρ‹Π±ΠΈΡ€Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ.

Π’Π°ΠΆΠ½ΠΎ:
Office для Mac 2011 большС Π½Π΅ поддСрТиваСтся . ΠŸΠ΅Ρ€Π΅ΠΉΠ΄ΠΈΡ‚Π΅ Π½Π° Microsoft 365, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ Π³Π΄Π΅ ΡƒΠ³ΠΎΠ΄Π½ΠΎ с любого устройства, ΠΈ ΠΏΡ€ΠΎΠ΄ΠΎΠ»ΠΆΠ°ΠΉΡ‚Π΅ ΠΏΠΎΠ»ΡƒΡ‡Π°Ρ‚ΡŒ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΊΡƒ.

ΠžΠ±Π½ΠΎΠ²ΠΈΡ‚ΡŒ сСйчас

Π‘Π»ΠΎΠ²ΠΎ

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ ΠΊΠΎ всСй Ρ‚Π°Π±Π»ΠΈΡ†Π΅ ΠΈΠ»ΠΈ ΠΊ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½Ρ‹ΠΌ ячСйкам Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ»ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ячСйки, ΠΊ ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  2. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π“Ρ€Π°Π½ΠΈΡ†Ρ‹ , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΡΡ‚ΠΈΠ»ΡŒ Π»ΠΈΠ½ΠΈΠΈ

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ»ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ячСйки, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  2. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Tables Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ Draw Borders Π²ΠΎ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅ΠΌ мСню Line Style Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹ΠΉ ΡΡ‚ΠΈΠ»ΡŒ Π»ΠΈΠ½ΠΈΠΈ.

  3. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π“Ρ€Π°Π½ΠΈΡ†Ρ‹ , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΡˆΠΈΡ€ΠΈΠ½Ρƒ Π»ΠΈΠ½ΠΈΠΈ

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ»ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ячСйки, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  2. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Π²ΠΎ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅ΠΌ мСню Π’ΠΎΠ»Ρ‰ΠΈΠ½Π° Π»ΠΈΠ½ΠΈΠΈ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹ΠΉ вСс Π»ΠΈΠ½ΠΈΠΈ.

  3. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π“Ρ€Π°Π½ΠΈΡ†Ρ‹ , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

Π£Π΄Π°Π»ΠΈΡ‚ΡŒ Π±ΠΎΡ€Π΄ΡŽΡ€

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ»ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ячСйки, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  2. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π“Ρ€Π°Π½ΠΈΡ†Ρ‹ , Π° Π·Π°Ρ‚Π΅ΠΌ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ НСт .

PowerPoint

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ ΠΊΠΎ всСй Ρ‚Π°Π±Π»ΠΈΡ†Π΅ ΠΈΠ»ΠΈ ΠΊ Π²Ρ‹Π΄Π΅Π»Π΅Π½Π½Ρ‹ΠΌ ячСйкам Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ»ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ячСйки, ΠΊ ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  2. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ стрСлку рядом с ΠΏΠΎΠ»Π΅ΠΌ Π“Ρ€Π°Π½ΠΈΡ†Ρ‹ , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΡΡ‚ΠΈΠ»ΡŒ Π»ΠΈΠ½ΠΈΠΈ

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ»ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ячСйки, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  2. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Tables Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ Draw Borders Π²ΠΎ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅ΠΌ мСню Line Style Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹ΠΉ ΡΡ‚ΠΈΠ»ΡŒ Π»ΠΈΠ½ΠΈΠΈ.

  3. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ стрСлку рядом с ΠΏΠΎΠ»Π΅ΠΌ Π“Ρ€Π°Π½ΠΈΡ†Ρ‹ , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΡˆΠΈΡ€ΠΈΠ½Ρƒ Π»ΠΈΠ½ΠΈΠΈ

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ»ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ячСйки, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  2. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Π²ΠΎ Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‰Π΅ΠΌ мСню Π’ΠΎΠ»Ρ‰ΠΈΠ½Π° Π»ΠΈΠ½ΠΈΠΈ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹ΠΉ вСс Π»ΠΈΠ½ΠΈΠΈ.

  3. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ стрСлку рядом с ΠΏΠΎΠ»Π΅ΠΌ Π“Ρ€Π°Π½ΠΈΡ†Ρ‹ , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ Π»ΠΈΠ½ΠΈΠΈ

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ»ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ячСйки, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΈΠ»ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  2. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ стрСлку рядом с ΠΏΠΎΠ»Π΅ΠΌ Π¦Π²Π΅Ρ‚ Π»ΠΈΠ½ΠΈΠΈ , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚ Π»ΠΈΠ½ΠΈΠΈ.

  3. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ стрСлку рядом с ΠΏΠΎΠ»Π΅ΠΌ Π“Ρ€Π°Π½ΠΈΡ†Ρ‹ , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹Π΅ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

Π£Π΄Π°Π»ΠΈΡ‚ΡŒ Π±ΠΎΡ€Π΄ΡŽΡ€

  1. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΈΠ»ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ячСйки, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹.

  2. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π’Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΠ°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π³Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ стрСлку рядом с ΠΏΠΎΠ»Π΅ΠΌ Π“Ρ€Π°Π½ΠΈΡ†Ρ‹ , Π° Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Π‘Π΅Π· Π³Ρ€Π°Π½ΠΈΡ† .

Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½Π½Ρ‹Ρ… Ρ‚Π°Π±Π»ΠΈΡ† | Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Ρ‹ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, строки ΠΈ ячСйки, COLSPAN ΠΈ ROWSPAN

ΠŸΡƒΡ‚ΡŒ // www.yourhtmlsource.com β†’ Π’Π°Π±Π»ΠΈΡ†Ρ‹ β†’ Π ΠΠ‘Π¨Π˜Π Π•ΠΠΠ«Π• Π’ΠΠ‘Π›Π˜Π¦Π«


Π‘ΠΎΠ»Π΅Π΅ слоТныС ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ Ρ‚Π°Π±Π»ΠΈΡ† Ρ‚Ρ€Π΅Π±ΡƒΡŽΡ‚ Π±ΠΎΠ»Π΅Π΅ слоТных Π΄ΠΈΠ·Π°ΠΉΠ½ΠΎΠ² Ρ‚Π°Π±Π»ΠΈΡ† ΠΈ Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ΠΎΠ². Π—Π΄Π΅ΡΡŒ я расскаТу ΠΎ Ρ‚ΠΎΠΌ, ΠΊΠ°ΠΊ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ Π² ваши Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, ΠΎ супСр-Π·Π°Π±Π°Π²Π½ΠΎΠΌ элСмСнтС Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΈ Π΄Π²ΡƒΡ… Π½ΠΎΠ²Ρ‹Ρ… Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π°Ρ…, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΎΡ‡Π΅Π½ΡŒ ΠΏΠΎΠΌΠΎΠ³ΡƒΡ‚ Π²Π°ΠΌ ΠΏΡ€ΠΈ создании ΠΌΠ°ΠΊΠ΅Ρ‚Π°.Но Ρ…Π²Π°Ρ‚ΠΈΡ‚ Π½Π΅Ρ‡Π΅Ρ‚ΠΊΠΎ сформулированного вступлСния — ΠΏΠΎΠ΅Ρ…Π°Π»ΠΈ!

ΠŸΡ€ΠΈΠΌΠ΅Ρ‡Π°Π½ΠΈΠ΅ : ΡƒΠ±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ Ρ€Π°Π½Π΅Π΅ ΠΏΡ€ΠΎΡ‡ΠΈΡ‚Π°Π»ΠΈ руководство ΠΏΠΎ основам Ρ‚Π°Π±Π»ΠΈΡ†, ΠΈΠ½Π°Ρ‡Π΅ Ρƒ вас Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Π½ΠΈΠΊΠ°ΠΊΠΈΡ… шансов.

Навигация ΠΏΠΎ страницам:
Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ Ρ‚Π°Π±Π»ΠΈΡ†
| Π¦Π²Π΅Ρ‚ Ρ„ΠΎΠ½Π° ΠΈ изобраТСния
| Colspan
| Π³Ρ€Π΅Π±Π΅Π½ΡŒ

Π­Ρ‚Π° страница послСдний Ρ€Π°Π· обновлялась 21.08.2012


Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ Ρ‚Π°Π±Π»ΠΈΡ†

Когда Π²Ρ‹ составляСтС Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ Π΄Π°Π½Π½Ρ‹Ρ…, Ρƒ вас ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠ΄Π½Π° ΠΈΠ»ΠΈ нСсколько ячССк Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° . БущСствуСт Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ Ρ‚ΠΈΠΏ элСмСнта ячСйки, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚Π΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ ячСйка Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½ΠΈΡ€ΡƒΠ΅Ρ‚ ΠΊΠ°ΠΊ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ —

(Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹).Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ это Ρ‚Π°ΠΊ:

< th > Имя th >
< th > Возраст th >

Rufous < / td>

23
Fabio 42

Π­Ρ‚Π° Ρ‚Π°Π±Π»ΠΈΡ†Π° появится, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ справа.Как Π²Ρ‹, вСроятно, Π·Π°ΠΌΠ΅Ρ‚ΠΈΠ»ΠΈ, ячСйки Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ² ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°ΡŽΡ‚ΡΡ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ, Π° ΠΈΡ… тСкст Π²Ρ‹Π΄Π΅Π»Π΅Π½ ΠΆΠΈΡ€Π½Ρ‹ΠΌ ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ Π΄Π°Π΅Ρ‚ ΠΏΠΎΠ½ΡΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ это Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ. Π₯отя это Ρ…ΠΎΡ€ΠΎΡˆΠΎ для доступности, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ внСшний Π²ΠΈΠ΄ Π²Π°ΡˆΠΈΡ… Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ². Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ это с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ простых тСкстовых ΠΊΠΎΠΌΠ°Π½Π΄ CSS.

ΠšΡ€ΠΎΠΌΠ΅ Ρ‚ΠΎΠ³ΠΎ, Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‚Π΅Π³

Ρ‚ΠΎΠ»ΡŒΠΊΠΎ для выдСлСния тСкста ΠΆΠΈΡ€Π½Ρ‹ΠΌ ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠΌ ΠΈΠ»ΠΈ цСнтрирования; это ΠΏΡ€ΠΎΡ‚ΠΈΠ²ΠΎΡ€Π΅Ρ‡ΠΈΡ‚ самой ΠΈΠ΄Π΅Π΅. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ элСмСнт ΠΈ Π²Ρ‹Ρ€ΠΎΠ²Π½ΡΡ‚ΡŒ ячСйку, Ссли Ρ…ΠΎΡ‚ΠΈΡ‚Π΅, Π½ΠΎ -ΠΉ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ для Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ².Π§Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ·Π½Π°Ρ‚ΡŒ большС ΠΎ ΠΏΠΎΠ΄ΠΎΠ±Π½Ρ‹Ρ… ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΠ°Ρ…, ΡƒΠ·Π½Π°ΠΉΡ‚Π΅ большС ΠΎ создании Ρ‚Π°Π±Π»ΠΈΡ† со ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹ΠΌΠΈ возмоТностями.

Π¦Π²Π΅Ρ‚ Ρ„ΠΎΠ½Π° ΠΈ изобраТСния

Π”Π²Π° исходных Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Π°, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹Ρ… для придания Ρ†Π²Π΅Ρ‚Π° Ρ„ΠΎΠ½Π° ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ вашим Ρ‚Π°Π±Π»ΠΈΡ†Π°ΠΌ, Π±ΡƒΠ΄ΡƒΡ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ Π·Π½Π°ΠΊΠΎΠΌΡ‹ΠΌΠΈ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ ΠΎΠ½ΠΈ Ρ‚Π°ΠΊΠΈΠ΅ ΠΆΠ΅, ΠΊΠ°ΠΊ ΠΈ Ρ‚Π΅, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ Π² элСмСнтС body: bgcolor ΠΈ background . Оба ΠΎΠ½ΠΈ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π΅Π½Ρ‹ Π² любом ΠΈΠ· Ρ‚Π΅Π³ΠΎΠ² td , th , tr ΠΈΠ»ΠΈ table , влияя Π½Π° эти ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½Ρ‹Π΅ области.

Π’Π°ΠΊ, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ строку с красным Ρ„ΠΎΠ½ΠΎΠΌ с ΠΎΠ΄Π½ΠΎΠΉ ячСйкой со Π·Π²Π΅Π·Π΄Π½Ρ‹ΠΌ Ρ„ΠΎΠ½ΠΎΠΌ (ΠΊΠ°ΠΊ ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ, Π²Ρ‹Π»ΠΎΠΆΠ΅Π½Π½ΠΎΠΉ ΠΏΠ»ΠΈΡ‚ΠΊΠΎΠΉ), ΠΊΠΎΠ΄ Π±ΡƒΠ΄Π΅Ρ‚:

bgcolor = "# ff0000">

ячСйка 1 background = "stars.gif"> ячСйка 2

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΠΊΠ°Π·Π°Ρ‚ΡŒ Ρ†Π²Π΅Ρ‚Π° Π² Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅ HEX ΠΈΠ»ΠΈ ΠΊΠ°ΠΊ ΠΈΠΌΠ΅Π½ΠΎΠ²Π°Π½Π½Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚.

Однако я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ ΠΏΡ€ΠΎΡˆΠ΅Π΄ΡˆΠ΅Π΅ врСмя ΠΏΠΎΡ‚ΠΎΠΌΡƒ, Ρ‡Ρ‚ΠΎ свойство background являСтся нСстандартным HTML, ΠΈ поэтому ваш ΠΊΠΎΠ΄ Π½Π΅ ΠΏΡ€ΠΎΠΉΠ΄Π΅Ρ‚ Ρ‡Π΅Ρ€Π΅Π· Π²Π°Π»ΠΈΠ΄Π°Ρ‚ΠΎΡ€, Ссли Π²Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚Π΅ этот Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚.Π’ΠΎ-Π²Ρ‚ΠΎΡ€Ρ‹Ρ…, Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ bgcolor устарСл Π² HTML 4.01, поэтому Π²Π°ΠΌ большС Π½Π΅ слСдуСт Π΅Π³ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ.

ИспользованиС CSS для примСнСния Ρ†Π²Π΅Ρ‚ΠΎΠ² Ρ„ΠΎΠ½Π° ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ — Π³ΠΎΡ€Π°Π·Π΄ΠΎ Π»ΡƒΡ‡ΡˆΠΈΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚. НапримСр, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ ΠΆΠ΅Π»Ρ‚Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚ Ρ„ΠΎΠ½Π° ячСйки, Π²Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π½Π°ΠΏΠΈΡΠ°Ρ‚ΡŒ этот ΠΊΠΎΠ΄ CSS:


td {Ρ„ΠΎΠ½: ΠΆΠ΅Π»Ρ‚Ρ‹ΠΉ; }

колспан

ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ это слоТно. Атрибут colspan позволяСт ΠΈΠΌΠ΅Ρ‚ΡŒ ΠΎΠ΄Π½Ρƒ ячСйку, ΠΎΡ…Π²Π°Ρ‚Ρ‹Π²Π°ΡŽΡ‰ΡƒΡŽ нСсколько столбцов Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.Π’ΠΎΡ‚ ΠΈΠ»Π»ΡŽΡΡ‚Ρ€Π°Ρ†ΠΈΡ:

Π§ΡƒΠ²Π°ΠΊ, я такая ΡˆΠΈΡ€ΠΎΠΊΠ°Ρ!
Π‘Π»ΠΈΠ½. ΠœΡ‹ Π±Ρ‹Π»ΠΈ НС

Π’ΠΈΠ΄ΠΈΡ‚Π΅, Ρƒ нас Π΅ΡΡ‚ΡŒ ΠΎΠ΄Π½Π° ячСйка, идущая Π²Π²Π΅Ρ€Ρ…Ρƒ, ΠΎΡ…Π²Π°Ρ‚Ρ‹Π²Π°ΡŽΡ‰Π°Ρ 3 столбца, Π° Ρ‚Ρ€ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ ячСйки находятся ΠΏΠΎΠ΄ Π½Π΅ΠΉ Π² Ρ‚ΠΎΠΌ ΠΆΠ΅ пространствС. Π’ΠΎΡ‚ ΠΊΠΎΠ΄, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Π°ΠΌ слСдуСт ΠΈΠ·ΡƒΡ‡ΠΈΡ‚ΡŒ:

colspan = "3"> Π§ΡƒΠ²Π°ΠΊ, я Ρ‚Π°ΠΊΠΎΠΉ ΡˆΠΈΡ€ΠΎΠΊΠΈΠΉ!
Π‘Π»ΠΈΠ½. ΠœΡ‹ Π½Π΅

Π― ΠΏΠΎΡ…ΡƒΠ΄Π΅Π»Π°? Π₯ΠΌΠΌ
ΠœΡ‹ Π±Ρ‹Π»ΠΈ всС Π΅Ρ‰Π΅ здСсь

Π₯ΠΎΡ€ΠΎΡˆΠΎ, посмотритС Π² ΠΏΠ΅Ρ€Π²ΡƒΡŽ ячСйку — Π² Π½Π΅ΠΉ colspan = "3" , ΠΈ поэтому ΠΎΠ½Π° ΠΎΡ…Π²Π°Ρ‚Ρ‹Π²Π°Π΅Ρ‚ Ρ‚Ρ€ΠΈ столбца ΠΏΠΎΠ΄ Π½Π΅ΠΉ. Π― ΠΌΠΎΠ³ Π±Ρ‹ ΠΎΡ…Π²Π°Ρ‚ΠΈΡ‚ΡŒ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π΄Π²Π° столбца ΠΈ ΠΈΠΌΠ΅Ρ‚ΡŒ Π΅Ρ‰Π΅ ΠΎΠ΄Π½Ρƒ ячСйку Π²Π²Π΅Ρ€Ρ…Ρƒ, Ссли Π±Ρ‹ я этого Ρ…ΠΎΡ‚Π΅Π». Π­Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ Ρ‚Π°ΠΊ:

colspan = "2"> Π― ΠΏΠΎΡ…ΡƒΠ΄Π΅Π»? Π₯ΠΌ
ΠœΡ‹. всС Π΅Ρ‰Π΅ здСсь

sourcetip: Π”ΠΎΡΡ‚Π°Π½ΡŒΡ‚Π΅ старый ΠΊΠ°Ρ€Π°Π½Π΄Π°Ρˆ ΠΈ Π±ΡƒΠΌΠ°Π³Ρƒ ΠΈ нарисуйтС ΠΌΠ°ΠΊΠ΅Ρ‚ стола. Π­Ρ‚ΠΎ Π·Π½Π°Ρ‡ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ упростит ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Ρ‚ΠΎΠ³ΠΎ, Π³Π΄Π΅ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒΡΡ эти Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Ρ‹.

ΠΏΡ€ΠΎΠ»Π΅Ρ‚ ΠΌΠ΅ΠΆΠ΄Ρƒ рядами

Π”Π°, это Π² основном Ρ‚ΠΎ ΠΆΠ΅ самоС, Π·Π° ΠΈΡΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅ΠΌ строк. ΠŸΡ€ΠΈΠ²Π΅Π΄Ρƒ Π΅Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ простой ΠΏΡ€ΠΈΠΌΠ΅Ρ€:

Π£ΠΌΠΌ …
Ага.
Π²Π²Π΅Ρ€Ρ…Ρƒ справа
Π²Π½ΠΈΠ·Ρƒ справа

И ΠΊΠΎΠ΄ выглядит ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π½ΠΎ Ρ‚Π°ΠΊ.Π”Π΅Ρ€ΠΆΠ°Ρ‚ΡŒ Π³Π»Π°Π·Π° ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚Ρ‹ΠΌΠΈ; этот Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ сбиваСт с Ρ‚ΠΎΠ»ΠΊΡƒ:

rowspan = "2"> Ммм ...
Π΄Π°.
Π²Π²Π΅Ρ€Ρ…Ρƒ справа
Π²Π½ΠΈΠ·Ρƒ справа

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π²Π½ΠΈΠΌΠ°Ρ‚Π΅Π»ΡŒΠ½ΠΎ ΠΏΡ€ΠΎΡ‡Ρ‚ΠΈΡ‚Π΅ это — вставляСтся пСрвая строка, Π·Π°Ρ‚Π΅ΠΌ пСрвая ячСйка Π·Π°Π½ΠΈΠΌΠ°Π΅Ρ‚ ΠΊΠ°ΠΊ свою ΡΠΎΠ±ΡΡ‚Π²Π΅Π½Π½ΡƒΡŽ ΠΏΠΎΠ·ΠΈΡ†ΠΈΡŽ, Ρ‚Π°ΠΊ ΠΈ ΠΏΠΎΠ·ΠΈΡ†ΠΈΡŽ ячСйки, которая Π±Ρ‹Π»Π° Π±Ρ‹ ΠΏΠΎΠ΄ Π½Π΅ΠΉ.Π—Π°Ρ‚Π΅ΠΌ вторая ячСйка помСщаСтся ΠΏΠΎ-ΠΏΡ€Π΅ΠΆΠ½Π΅ΠΌΡƒ Π² Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ ряд. Π—Π°Ρ‚Π΅ΠΌ, ΠΈ Π²ΠΎΡ‚ научная Ρ‡Π°ΡΡ‚ΡŒ, начинаСтся вторая строка ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΎΠ΄Π½Π° ячСйка.

sourcetip: Если это Π²Ρ‹Π·Ρ‹Π²Π°Π΅Ρ‚ Ρƒ вас ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡ‹ (Π½Π΅ стыдно), ΠΊΡƒΠΏΠΈΡ‚Π΅ сСбС копию Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎΠ³ΠΎ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€Π°, Ρ‚Π°ΠΊΠΎΠ³ΠΎ ΠΊΠ°ΠΊ DreamWeaver. ΠžΡ‚Π»ΠΈΡ‡Π½ΠΎ ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΈΡ‚ для изготовлСния столов.

И colspan , ΠΈ rowspan ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ вмСстС Π² ΠΎΠ΄Π½ΠΎΠΉ Ρ‚Π°Π±Π»ΠΈΡ†Π΅, Ссли Π²Ρ‹ Π΄Π΅ΠΉΡΡ‚Π²ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Π»ΡŽΠ±ΠΈΡ‚Π΅ ΠΏΡ€ΠΈΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΡ. ΠŸΡ€ΠΎΡΡ‚ΠΎ Π±ΡƒΠ΄ΡŒ остороТСн, Ρ…ΠΎΡ€ΠΎΡˆΠΎ? Часто Π²Ρ‹ ΠΎΠ±Π½Π°Ρ€ΡƒΠΆΠΈΠ²Π°Π΅Ρ‚Π΅, Ρ‡Ρ‚ΠΎ ΠΊΠΎΠ΄ΠΈΡ€ΡƒΠ΅Ρ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, которая Π½Π°ΠΌΠ½ΠΎΠ³ΠΎ слоТнСС, Ρ‡Π΅ΠΌ ΠΎΠ½Π° Π΄ΠΎΠ»ΠΆΠ½Π° Π±Ρ‹Ρ‚ΡŒ.

Ρ‚Π°Π±Π»ΠΈΡ† Β· Bootstrap

ДокумСнтация ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹ для Π²Ρ‹Π±ΠΎΡ€Π° стиля Ρ‚Π°Π±Π»ΠΈΡ† (учитывая ΠΈΡ… ΠΏΡ€Π΅ΠΎΠ±Π»Π°Π΄Π°ΡŽΡ‰Π΅Π΅ использованиС Π² ΠΏΠ»Π°Π³ΠΈΠ½Π°Ρ… JavaScript) с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Bootstrap.

ΠŸΡ€ΠΈΠΌΠ΅Ρ€Ρ‹

Π’ связи с ΡˆΠΈΡ€ΠΎΠΊΠΈΠΌ использованиСм Ρ‚Π°Π±Π»ΠΈΡ† Π² сторонних Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π°Ρ…, Ρ‚Π°ΠΊΠΈΡ… ΠΊΠ°ΠΊ ΠΊΠ°Π»Π΅Π½Π΄Π°Ρ€ΠΈ ΠΈ срСдства Π²Ρ‹Π±ΠΎΡ€Π° Π΄Π°Ρ‚Ρ‹, ΠΌΡ‹ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Π»ΠΈ наши Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ΠΈ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Π»ΠΈ ΠΈ . ΠŸΡ€ΠΎΡΡ‚ΠΎ Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π±Π°Π·ΠΎΠ²Ρ‹ΠΉ класс .table ΠΊ Π»ΡŽΠ±ΠΎΠΌΡƒ

, Π° Π·Π°Ρ‚Π΅ΠΌ Ρ€Π°ΡΡˆΠΈΡ€ΡŒΡ‚Π΅ Π΅Π³ΠΎ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΡ… стилСй ΠΈΠ»ΠΈ Π½Π°ΡˆΠΈΡ… Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Ρ… Π²ΠΊΠ»ΡŽΡ‡Π΅Π½Π½Ρ‹Ρ… классов ΠΌΠΎΠ΄ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€ΠΎΠ².

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΡΠ°ΠΌΡƒΡŽ ΠΏΡ€ΠΎΡΡ‚ΡƒΡŽ Ρ€Π°Π·ΠΌΠ΅Ρ‚ΠΊΡƒ Ρ‚Π°Π±Π»ΠΈΡ†, Π²ΠΎΡ‚ ΠΊΠ°ΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π½Π° основС .table выглядят Π² Bootstrap. ВсС стили Ρ‚Π°Π±Π»ΠΈΡ† Π½Π°ΡΠ»Π΅Π΄ΡƒΡŽΡ‚ΡΡ Π² Bootstrap 4 , Ρ‡Ρ‚ΠΎ ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ всС Π²Π»ΠΎΠΆΠ΅Π½Π½Ρ‹Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π±ΡƒΠ΄ΡƒΡ‚ стилизованы Ρ‚Π°ΠΊ ΠΆΠ΅, ΠΊΠ°ΠΊ ΠΈ Ρ€ΠΎΠ΄ΠΈΡ‚Π΅Π»ΡŒΡΠΊΠΈΠ΅.

# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 Π›Π°Ρ€Ρ€ΠΈ ΠŸΡ‚ΠΈΡ†Π° @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
# ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ ПослСдний ДСскриптор
1 ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ ΠžΡ‚Ρ‚ΠΎ @mdo
2 Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @fat
3 Π›Π°Ρ€Ρ€ΠΈ ΠŸΡ‚ΠΈΡ†Π° @twitter

Π’Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΠ½Π²Π΅Ρ€Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ†Π²Π΅Ρ‚Π° — со свСтлым тСкстом Π½Π° Ρ‚Π΅ΠΌΠ½ΠΎΠΌ Ρ„ΠΎΠ½Π΅ — с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ .стол-Ρ‚Ρ‘ΠΌΠ½Ρ‹ΠΉ .

# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 Π›Π°Ρ€Ρ€ΠΈ ΠŸΡ‚ΠΈΡ†Π° @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       Π›Π°Ρ€Ρ€ΠΈ 
       ΠŸΡ‚ΠΈΡ†Π° 
       @twitter 
    
  
  

Π’Π°Ρ€ΠΈΠ°Π½Ρ‚Ρ‹ Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ стола

Подобно Ρ‚Π°Π±Π»ΠΈΡ†Π°ΠΌ ΠΈ Ρ‚Π΅ΠΌΠ½Ρ‹ΠΌ Ρ‚Π°Π±Π»ΠΈΡ†Π°ΠΌ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ классы ΠΌΠΎΠ΄ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€ΠΎΠ² .thead-light ΠΈΠ»ΠΈ .thead-dark , Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Ρ‹

казались свСтлыми ΠΈΠ»ΠΈ Ρ‚Π΅ΠΌΠ½ΠΎ-сСрыми.

# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 Π›Π°Ρ€Ρ€ΠΈ ΠŸΡ‚ΠΈΡ†Π° @twitter
# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 Π›Π°Ρ€Ρ€ΠΈ ΠŸΡ‚ΠΈΡ†Π° @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       Π›Π°Ρ€Ρ€ΠΈ 
       ΠŸΡ‚ΠΈΡ†Π° 
       @twitter 
    
  


<Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       Π›Π°Ρ€Ρ€ΠΈ 
       ΠŸΡ‚ΠΈΡ†Π° 
       @twitter 
    
  
  

ΠŸΠΎΠ»ΠΎΡΠ°Ρ‚Ρ‹Π΅ ряды

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ .table-striped , Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΏΠΎΠ»ΠΎΡΠ°Ρ‚ΡƒΡŽ полосу ΠΊ любой строкС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π² ΠΏΡ€Π΅Π΄Π΅Π»Π°Ρ…

.

# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 Π›Π°Ρ€Ρ€ΠΈ ΠŸΡ‚ΠΈΡ†Π° @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       Π›Π°Ρ€Ρ€ΠΈ 
       ΠŸΡ‚ΠΈΡ†Π° 
       @twitter 
    
  
  
# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 Π›Π°Ρ€Ρ€ΠΈ ΠŸΡ‚ΠΈΡ†Π° @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       Π›Π°Ρ€Ρ€ΠΈ 
       ΠŸΡ‚ΠΈΡ†Π° 
       @twitter 
    
  
  

Π‘Ρ‚ΠΎΠ» с полями

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ . с Π³Ρ€Π°Π½ΠΈΡ†Π°ΠΌΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ для Π³Ρ€Π°Π½ΠΈΡ† со всСх сторон Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈ ячССк.

# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ 
       @twitter 
    
  
  
# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ 
       @twitter 
    
  
  

Π‘Ρ‚ΠΎΠ» Π±Π΅Π· ΠΏΠΎΠ»Π΅ΠΉ

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ .стол Π±Π΅Π· Ρ€Π°ΠΌΠΎΠΊ для стола Π±Π΅Π· Ρ€Π°ΠΌΠΎΠΊ.

# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ 
       @twitter 
    
  
  

.table-borderless ΠΌΠΎΠΆΠ½ΠΎ Ρ‚Π°ΠΊΠΆΠ΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π½Π° Ρ‚Π΅ΠΌΠ½Ρ‹Ρ… столах.

# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ 
       @twitter 
    
  
  

ΠŸΠΎΠ΄ΡŠΠ΅ΠΌΠ½Ρ‹Π΅ ряды

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ .table-hover , Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ состояниС навСдСния Π½Π° строки Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π² ΠΏΡ€Π΅Π΄Π΅Π»Π°Ρ…

.

# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ 
       @twitter 
    
  
  
# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ 
       @twitter 
    
  
  

МалСнький стол

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ .table-sm , Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ столы Π±ΠΎΠ»Π΅Π΅ ΠΊΠΎΠΌΠΏΠ°ΠΊΡ‚Π½Ρ‹ΠΌΠΈ, разрСзая Π·Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ячССк ΠΏΠΎΠΏΠΎΠ»Π°ΠΌ.

# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ 
       @twitter 
    
  
  
# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       ΠŸΡ‚ΠΈΡ†Π° Π›Π°Ρ€Ρ€ΠΈ 
       @twitter 
    
  
  

ΠšΠΎΠ½Ρ‚Π΅ΠΊΡΡ‚Π½Ρ‹Π΅ классы

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ контСкстныС классы для Ρ€Π°ΡΠΊΡ€Π°ΡˆΠΈΠ²Π°Π½ΠΈΡ строк Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈΠ»ΠΈ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹Ρ… ячССк.

Класс Воварная позиция Воварная позиция
Активный Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
ΠŸΠ΅Ρ€Π²ΠΈΡ‡Π½Ρ‹ΠΉ Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
Вторичная Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
УспСх Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
ΠžΠΏΠ°ΡΠ½ΠΎΡΡ‚ΡŒ Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
ΠŸΡ€Π΅Π΄ΡƒΠΏΡ€Π΅ΠΆΠ΄Π΅Π½ΠΈΠ΅ Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
Π˜Π½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡ Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
Π‘Π²Π΅Ρ‚ Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
Π’Π΅ΠΌΠ½Ρ‹ΠΉ Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
  
... 

 ... 
 ... 
 ... 
 ... 
 ... 
 ... 
 ... 
 ... 



   ... 
  
   ... 
   ... 
   ... 
   ... 
   ... 
   ... 
   ... 
   ... 
  

ΠžΠ±Ρ‹Ρ‡Π½Ρ‹Π΅ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Ρ‹ Ρ„ΠΎΠ½Π° Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ нСдоступны для Ρ‚Π΅ΠΌΠ½ΠΎΠΉ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, ΠΎΠ΄Π½Π°ΠΊΠΎ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ тСкстовыС ΠΈΠ»ΠΈ Ρ„ΠΎΠ½ΠΎΠ²Ρ‹Π΅ ΡƒΡ‚ΠΈΠ»ΠΈΡ‚Ρ‹ для достиТСния Π°Π½Π°Π»ΠΎΠ³ΠΈΡ‡Π½Ρ‹Ρ… стилСй.

# Воварная позиция Воварная позиция
1 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
2 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
3 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
4 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
5 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
6 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
7 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
8 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
9 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
  
... 
 ... 
 ... 
 ... 
 ... 



   ... 
   ... 
   ... 
   ... 
   ... 
  
ΠŸΠ΅Ρ€Π΅Π΄Π°Ρ‡Π° смысла Π²ΡΠΏΠΎΠΌΠΎΠ³Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΌ тСхнологиям

ИспользованиС Ρ†Π²Π΅Ρ‚Π° для добавлСния смысла обСспСчиваСт Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΡƒΡŽ ΠΈΠ½Π΄ΠΈΠΊΠ°Ρ†ΠΈΡŽ, которая Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΠ΅Ρ€Π΅Π΄Π°Π½Π° ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡΠΌ Π²ΡΠΏΠΎΠΌΠΎΠ³Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… Ρ‚Π΅Ρ…Π½ΠΎΠ»ΠΎΠ³ΠΈΠΉ, Ρ‚Π°ΠΊΠΈΡ… ΠΊΠ°ΠΊ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹ чтСния с экрана.Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ информация, обозначСнная Ρ†Π²Π΅Ρ‚ΠΎΠΌ, Π»ΠΈΠ±ΠΎ ΠΎΡ‡Π΅Π²ΠΈΠ΄Π½Π° ΠΈΠ· самого содСрТимого (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Π²ΠΈΠ΄ΠΈΠΌΡ‹ΠΉ тСкст), Π»ΠΈΠ±ΠΎ Π²ΠΊΠ»ΡŽΡ‡Π΅Π½Π° с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π°Π»ΡŒΡ‚Π΅Ρ€Π½Π°Ρ‚ΠΈΠ²Π½Ρ‹Ρ… срСдств, Ρ‚Π°ΠΊΠΈΡ… ΠΊΠ°ΠΊ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ тСкст, скрытый с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ класса .sr-only .

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½Ρ‹Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, ΠΎΠ±Π΅Ρ€Π½ΡƒΠ² Π»ΡŽΠ±ΡƒΡŽ .table с .table-responsive {-sm | -md | -lg | -xl} , заставляя Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‡ΠΈΠ²Π°Ρ‚ΡŒΡΡ ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ Π½Π° ΠΊΠ°ΠΆΠ΄ΠΎΠΉ максимальной ΡˆΠΈΡ€ΠΈΠ½Π΅ Ρ‚ΠΎΡ‡ΠΊΠΈ останова Π΄ΠΎ (Π½ΠΎ Π½Π΅ Π²ΠΊΠ»ΡŽΡ‡Π°Ρ) 576 пиксСлСй, 768 пиксСлСй, 992 пиксСлСй ΠΈ 1120 пиксСлСй соотвСтствСнно.

ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅, Ρ‡Ρ‚ΠΎ, ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Ρ‹ Π² настоящСС врСмя Π½Π΅ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‚ запросы контСкста Π΄ΠΈΠ°ΠΏΠ°Π·ΠΎΠ½Π°, ΠΌΡ‹ ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌ ограничСния прСфиксов min- ΠΈ max- ΠΈ области просмотра с Π΄Ρ€ΠΎΠ±Π½ΠΎΠΉ ΡˆΠΈΡ€ΠΈΠ½ΠΎΠΉ (Ρ‡Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΡ€ΠΎΠΈΡΡ…ΠΎΠ΄ΠΈΡ‚ΡŒ ΠΏΡ€ΠΈ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Ρ… условиях, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Π½Π° устройствах с высоким Ρ€Π°Π·Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ΠΌ) Π·Π° счСт использования Π·Π½Π°Ρ‡Π΅Π½ΠΈΠΉ с Π±ΠΎΠ»Π΅Π΅ высокой Ρ‚ΠΎΡ‡Π½ΠΎΡΡ‚ΡŒΡŽ для этих сравнСний.

Подписи

Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ ΠΊΠ°ΠΊ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹. Π­Ρ‚ΠΎ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ‚ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡΠΌ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌ чтСния с экрана Π½Π°ΠΉΡ‚ΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, ΠΏΠΎΠ½ΡΡ‚ΡŒ, ΠΎ Ρ‡Π΅ΠΌ ΠΎΠ½Π°, ΠΈ Ρ€Π΅ΡˆΠΈΡ‚ΡŒ, хотят Π»ΠΈ ΠΎΠ½ΠΈ Π΅Π΅ ΠΏΡ€ΠΎΡ‡ΠΈΡ‚Π°Ρ‚ΡŒ.

Бписок ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Π΅ΠΉ
# ΠŸΠ΅Ρ€Π²Π°Ρ ПослСдняя Π ΡƒΡ‡ΠΊΠ°
1 ΠœΠ°Ρ€ΠΊΠ° ΠžΡ‚Ρ‚ΠΎ @mdo
2 Иаков Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ @ ΠΆΠΈΡ€
3 Π›Π°Ρ€Ρ€ΠΈ ΠŸΡ‚ΠΈΡ†Π° @twitter
  <Ρ‚Π°Π±Π»ΠΈΡ†Π°>
   Бписок ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Π΅ΠΉ 
  
    
       # 
       ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ 
       ПослСдний 
       ДСскриптор 
    
  
  
    
       1 
       ΠžΡ‚ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ 
       ΠžΡ‚Ρ‚ΠΎ 
       @mdo 
    
    
       2 
       Π”ΠΆΠ΅ΠΉΠΊΠΎΠ± 
       Π’ΠΎΡ€Π½Ρ‚ΠΎΠ½ 
       @fat 
    
    
       3 
       Π›Π°Ρ€Ρ€ΠΈ 
       ΠŸΡ‚ΠΈΡ†Π° 
       @twitter 
    
  
  

АдаптивныС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹

АдаптивныС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡŽΡ‚ Π»Π΅Π³ΠΊΠΎ ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‡ΠΈΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ.Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ Π»ΡŽΠ±ΡƒΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ ΠΎΡ‚Π·Ρ‹Π²Ρ‡ΠΈΠ²ΠΎΠΉ Π²ΠΎ всСх ΠΎΠΊΠ½Π°Ρ… просмотра, ΠΎΠ±Π΅Ρ€Π½ΡƒΠ² .table с .table-responsive . Или Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΌΠ°ΠΊΡΠΈΠΌΠ°Π»ΡŒΠ½ΡƒΡŽ Ρ‚ΠΎΡ‡ΠΊΡƒ останова, Π΄ΠΎ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π΅Π°Π³ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Π°, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ .table-responsive {-sm | -md | -lg | -xl} .

Π’Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Π°Ρ ΠΎΠ±Ρ€Π΅Π·ΠΊΠ° / усСчСниС

АдаптивныС Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ overflow-y: hidden , ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ отсСкаСт любоС содСрТимоС, выходящСС Π·Π° ΠΏΡ€Π΅Π΄Π΅Π»Ρ‹ Π½ΠΈΠΆΠ½Π΅Π³ΠΎ ΠΈΠ»ΠΈ Π²Π΅Ρ€Ρ…Π½Π΅Π³ΠΎ края Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹. Π’ частности, это ΠΌΠΎΠΆΠ΅Ρ‚ Π²Ρ‹Ρ€Π΅Π·Π°Ρ‚ΡŒ Ρ€Π°ΡΠΊΡ€Ρ‹Π²Π°ΡŽΡ‰ΠΈΠ΅ΡΡ мСню ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ сторонниС Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹.

ВсСгда ΠΎΡ‚Π·Ρ‹Π²Ρ‡ΠΈΠ²Ρ‹ΠΉ

Для ΠΊΠ°ΠΆΠ΄ΠΎΠΉ Ρ‚ΠΎΡ‡ΠΊΠΈ останова ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ .table-responsive для Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΠΎΠΉ ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‚ΠΊΠΈ Ρ‚Π°Π±Π»ΠΈΡ†.

# Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция
1 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
2 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
3 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
  
<Ρ‚Π°Π±Π»ΠΈΡ†Π°> ...

Зависит ΠΎΡ‚ Ρ‚ΠΎΡ‡ΠΊΠΈ останова

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ .table-responsive {-sm | -md | -lg | -xl} ΠΏΠΎ ΠΌΠ΅Ρ€Π΅ нСобходимости, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½Ρ‹Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π΄ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ Ρ‚ΠΎΡ‡ΠΊΠΈ останова. Π‘ этой Ρ‚ΠΎΡ‡ΠΊΠΈ останова ΠΈ Π²Ρ‹ΡˆΠ΅ Ρ‚Π°Π±Π»ΠΈΡ†Π° Π±ΡƒΠ΄Π΅Ρ‚ вСсти сСбя Π½ΠΎΡ€ΠΌΠ°Π»ΡŒΠ½ΠΎ ΠΈ Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΡ€ΠΎΠΊΡ€ΡƒΡ‡ΠΈΠ²Π°Ρ‚ΡŒΡΡ ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ.

Π­Ρ‚ΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ ΠΌΠΎΠ³ΡƒΡ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ Π½Π΅Ρ€Π°Π±ΠΎΡ‚Π°ΡŽΡ‰ΠΈΠΌΠΈ Π΄ΠΎ Ρ‚Π΅Ρ… ΠΏΠΎΡ€, ΠΏΠΎΠΊΠ° ΠΈΡ… Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½Ρ‹Π΅ стили Π½Π΅ Π±ΡƒΠ΄ΡƒΡ‚ ΠΏΡ€ΠΈΠΌΠ΅Π½ΡΡ‚ΡŒΡΡ ΠΏΡ€ΠΈ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΉ ΡˆΠΈΡ€ΠΈΠ½Π΅ области просмотра.

# Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция
1 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
2 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
3 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
  
<Ρ‚Π°Π±Π»ΠΈΡ†Π°> ...
# Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция
1 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
2 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
3 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
  
<Ρ‚Π°Π±Π»ΠΈΡ†Π°> ...
# Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция
1 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
2 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
3 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
  
<Ρ‚Π°Π±Π»ΠΈΡ†Π°> ...
# Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция Воварная позиция
1 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
2 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
3 Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ° Π―Ρ‡Π΅ΠΉΠΊΠ°
  
<Ρ‚Π°Π±Π»ΠΈΡ†Π°> ...

Π Π°ΡΡˆΠΈΡ€Π΅Π½Π½Ρ‹ΠΉ синтаксис | Руководство ΠΏΠΎ ΡƒΡ†Π΅Π½ΠΊΠ΅

ΠžΠ±Π·ΠΎΡ€

Π‘Π°Π·ΠΎΠ²Ρ‹ΠΉ синтаксис, описанный Π² исходном ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π½ΠΎΠΌ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π΅ Π”ΠΆΠΎΠ½Π° Π“Ρ€ΡƒΠ±Π΅Ρ€Π°, Π΄ΠΎΠ±Π°Π²ΠΈΠ» ΠΌΠ½ΠΎΠ³ΠΈΠ΅ элСмСнты, Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡ‹Π΅ для повсСднСвной Ρ€Π°Π±ΠΎΡ‚Ρ‹, Π½ΠΎ для Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… людСй этого Π±Ρ‹Π»ΠΎ нСдостаточно. Π’ΠΎΡ‚ Ρ‚ΡƒΡ‚ ΠΈ пригодится Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½Π½Ρ‹ΠΉ синтаксис.

НСсколько частных Π»ΠΈΡ† ΠΈ ΠΎΡ€Π³Π°Π½ΠΈΠ·Π°Ρ†ΠΈΠΉ взяли Π½Π° сСбя Π·Π°Π΄Π°Ρ‡Ρƒ Ρ€Π°ΡΡˆΠΈΡ€ΠΈΡ‚ΡŒ Π±Π°Π·ΠΎΠ²Ρ‹ΠΉ синтаксис, Π΄ΠΎΠ±Π°Π²ΠΈΠ² Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ элСмСнты, Ρ‚Π°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Π±Π»ΠΎΠΊΠΈ ΠΊΠΎΠ΄Π°, Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ синтаксиса, автоматичСскоС связываниС URL-адрСсов ΠΈ сноски.Π­Ρ‚ΠΈ элСмСнты ΠΌΠΎΠΆΠ½ΠΎ Π²ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΠΎΠ±Π»Π΅Π³Ρ‡Π΅Π½Π½ΠΎΠ³ΠΎ языка Ρ€Π°Π·ΠΌΠ΅Ρ‚ΠΊΠΈ, основанного Π½Π° Π±Π°Π·ΠΎΠ²ΠΎΠΌ синтаксисС Markdown, ΠΈΠ»ΠΈ ΠΏΡƒΡ‚Π΅ΠΌ добавлСния Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΡ ΠΊ совмСстимому процСссору Markdown.

НаличиС

НС всС прилоТСния Markdown ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‚ элСмСнты Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½Π½ΠΎΠ³ΠΎ синтаксиса. Π’Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΈΡ‚ΡŒ, ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Π΅Ρ‚ Π»ΠΈ ΠΎΠ±Π»Π΅Π³Ρ‡Π΅Π½Π½Ρ‹ΠΉ язык Ρ€Π°Π·ΠΌΠ΅Ρ‚ΠΊΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ вашС ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅, элСмСнты Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½Π½ΠΎΠ³ΠΎ синтаксиса, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ. Если этого Π½Π΅ ΠΏΡ€ΠΎΠΈΠ·ΠΎΠΉΠ΄Π΅Ρ‚, Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, всС Π΅Ρ‰Π΅ ΠΌΠΎΠΆΠ½ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ Π²ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΡ Π² вашСм процСссорС Markdown.

Π›Π΅Π³ΠΊΠΈΠ΅ языки Ρ€Π°Π·ΠΌΠ΅Ρ‚ΠΊΠΈ

БущСствуСт нСсколько ΠΎΠ±Π»Π΅Π³Ρ‡Π΅Π½Π½Ρ‹Ρ… языков Ρ€Π°Π·ΠΌΠ΅Ρ‚ΠΊΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΡΠ²Π»ΡΡŽΡ‚ΡΡ надмноТСствами Markdown. Они Π²ΠΊΠ»ΡŽΡ‡Π°ΡŽΡ‚ Π±Π°Π·ΠΎΠ²Ρ‹ΠΉ синтаксис Π“Ρ€ΡƒΠ±Π΅Ρ€Π° ΠΈ ΠΎΡΠ½ΠΎΠ²Ρ‹Π²Π°ΡŽΡ‚ΡΡ Π½Π° Π½Π΅ΠΌ, добавляя Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ элСмСнты, Ρ‚Π°ΠΊΠΈΠ΅ ΠΊΠ°ΠΊ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Π±Π»ΠΎΠΊΠΈ ΠΊΠΎΠ΄Π°, Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ синтаксиса, автоматичСскоС связываниС URL-адрСсов ΠΈ сноски. МногиС ΠΈΠ· самых популярных ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ Markdown ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΡ… ΠΎΠ±Π»Π΅Π³Ρ‡Π΅Π½Π½Ρ‹Ρ… языков Ρ€Π°Π·ΠΌΠ΅Ρ‚ΠΊΠΈ:

ΠŸΡ€ΠΎΡ†Π΅ΡΡΠΎΡ€Ρ‹ Markdown

Доступны дСсятки процСссоров Markdown.МногиС ΠΈΠ· Π½ΠΈΡ… ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡŽΡ‚ Π΄ΠΎΠ±Π°Π²Π»ΡΡ‚ΡŒ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΡ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²ΠΊΠ»ΡŽΡ‡Π°ΡŽΡ‚ Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½Π½Ρ‹Π΅ элСмСнты синтаксиса. Π”ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΡƒΡŽ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ см. Π’ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°Ρ†ΠΈΠΈ ΠΊ Π²Π°ΡˆΠ΅ΠΌΡƒ процСссору.

Π‘Ρ‚ΠΎΠ»Ρ‹

Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‚Ρ€ΠΈ ΠΈΠ»ΠΈ Π±ΠΎΠ»Π΅Π΅ дСфиса ( --- ) для создания Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ столбца ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΊΠ°Π½Π°Π»Ρ‹ ( | ) для раздСлСния ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ столбца. Для совмСстимости Π²Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ‚Ρ€ΡƒΠ±Ρƒ Π½Π° ΠΎΠ±ΠΎΠΈΡ… ΠΊΠΎΠ½Ρ†Π°Ρ… ряда.

  | Бинтаксис | ОписаниС |
| ----------- | ----------- |
| Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ | НазваниС |
| Абзац | ВСкст |
  

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

Бинтаксис ОписаниС
Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ НазваниС
ΠŸΡƒΠ½ΠΊΡ‚ ВСкст

Π¨ΠΈΡ€ΠΈΠ½Π° ячССк ΠΌΠΎΠΆΠ΅Ρ‚ Π²Π°Ρ€ΡŒΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π½ΠΈΠΆΠ΅.Π’ΠΈΠ·ΡƒΠ°Π»ΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Π±ΡƒΠ΄Π΅Ρ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ Ρ‚Π°ΠΊ ΠΆΠ΅.

  | Бинтаксис | ОписаниС |
| --- | ----------- |
| Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ | НазваниС |
| Абзац | ВСкст |
  

Π‘ΠΎΠ²Π΅Ρ‚: Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ Ρ‚Π°Π±Π»ΠΈΡ† с дСфисами ΠΈ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΌΠΈ линиями ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ ΡƒΡ‚ΠΎΠΌΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΌ. Π§Ρ‚ΠΎΠ±Ρ‹ ΡƒΡΠΊΠΎΡ€ΠΈΡ‚ΡŒ процСсс, ΠΏΠΎΠΏΡ€ΠΎΠ±ΡƒΠΉΡ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π³Π΅Π½Π΅Ρ€Π°Ρ‚ΠΎΡ€ Ρ‚Π°Π±Π»ΠΈΡ† ΡƒΡ†Π΅Π½ΠΊΠΈ. Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρƒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ графичСского интСрфСйса, Π° Π·Π°Ρ‚Π΅ΠΌ скопируйтС сгСнСрированный тСкст Π² Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅ Markdown Π² свой Ρ„Π°ΠΉΠ».

Π’Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Ρ‹Ρ€ΠΎΠ²Π½ΡΡ‚ΡŒ тСкст Π² столбцах слСва, справа ΠΈΠ»ΠΈ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ, Π΄ΠΎΠ±Π°Π²ΠΈΠ² Π΄Π²ΠΎΠ΅Ρ‚ΠΎΡ‡ΠΈΠ΅ (: ) слСва, справа ΠΈΠ»ΠΈ с ΠΎΠ±Π΅ΠΈΡ… сторон ΠΎΡ‚ дСфисов Π² строкС Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°.

  | Бинтаксис | ОписаниС | ВСстовый тСкст |
| : --- | : ----: | ---: |
| Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ | НазваниС | Π’ΠΎΡ‚ это |
| Абзац | ВСкст | И ΠΌΠ½ΠΎΠ³ΠΎΠ΅ Π΄Ρ€ΡƒΠ³ΠΎΠ΅ |
  

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

Бинтаксис ОписаниС ВСкст тСста
Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ НазваниС Π’ΠΎΡ‚ это
ΠŸΡƒΠ½ΠΊΡ‚ ВСкст И Π±ΠΎΠ»Π΅Π΅

Π€ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ тСкста Π² Ρ‚Π°Π±Π»ΠΈΡ†Π°Ρ…

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ тСкст Π² Ρ‚Π°Π±Π»ΠΈΡ†Π°Ρ….НапримСр, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ссылки, ΠΊΠΎΠ΄ (Ρ‚ΠΎΠ»ΡŒΠΊΠΎ слова ΠΈΠ»ΠΈ Ρ„Ρ€Π°Π·Ρ‹ Π² ΠΎΠ±Ρ€Π°Ρ‚Π½Ρ‹Ρ… ΠΊΠ°Π²Ρ‹Ρ‡ΠΊΠ°Ρ… ( `), Π° Π½Π΅ Π±Π»ΠΎΠΊΠΈ ΠΊΠΎΠ΄Π°) ΠΈ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅.

НСльзя Π΄ΠΎΠ±Π°Π²Π»ΡΡ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ, Ρ†ΠΈΡ‚Π°Ρ‚Ρ‹, списки, Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π»ΠΈΠ½ΠΈΠΈ, изобраТСния ΠΈΠ»ΠΈ HTML-Ρ‚Π΅Π³ΠΈ.

Π­ΠΊΡ€Π°Π½ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ символов Ρ‚Ρ€ΡƒΠ±Ρ‹ Π² Ρ‚Π°Π±Π»ΠΈΡ†Π°Ρ…

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΎΡ‚ΠΎΠ±Ρ€Π°Π·ΠΈΡ‚ΡŒ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ Ρ‡Π΅Ρ€Ρ‚Ρƒ ( | ) Π² Ρ‚Π°Π±Π»ΠΈΡ†Π΅, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π΅Π΅ ΠΊΠΎΠ΄ символа HTML ( & # 124; ).

ΠšΠΎΠ΄ΠΎΠ²Ρ‹Π΅ Π±Π»ΠΎΠΊΠΈ с ΠΎΠ³Ρ€Π°ΠΆΠ΄Π΅Π½ΠΈΠ΅ΠΌ

Π‘Π°Π·ΠΎΠ²Ρ‹ΠΉ синтаксис Markdown позволяСт ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ Π±Π»ΠΎΠΊΠΈ ΠΊΠΎΠ΄Π° ΠΏΡƒΡ‚Π΅ΠΌ отступа строк Ρ‡Π΅Ρ‚Ρ‹Ρ€ΡŒΠΌΡ ΠΏΡ€ΠΎΠ±Π΅Π»Π°ΠΌΠΈ ΠΈΠ»ΠΈ ΠΎΠ΄Π½ΠΎΠΉ табуляциСй.Если Π²Π°ΠΌ это Π½Π΅ΡƒΠ΄ΠΎΠ±Π½ΠΎ, ΠΏΠΎΠΏΡ€ΠΎΠ±ΡƒΠΉΡ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΠ·ΠΎΠ»ΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹Π΅ Π±Π»ΠΎΠΊΠΈ ΠΊΠΎΠ΄Π°. Π’ зависимости ΠΎΡ‚ вашСго процСссора ΠΈΠ»ΠΈ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€Π° Markdown Π²Ρ‹ Π±ΡƒΠ΄Π΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Ρ€ΠΈ ΠΎΠ±Ρ€Π°Ρ‚Π½Ρ‹Ρ… ΠΊΠ°Π²Ρ‹Ρ‡ΠΊΠΈ ( - ) ΠΈΠ»ΠΈ Ρ‚Ρ€ΠΈ Ρ‚ΠΈΠ»ΡŒΠ΄Ρ‹ ( ~~~ ) Π² строках Π΄ΠΎ ΠΈ послС Π±Π»ΠΎΠΊΠ° ΠΊΠΎΠ΄Π°. Π›ΡƒΡ‡ΡˆΠ°Ρ Ρ‡Π°ΡΡ‚ΡŒ? Π’Π°ΠΌ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ Π΄Π΅Π»Π°Ρ‚ΡŒ отступы!

  ''
{
  "firstName": "Π”ΠΆΠΎΠ½",
  "lastName": "Π‘ΠΌΠΈΡ‚",
  «возраст»: 25
}
`` ''
  

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

  {
  "firstName": "Π”ΠΆΠΎΠ½",
  "lastName": "Π‘ΠΌΠΈΡ‚",
  «возраст»: 25
}
  

Π‘ΠΎΠ²Π΅Ρ‚: НуТно ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒ ΠΎΠ±Ρ€Π°Ρ‚Π½Ρ‹Π΅ ΠΊΠ°Π²Ρ‹Ρ‡ΠΊΠΈ Π²Π½ΡƒΡ‚Ρ€ΠΈ ΠΊΠΎΠ΄ΠΎΠ²ΠΎΠ³ΠΎ Π±Π»ΠΎΠΊΠ°? Π‘ΠΌ. Π­Ρ‚ΠΎΡ‚ Ρ€Π°Π·Π΄Π΅Π», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ·Π½Π°Ρ‚ΡŒ, ΠΊΠ°ΠΊ ΠΎΡ‚ Π½ΠΈΡ… ΠΈΠ·Π±Π΅ΠΆΠ°Ρ‚ΡŒ.

ΠŸΠΎΠ΄ΡΠ²Π΅Ρ‚ΠΊΠ° синтаксиса

МногиС процСссоры Markdown ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‚ подсвСтку синтаксиса для ΠΈΠ·ΠΎΠ»ΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹Ρ… Π±Π»ΠΎΠΊΠΎΠ² ΠΊΠΎΠ΄Π°. Π­Ρ‚Π° функция позволяСт Π΄ΠΎΠ±Π°Π²Π»ΡΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ΠΎΠ²ΡƒΡŽ подсвСтку для любого языка, Π½Π° ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ Π±Ρ‹Π» написан ваш ΠΊΠΎΠ΄. Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ подсвСтку синтаксиса, ΡƒΠΊΠ°ΠΆΠΈΡ‚Π΅ язык рядом с ΠΎΠ±Ρ€Π°Ρ‚Π½Ρ‹ΠΌΠΈ ΠΊΠ°Π²Ρ‹Ρ‡ΠΊΠ°ΠΌΠΈ ΠΏΠ΅Ρ€Π΅Π΄ ΠΈΠ·ΠΎΠ»ΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹ΠΌ Π±Π»ΠΎΠΊΠΎΠΌ ΠΊΠΎΠ΄Π°.

  `` json
{
  "firstName": "Π”ΠΆΠΎΠ½",
  "lastName": "Π‘ΠΌΠΈΡ‚",
  «возраст»: 25
}
`` ''
  

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

  {
  "firstName": "Π”ΠΆΠΎΠ½",
  "lastName": "Π‘ΠΌΠΈΡ‚",
  «возраст»: 25
}
  

Бноски

Бноски ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡŽΡ‚ Π΄ΠΎΠ±Π°Π²Π»ΡΡ‚ΡŒ примСчания ΠΈ ссылки, Π½Π΅ загромоТдая тСкст Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°.bignote]: Π’ΠΎΡ‚ ΠΎΠ΄ΠΈΠ½ с нСсколькими Π°Π±Π·Π°Ρ†Π°ΠΌΠΈ ΠΈ ΠΊΠΎΠ΄ΠΎΠΌ.

Π‘Π΄Π΅Π»Π°ΠΉΡ‚Π΅ Π°Π±Π·Π°Ρ†Ρ‹ отступом, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ ΠΈΡ… Π² сноску.

`{ΠΌΠΎΠΉ ΠΊΠΎΠ΄}`

Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ ΡΡ‚ΠΎΠ»ΡŒΠΊΠΎ Π°Π±Π·Π°Ρ†Π΅Π², сколько Ρ…ΠΎΡ‚ΠΈΡ‚Π΅.

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

Π’ΠΎΡ‚ простая сноска, , Π° Π²ΠΎΡ‚ Π±ΠΎΠ»Π΅Π΅ длинная.

Π˜Π΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€Ρ‹ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ²

МногиС процСссоры Markdown ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‚ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΠ΅ ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€Ρ‹ для Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ² — Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ процСссоры Markdown Π΄ΠΎΠ±Π°Π²Π»ΡΡŽΡ‚ ΠΈΡ… автоматичСски. Π”ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΡ… ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€ΠΎΠ² позволяСт Π½Π°ΠΏΡ€ΡΠΌΡƒΡŽ ΡΡΡ‹Π»Π°Ρ‚ΡŒΡΡ Π½Π° Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΡΡ‚ΡŒ ΠΈΡ… с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ CSS.Π§Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΠΉ ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°, Π·Π°ΠΊΠ»ΡŽΡ‡ΠΈΡ‚Π΅ Π΅Π³ΠΎ Π² Ρ„ΠΈΠ³ΡƒΡ€Π½Ρ‹Π΅ скобки Π² Ρ‚ΠΎΠΉ ΠΆΠ΅ строкС, Ρ‡Ρ‚ΠΎ ΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ.

  ### Мой ΠΎΡ‚Π»ΠΈΡ‡Π½Ρ‹ΠΉ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ {# custom-id}
  

HTML-ΠΊΠΎΠ΄ выглядит Ρ‚Π°ΠΊ:

  

ΠžΡ‚Π»ΠΈΡ‡Π½Ρ‹ΠΉ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ

Бвязь с ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€Π°ΠΌΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ²

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠ²ΡΠ·Π°Ρ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ с ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΠΌΠΈ ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€Π°ΠΌΠΈ Π² Ρ„Π°ΠΉΠ»Π΅, создав ΡΡ‚Π°Π½Π΄Π°Ρ€Ρ‚Π½ΡƒΡŽ ссылку с числовым Π·Π½Π°ΠΊΠΎΠΌ ( # ), Π·Π° ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ слСдуСт ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΠΉ ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°.

Π£Ρ†Π΅Π½ΠΊΠ° HTML Π’Ρ‹Π²ΠΎΠ΄ΠΈΠΌΡ‹ΠΉ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚
[ID Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ²] (# ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€ΠΎΠ² Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ²) ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€Ρ‹ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ² Π˜Π΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€Ρ‹ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ²

Π”Ρ€ΡƒΠ³ΠΈΠ΅ Π²Π΅Π±-сайты ΠΌΠΎΠ³ΡƒΡ‚ ΡΡΡ‹Π»Π°Ρ‚ΡŒΡΡ Π½Π° Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, добавляя ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΡΠΊΠΈΠΉ ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° ΠΊ ΠΏΠΎΠ»Π½ΠΎΠΌΡƒ URL-адрСсу Π²Π΅Π±-страницы (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€,g, [ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ„ΠΈΠΊΠ°Ρ‚ΠΎΡ€Ρ‹ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠ²] (https://www.markdownguide.org/extended-syntax#heading-ids) ).

Бписки ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠΉ

НСкоторыС процСссоры Markdown ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡŽΡ‚ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ списков ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠΉ, Ρ‚Π΅Ρ€ΠΌΠΈΠ½ΠΎΠ² ΠΈ ΡΠΎΠΎΡ‚Π²Π΅Ρ‚ΡΡ‚Π²ΡƒΡŽΡ‰ΠΈΡ… ΠΈΠΌ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠΉ. Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ список ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠΉ, Π²Π²Π΅Π΄ΠΈΡ‚Π΅ Ρ‚Π΅Ρ€ΠΌΠΈΠ½ Π² ΠΏΠ΅Ρ€Π²ΠΎΠΉ строкС. Π’ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΉ строкС Π²Π²Π΅Π΄ΠΈΡ‚Π΅ Π΄Π²ΠΎΠ΅Ρ‚ΠΎΡ‡ΠΈΠ΅, Π·Π°Ρ‚Π΅ΠΌ ΠΏΡ€ΠΎΠ±Π΅Π» ΠΈ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅.

  ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ сСмСстр
: Π­Ρ‚ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΠΏΠ΅Ρ€Π²ΠΎΠ³ΠΎ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°.

Π’Ρ‚ΠΎΡ€ΠΎΠΉ срок
: Π­Ρ‚ΠΎ ΠΎΠ΄Π½ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π²Ρ‚ΠΎΡ€ΠΎΠ³ΠΎ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°.: Π­Ρ‚ΠΎ Π΅Ρ‰Π΅ ΠΎΠ΄Π½ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π²Ρ‚ΠΎΡ€ΠΎΠ³ΠΎ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°.
  

HTML-ΠΊΠΎΠ΄ выглядит Ρ‚Π°ΠΊ:

  
ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ сСмСстр
Π­Ρ‚ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΠΏΠ΅Ρ€Π²ΠΎΠ³ΠΎ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°.
Π’Ρ‚ΠΎΡ€ΠΎΠΉ сСмСстр
Π­Ρ‚ΠΎ ΠΎΠ΄Π½ΠΎ ΠΈΠ· ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠΉ Π²Ρ‚ΠΎΡ€ΠΎΠ³ΠΎ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°.
Π­Ρ‚ΠΎ Π΅Ρ‰Π΅ ΠΎΠ΄Π½ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π²Ρ‚ΠΎΡ€ΠΎΠ³ΠΎ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°.

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

ΠŸΠ΅Ρ€Π²Ρ‹ΠΉ сСмСстр
Π­Ρ‚ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ ΠΏΠ΅Ρ€Π²ΠΎΠ³ΠΎ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°.
Π’Ρ‚ΠΎΡ€ΠΎΠΉ сСмСстр
Π­Ρ‚ΠΎ ΠΎΠ΄Π½ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π²Ρ‚ΠΎΡ€ΠΎΠ³ΠΎ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°.
Π­Ρ‚ΠΎ Π΅Ρ‰Π΅ ΠΎΠ΄Π½ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ Π²Ρ‚ΠΎΡ€ΠΎΠ³ΠΎ Ρ‚Π΅Ρ€ΠΌΠΈΠ½Π°.

Π—Π°Ρ‡Π΅Ρ€ΠΊΠ½ΡƒΡ‚Ρ‹ΠΉ

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π·Π°Ρ‡Π΅Ρ€ΠΊΠΈΠ²Π°Ρ‚ΡŒ слова, проводя Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΡƒΡŽ линию Π² Ρ†Π΅Π½Ρ‚Ρ€Π΅. Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ выглядит ΠΊΠ°ΠΊ это . Π­Ρ‚Π° функция позволяСт ΡƒΠΊΠ°Π·Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Π΅ слова ΡΠ²Π»ΡΡŽΡ‚ΡΡ ошибкой, Π½Π΅ ΠΏΡ€Π΅Π΄Π½Π°Π·Π½Π°Ρ‡Π΅Π½Π½ΠΎΠΉ для Π²ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΡ Π² Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚. Π§Ρ‚ΠΎΠ±Ρ‹ Π·Π°Ρ‡Π΅Ρ€ΠΊΠ½ΡƒΡ‚ΡŒ слова, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π΄Π²Π° символа Ρ‚ΠΈΠ»ΡŒΠ΄Ρ‹ ( ~~ ) Π΄ΠΎ ΠΈ послС слов.

  ~~ ΠœΠΈΡ€ плоский. ~~ Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ Π·Π½Π°Π΅ΠΌ, Ρ‡Ρ‚ΠΎ ΠΌΠΈΡ€ ΠΊΡ€ΡƒΠ³Π»Ρ‹ΠΉ.
  

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

ΠœΠΈΡ€ плоский. Π’Π΅ΠΏΠ΅Ρ€ΡŒ ΠΌΡ‹ Π·Π½Π°Π΅ΠΌ, Ρ‡Ρ‚ΠΎ ΠΌΠΈΡ€ ΠΊΡ€ΡƒΠ³Π»Ρ‹ΠΉ.

Бписки Π·Π°Π΄Π°Ρ‡

Бписки Π·Π°Π΄Π°Ρ‡ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡŽΡ‚ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ список элСмСнтов с Ρ„Π»Π°ΠΆΠΊΠ°ΠΌΠΈ. Π’ прилоТСниях Markdown, ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‰ΠΈΡ… списки Π·Π°Π΄Π°Ρ‡, Ρ„Π»Π°ΠΆΠΊΠΈ Π±ΡƒΠ΄ΡƒΡ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ рядом с содСрТимым. Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ список Π·Π°Π΄Π°Ρ‡, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Ρ‚ΠΈΡ€Π΅ ( - ) ΠΈ ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚Π½Ρ‹Π΅ скобки с ΠΏΡ€ΠΎΠ±Π΅Π»ΠΎΠΌ ( [] ) ΠΏΠ΅Ρ€Π΅Π΄ элСмСнтами списка Π·Π°Π΄Π°Ρ‡.Π§Ρ‚ΠΎΠ±Ρ‹ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ Ρ„Π»Π°ΠΆΠΎΠΊ, Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ x ΠΌΠ΅ΠΆΠ΄Ρƒ скобками ( [x] ).

  - [x] ΠΠ°ΠΏΠΈΡΠ°Ρ‚ΡŒ прСсс-Ρ€Π΅Π»ΠΈΠ·
- [] ΠžΠ±Π½ΠΎΠ²ΠΈΡ‚ΡŒ сайт
- [] Π‘Π²ΡΠ·Π°Ρ‚ΡŒΡΡ со БМИ
  

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

эмодзи

Π•ΡΡ‚ΡŒ Π΄Π²Π° способа Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ эмодзи Π² Ρ„Π°ΠΉΠ»Ρ‹ Markdown: ΡΠΊΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΈ Π²ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ эмодзи Π² тСкст Π² Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅ Markdown ΠΈΠ»ΠΈ ввСсти ΡˆΠΎΡ€Ρ‚ΠΊΠΎΠ΄ΠΎΠ² эмодзи .

ΠšΠΎΠΏΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈ вставка эмодзи

Π’ Π±ΠΎΠ»ΡŒΡˆΠΈΠ½ΡΡ‚Π²Π΅ случаСв Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ просто ΡΠΊΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ смайлик ΠΈΠ· Ρ‚Π°ΠΊΠΎΠ³ΠΎ источника, ΠΊΠ°ΠΊ Emojipedia, ΠΈ Π²ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π΅Π³ΠΎ Π² свой Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚.МногиС прилоТСния Markdown автоматичСски ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°ΡŽΡ‚ смайлики Π² тСкстС Π² Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅ Markdown. Π’ Ρ„Π°ΠΉΠ»Π°Ρ… HTML ΠΈ PDF, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ экспортируСтС ΠΈΠ· прилоТСния Markdown, Π΄ΠΎΠ»ΠΆΠ½Ρ‹ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒΡΡ эмодзи.

ИспользованиС ΠΊΠΎΡ€ΠΎΡ‚ΠΊΠΈΡ… ΠΊΠΎΠ΄ΠΎΠ² эмодзи

НСкоторыС прилоТСния Markdown ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡŽΡ‚ Π²ΡΡ‚Π°Π²Π»ΡΡ‚ΡŒ эмодзи ΠΏΡƒΡ‚Π΅ΠΌ Π²Π²ΠΎΠ΄Π° ΠΊΠΎΡ€ΠΎΡ‚ΠΊΠΈΡ… ΠΊΠΎΠ΄ΠΎΠ² эмодзи. Они Π½Π°Ρ‡ΠΈΠ½Π°ΡŽΡ‚ΡΡ ΠΈ Π·Π°ΠΊΠ°Π½Ρ‡ΠΈΠ²Π°ΡŽΡ‚ΡΡ Π΄Π²ΠΎΠ΅Ρ‚ΠΎΡ‡ΠΈΠ΅ΠΌ ΠΈ Π²ΠΊΠ»ΡŽΡ‡Π°ΡŽΡ‚ Π½Π°Π·Π²Π°Π½ΠΈΠ΅ смайлика.

  УшСл Π² ΠΏΠΎΡ…ΠΎΠ΄! : tent: Π‘ΠΊΠΎΡ€ΠΎ Π²Π΅Ρ€Π½ΡƒΡΡŒ.

Π­Ρ‚ΠΎ Ρ‚Π°ΠΊ смСшно! :Ρ€Π°Π΄ΠΎΡΡ‚ΡŒ:
  

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

УшСл Π² ΠΏΠΎΡ…ΠΎΠ΄! β›Ί Π‘ΠΊΠΎΡ€ΠΎ Π²Π΅Ρ€Π½ΡƒΡΡŒ.

Π­Ρ‚ΠΎ Ρ‚Π°ΠΊ смСшно! πŸ˜‚

ΠŸΡ€ΠΈΠΌΠ΅Ρ‡Π°Π½ΠΈΠ΅. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ этот список ΡˆΠΎΡ€Ρ‚ΠΊΠΎΠ΄ΠΎΠ² эмодзи, Π½ΠΎ ΠΈΠΌΠ΅ΠΉΡ‚Π΅ Π² Π²ΠΈΠ΄Ρƒ, Ρ‡Ρ‚ΠΎ ΡˆΠΎΡ€Ρ‚ΠΊΠΎΠ΄Ρ‹ эмодзи Ρ€Π°Π·Π»ΠΈΡ‡Π°ΡŽΡ‚ΡΡ ΠΎΡ‚ прилоТСния ΠΊ ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΡŽ. ΠžΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ΡΡŒ ΠΊ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π°Ρ†ΠΈΠΈ вашСго прилоТСния Markdown для получСния Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΈ.

АвтоматичСскоС связываниС URL-адрСсов

МногиС процСссоры Markdown автоматичСски ΠΏΡ€Π΅Π²Ρ€Π°Ρ‰Π°ΡŽΡ‚ URL-адрСса Π² ссылки. Π­Ρ‚ΠΎ ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ Ссли Π²Ρ‹ Π½Π°Π±Π΅Ρ€Π΅Ρ‚Π΅ http://www.example.com, ваш процСссор Markdown автоматичСски ΠΏΡ€Π΅Π²Ρ€Π°Ρ‚ΠΈΡ‚ Π΅Π³ΠΎ Π² ссылку, Π΄Π°ΠΆΠ΅ Ссли Π²Ρ‹ Π½Π΅ использовали скобки.

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

http://www.example.com

ΠžΡ‚ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅ автоматичСского связывания URL-адрСсов

Если Π²Ρ‹ Π½Π΅ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ URL-адрСс Π±Ρ‹Π» автоматичСски привязан, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ ссылку, ΠΎΠ±ΠΎΠ·Π½Π°Ρ‡ΠΈΠ² URL-адрСс ΠΊΠ°ΠΊ ΠΊΠΎΠ΄ с ΠΎΠ±Ρ€Π°Ρ‚Π½Ρ‹ΠΌΠΈ ΠΊΠ°Π²Ρ‹Ρ‡ΠΊΠ°ΠΌΠΈ.

Π Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° выглядит Ρ‚Π°ΠΊ:

http://www.example.com

ΠŸΠΎΠ΄Π½ΠΈΠΌΠΈΡ‚Π΅ свои Π½Π°Π²Ρ‹ΠΊΠΈ Markdown Π½Π° Π½ΠΎΠ²Ρ‹ΠΉ ΡƒΡ€ΠΎΠ²Π΅Π½ΡŒ.

Π˜Π·ΡƒΡ‡ΠΈΡ‚Π΅ Markdown Π½Π° 60 страницах. Книга Markdown Guide , прСдназначСнная ΠΊΠ°ΠΊ для Π½ΠΎΠ²ΠΈΡ‡ΠΊΠΎΠ², Ρ‚Π°ΠΊ ΠΈ для экспСртов, прСдставляСт собой ΠΈΡΡ‡Π΅Ρ€ΠΏΡ‹Π²Π°ΡŽΡ‰ΠΈΠΉ справочник, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ Π΅ΡΡ‚ΡŒ всС Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎΠ΅ для Π½Π°Ρ‡Π°Π»Π° Ρ€Π°Π±ΠΎΡ‚Ρ‹ ΠΈ освоСния синтаксиса Markdown.

ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΊΠ½ΠΈΠ³Ρƒ

НС останавливайся сСйчас ΠΆΠ΅! πŸš€ Π’ΠΊΠ»ΡŽΡ‡ΠΈΡ‚Π΅ Ρ€Π΅ΠΏΠΎΠ·ΠΈΡ‚ΠΎΡ€ΠΈΠΉ GitHub, Π° Π·Π°Ρ‚Π΅ΠΌ Π²Π²Π΅Π΄ΠΈΡ‚Π΅ свой адрСс элСктронной ΠΏΠΎΡ‡Ρ‚Ρ‹ Π½ΠΈΠΆΠ΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡Π°Ρ‚ΡŒ Π½ΠΎΠ²Ρ‹Π΅ руководства ΠΏΠΎ Markdown ΠΏΠΎ элСктронной ΠΏΠΎΡ‡Ρ‚Π΅. Π‘Π΅Π· спама!

МСлководная бСлая восковая сторона с ΠΏΡ€ΠΈΠΊΡ€ΠΎΠ²Π°Ρ‚Π½Ρ‹ΠΌ столом для рисования, высокоС качСство, Π½ΠΎΠ²ΠΈΠ½ΠΊΠ°

Π­Ρ‚ΠΈ Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠΈ ΠΈΠ· ΠΈΠ½Π΄Π΅ΠΉΠΊΠΈ с чСсночным маслом содСрТат ΠΌΠ°Π»ΠΎ ΡƒΠ³Π»Π΅Π²ΠΎΠ΄ΠΎΠ², Π½Π΅ содСрТат Π³Π»ΡŽΡ‚Π΅Π½ ΠΈ ΠΎΠ±Π»Π°Π΄Π°ΡŽΡ‚ большим вкусом! Π­Ρ‚ΠΎ блюдо Π½Π° ΠΎΠ΄Π½ΠΎΠΉ сковородС идСально ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΈΡ‚ для быстрого ΠΈ Π»Π΅Π³ΠΊΠΎΠ³ΠΎ ΡƒΠΆΠΈΠ½Π°, Π½ΠΎ ΠΎΠ½ΠΎ Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΠΎΠ»Π΅Π·Π½ΠΎ для Π·Π΄ΠΎΡ€ΠΎΠ²ΡŒΡ!

Π€Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠΈ ΠΈΠ· ΠΈΠ½Π΄Π΅ΠΉΠΊΠΈ ΡΠΎΡ‡Π΅Ρ‚Π°ΡŽΡ‚ΡΡ с лапшой ΠΈΠ· ΠΊΠ°Π±Π°Ρ‡ΠΊΠΎΠ² ΠΏΠΎ спирали, ΠΎΠ±ΠΆΠ°Ρ€Π΅Π½Π½ΠΎΠΉ Π² Π»Π΅Π³ΠΊΠΎΠΌ сливочном маслС, Π»ΠΈΠΌΠΎΠ½Π½ΠΎΠΌ сокС, остром соусС ΠΈ нСбольшом количСствС чСсночного ΠΏΠΎΡ€ΠΎΡˆΠΊΠ°.Масло ΠΈ Π»ΠΈΠΌΠΎΠ½ Π΄Π΅Π»Π°ΡŽΡ‚ эту Π»Π°ΠΏΡˆΡƒ ΠΈΠ· Ρ†ΡƒΠΊΠΊΠΈΠ½ΠΈ ΠΏΠΈΠΊΠ°Π½Ρ‚Π½ΠΎΠΉ ΠΈ ΠΎΡΠ²Π΅ΠΆΠ°ΡŽΡ‰Π΅ΠΉ, добавляя Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Ρ‚Π΅ΠΏΠ»Π° ΠΎΡ‚ острого соуса. Если Π²Π°ΠΌ Π½Π΅ нравится Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ спСций, Π½Π΅ добавляйтС острый соус.

Π•Ρ‰Π΅ ΠΎΠ΄ΠΈΠ½ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ Π³Π°Ρ€Π½ΠΈΡ€Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΌ я наслаТдался с этими Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠ°ΠΌΠΈ, — это тСртая цвСтная капуста ΠΈΠ»ΠΈ нарСзанная цвСтная капуста. ΠšΡƒΠΏΠΈΡ‚Π΅ ΠΈΡ… ΡƒΠΆΠ΅ Π½Π°Ρ‚Π΅Ρ€Ρ‚Ρ‹ΠΌΠΈ Π² Π·Π°ΠΌΠΎΡ€ΠΎΠΆΠ΅Π½Π½ΠΎΠΌ Ρ€Π°Π·Π΄Π΅Π»Π΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΡΠΊΠΎΠ½ΠΎΠΌΠΈΡ‚ΡŒ врСмя. ΠŸΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ ΠΈΡ… Π² ΠΌΠΈΠΊΡ€ΠΎΠ²ΠΎΠ»Π½ΠΎΠ²ΡƒΡŽ ΠΏΠ΅Ρ‡ΡŒ, ΠΈ Ρƒ вас Π±ΡƒΠ΄Π΅Ρ‚ идСальная сторона для этих Π²ΠΎΡΡ…ΠΈΡ‚ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»Π΅ΠΊ.

Π­Ρ‚ΠΈ Π°ΠΏΠΏΠ΅Ρ‚ΠΈΡ‚Π½Ρ‹Π΅ ΠΊΠΎΡ‚Π»Π΅Ρ‚Ρ‹ Ρ‚Π°ΠΊΠΈΠ΅ ΡƒΠ½ΠΈΠ²Π΅Ρ€ΡΠ°Π»ΡŒΠ½Ρ‹Π΅! Π― Ρ‚Π°ΠΊΠΆΠ΅ наслаТдаюсь ΠΈΠΌΠΈ с Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹ΠΌΠΈ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°ΠΌΠΈ G Hughes, Ρ‚Π°ΠΊΠΈΠΌΠΈ ΠΊΠ°ΠΊ ΠΈΡ… соусы Π±Π°Ρ€Π±Π΅ΠΊΡŽ Π±Π΅Π· сахара, Π°ΠΏΠ΅Π»ΡŒΡΠΈΠ½ΠΎΠ²Ρ‹ΠΉ ΠΈΠΌΠ±ΠΈΡ€Π½Ρ‹ΠΉ ΠΌΠ°Ρ€ΠΈΠ½Π°Π΄ ΠΈ ΠΌΠ°Ρ€ΠΈΠ½Π°Π΄ тСрияки.ΠŸΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠΈ ΡΡ‡ΠΈΡ‚Π°ΡŽΡ‚ΡΡ Ρ‡ΡƒΡ‚ΡŒ ΠΌΠ΅Π½Π΅Π΅ 2 ΠΏΡ€ΠΈΠΏΡ€Π°Π², ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ 1 ΡΡ‚ΠΎΠ»ΠΎΠ²ΡƒΡŽ Π»ΠΎΠΆΠΊΡƒ этих соусов Π² качСствС 1 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Ρ‹ Π½Π° ΠΏΠΎΡ€Ρ†ΠΈΡŽ. ΠΠ°ΡΠ»Π°ΠΆΠ΄Π°ΠΉΡ‚Π΅ΡΡŒ этими вкусными тСфтСлями!

Π€Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠΈ ΠΈΠ· ΠΈΠ½Π΄Π΅ΠΉΠΊΠΈ ΠΈ чСсночного масла

с лапшой ΠΈΠ· Ρ†ΡƒΠΊΠΊΠΈΠ½ΠΈ ΠΈ Π»ΠΈΠΌΠΎΠ½ΠΎΠΌ

НСмного Π°Π΄Π°ΠΏΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΎ ΠΈΠ· Eatwell101

Π˜Π½Π³Ρ€Π΅Π΄ΠΈΠ΅Π½Ρ‚Ρ‹: 930 930 930

930 930 930

постный Ρ„Π°Ρ€Ρˆ ΠΈΠ· ΠΈΠ½Π΄Π΅ΠΉΠΊΠΈ (2 1/2 постного мяса)

1/2 стакана ΠΎΠ±Π΅Π·ΠΆΠΈΡ€Π΅Π½Π½ΠΎΠ³ΠΎ сыра ΠΌΠΎΡ†Π°Ρ€Π΅Π»Π»Π° ~ ΠΎΡ‚ 3 Π΄ΠΎ 6 Π³ ΠΆΠΈΡ€Π° Π½Π° ΡƒΠ½Ρ†ΠΈΡŽ (1/2 постного мяса)

1/2 Ρ‡Π°ΠΉΠ½ΠΎΠΉ Π»ΠΎΠΆΠΊΠΈ чСсночного ΠΏΠΎΡ€ΠΎΡˆΠΊΠ° (1 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Π°)

1 чайная Π»ΠΎΠΆΠΊΠ° ΡΡƒΡˆΠ΅Π½Ρ‹ΠΉ Π±Π°Π·ΠΈΠ»ΠΈΠΊ (1/2 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Ρ‹)

1/2 Ρ‡Π°ΠΉΠ½ΠΎΠΉ Π»ΠΎΠΆΠΊΠΈ ΡΡƒΡˆΠ΅Π½ΠΎΠ³ΠΎ ΠΎΡ€Π΅Π³Π°Π½ΠΎ (1/2 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Ρ‹)

1 ΠΈΠ·ΠΌΠ΅Π»ΡŒΡ‡Π΅Π½Π½Ρ‹ΠΉ кусочСк ΠΊΡƒΡ€ΠΈΠ½ΠΎΠ³ΠΎ Π±ΡƒΠ»ΡŒΠΎΠ½Π° (1 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Π°)

1/4 Ρ‡Π°ΠΉΠ½ΠΎΠΉ Π»ΠΎΠΆΠΊΠΈ соли (1 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Π°)

1/4 Ρ‡Π΅Ρ€Π½ΠΎΠ³ΠΎ ΠΏΠ΅Ρ€Ρ†Π° (1/2 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Ρ‹)

1 стакан Π½Π°Ρ€Π΅Π·Π°Π½Π½ΠΎΠΉ ΠΊΠΈΠ½Π·Ρ‹ (1 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Ρ‹) *

1 1/2 столовой Π»ΠΎΠΆΠΊΠΈ Knipex 97 53 08 0,08-10 / 16 ΠΌΠΌ ΠšΠ»Π΅Ρ‰ΠΈ для опрСссовки ΠΊΠΎΠ½Ρ†Π΅Π²Ρ‹Ρ… гильз (1 1/2 Π·Π΄ΠΎΡ€ΠΎΠ²Ρ‹Ρ… ΠΆΠΈΡ€ΠΎΠ² )

Для лапши ΠΈΠ· ΠΊΠ°Π±Π°Ρ‡ΠΊΠΎΠ²:

4 1/2 стакана лапши ΠΈΠ· ΠΊΠ°Π±Π°Ρ‡ΠΊΠΎΠ² ~ 810 Π³ Π²Π°Ρ€Π΅Π½ΠΎΠΉ массы ht (9 Π·Π΅Π»Π΅Π½ΠΈ)

1/4 Ρ‡Π°ΠΉΠ½ΠΎΠΉ Π»ΠΎΠΆΠΊΠΈ чСсночного ΠΏΠΎΡ€ΠΎΡˆΠΊΠ° (1/2 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Ρ‹)

1 столовая Π»ΠΎΠΆΠΊΠ° 8.46 дюймов ÐidѸ Β· os WΓ‘ Β»β€Ή h Sucѹion Cup — HΓ‘ Β»Β₯ ge ÐiѸ Β· lo ReѺ‘lis (1 Π·Π΄ΠΎΡ€ΠΎΠ²Ρ‹ΠΉ ΠΆΠΈΡ€)

1 столовая Π»ΠΎΠΆΠΊΠ° Π»ΠΈΠΌΠΎΠ½Π½ΠΎΠ³ΠΎ сока (1 1/2 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Ρ‹)

1 столовая Π»ΠΎΠΆΠΊΠ° острого соуса Ѐрэнка ( 1/2 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Ρ‹)

НаправлСния:

Π’ большой мискС ΡΠΌΠ΅ΡˆΠ°ΠΉΡ‚Π΅ Ρ„Π°Ρ€Ρˆ ΠΈΠ· ΠΈΠ½Π΄Π΅ΠΉΠΊΠΈ, сыр ΠΌΠΎΡ†Π°Ρ€Π΅Π»Π»Π°, 1/2 Ρ‡Π°ΠΉΠ½ΠΎΠΉ Π»ΠΎΠΆΠΊΠΈ чСсночного ΠΏΠΎΡ€ΠΎΡˆΠΊΠ°, Π±Π°Π·ΠΈΠ»ΠΈΠΊ, ΠΎΡ€Π΅Π³Π°Π½ΠΎ, ΠΈΠ·ΠΌΠ΅Π»ΡŒΡ‡Π΅Π½Π½Ρ‹ΠΉ Π±ΡƒΠ»ΡŒΠΎΠ½Π½Ρ‹ΠΉ ΠΊΡƒΠ±ΠΈΠΊ, соль, Ρ‡Π΅Ρ€Π½Ρ‹ΠΉ ΠΏΠ΅Ρ€Π΅Ρ† ΠΈ ΠΊΠΈΠ½Π·Ρƒ (ΡΡΠΊΠΎΠ½ΠΎΠΌΡŒΡ‚Π΅ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΠΊΠΈΠ½Π·Π° для ΡƒΠΊΡ€Π°ΡˆΠ΅Π½ΠΈΡ). Π₯ΠΎΡ€ΠΎΡˆΠΎ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅ΡˆΠ°ΠΉΡ‚Π΅ ΠΈ сформируйтС 18 Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»Π΅ΠΊ. РаздСляю ΠΌΡΡΠ½ΡƒΡŽ смСсь Π½Π° 3 Ρ€Π°Π²Π½Ρ‹Π΅ части, взвСшивая.Π—Π°Ρ‚Π΅ΠΌ ΠΈΠ· ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΠΏΠΎΡ€Ρ†ΠΈΠΈ сдСлайтС ΠΏΠΎ 6 Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»Π΅ΠΊ.

РастопитС 1 1/2 столовых Π»ΠΎΠΆΠΊΠΈ сливочного масла Π² большой сковородС Π½Π° срСднСм ΠΈΠ»ΠΈ ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎΠΌ ΠΎΠ³Π½Π΅. Π“ΠΎΡ‚ΠΎΠ²ΡŒΡ‚Π΅ Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠΈ 8-10 ΠΌΠΈΠ½ΡƒΡ‚ со всСх сторон, ΠΏΠΎΠΊΠ° ΠΎΠ½ΠΈ Π½Π΅ подрумянятся ΠΈ Π½Π΅ пропарятся. Π’ΠΎ врСмя приготовлСния ΠΏΠΎΠ»ΠΈΡ‚ΡŒ Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠΈ смСсью сливочного масла ΠΈ сока. Π’Ρ‹Π»ΠΎΠΆΠΈΡ‚Π΅ Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠΈ Π½Π° Ρ‚Π°Ρ€Π΅Π»ΠΊΡƒ ΠΈ ΠΎΡ‚Π»ΠΎΠΆΠΈΡ‚Π΅.

Π’ Ρ‚ΠΎΠΉ ΠΆΠ΅ сковородС растопитС 1 ΡΡ‚ΠΎΠ»ΠΎΠ²ΡƒΡŽ Π»ΠΎΠΆΠΊΡƒ сливочного масла. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π»ΠΈΠΌΠΎΠ½Π½Ρ‹ΠΉ сок, острый соус ΠΈ 1/4 Ρ‡Π°ΠΉΠ½ΠΎΠΉ Π»ΠΎΠΆΠΊΠΈ чСсночного ΠΏΠΎΡ€ΠΎΡˆΠΊΠ°. Π”ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ Π»Π°ΠΏΡˆΡƒ ΠΈΠ· ΠΊΠ°Π±Π°Ρ‡ΠΊΠΎΠ² ΠΈ Π³ΠΎΡ‚ΠΎΠ²ΡŒΡ‚Π΅ 3-4 ΠΌΠΈΠ½ΡƒΡ‚Ρ‹, ΠΏΠΎΠΊΠ° ΠΊΠ°Π±Π°Ρ‡ΠΊΠΈ Π½Π΅ станут хрустящими.

ΠžΡ‚ΠΎΠ΄Π²ΠΈΠ½ΡŒΡ‚Π΅ ΠΊΠ°Π±Π°Ρ‡ΠΊΠΈ Π² сторону, снова ΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚Π΅ Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠΈ Π² сковороду ΠΈ Ρ€Π°Π·ΠΎΠ³Ρ€Π΅ΠΉΡ‚Π΅ ΠΏΠ°Ρ€Ρƒ ΠΌΠΈΠ½ΡƒΡ‚. Π£ΠΊΡ€Π°ΡΠΈΡ‚ΡŒ ΠΊΠΈΠ½Π·ΠΎΠΉ. ΠŸΠΎΠ΄Π°Π²Π°Ρ‚ΡŒ Π½Π΅ΠΌΠ΅Π΄Π»Π΅Π½Π½ΠΎ. ΠΠ°ΡΠ»Π°ΠΆΠ΄Π°Ρ‚ΡŒΡΡ!

На 3 ΠΏΠΎΡ€Ρ†ΠΈΠΈ

КаТдая порция содСрТит:

1 постноС мясо, 3 Π·Π΅Π»Π΅Π½ΠΈ, 3 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Ρ‹ ΠΈ 1 Π·Π΄ΠΎΡ€ΠΎΠ²Ρ‹ΠΉ ΠΆΠΈΡ€

6 Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»Π΅ΠΊ с 1 1/2 Ρ‡Π°ΡˆΠΊΠΈ (270 Π³) Ρ†ΡƒΠΊΠΊΠΈΠ½ΠΈ

лапши

Π₯ΠΎΡ‚ΠΈΡ‚Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ„Ρ€ΠΈΠΊΠ°Π΄Π΅Π»ΡŒΠΊΠΈ Π² качСствС постного блюда? Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΎΠΉ Π·Π΅Π»Π΅Π½Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚, Π½ΠΎ Π½Π΅ Π·Π°Π±ΡƒΠ΄ΡŒΡ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ 1 ΠΏΠΎΠ»Π΅Π·Π½Ρ‹ΠΉ ΠΆΠΈΡ€, Ссли Π²Ρ‹ Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚Π΅ Ρ€Π΅Ρ†Π΅ΠΏΡ‚ Ρ†ΡƒΠΊΠΈΠ½ΠΈ.НапримСр: Π΄ΠΎΠ±Π°Π²ΡŒΡ‚Π΅ 1 Ρ‡Π°ΠΉΠ½ΡƒΡŽ Π»ΠΎΠΆΠΊΡƒ свСтлого сливочного масла (1/3 Π·Π΄ΠΎΡ€ΠΎΠ²ΠΎΠ³ΠΎ ΠΆΠΈΡ€Π°) ΠΊ 1 1/2 стакана Ρ‚Π΅Ρ€Ρ‚ΠΎΠΉ Ρ†Π²Π΅Ρ‚Π½ΠΎΠΉ капусты Π½Π° 1 ΠΏΠΎΡ€Ρ†ΠΈΡŽ ΠΈΠ»ΠΈ 1 ΡΡ‚ΠΎΠ»ΠΎΠ²ΡƒΡŽ Π»ΠΎΠΆΠΊΡƒ Π»Π΅Π³ΠΊΠΎΠ³ΠΎ сливочного масла (1 Π·Π΄ΠΎΡ€ΠΎΠ²Ρ‹ΠΉ ΠΆΠΈΡ€) ΠΊ 4 1/2 стаканам Ρ‚Π΅Ρ€Ρ‚ΠΎΠΉ Ρ†Π²Π΅Ρ‚Π½ΠΎΠΉ капусты Π½Π° 3 ΠΏΠΎΡ€Ρ†ΠΈΠΈ.

* Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π·Π°ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΊΠΈΠ½Π·Ρƒ свСТСй ΠΏΠ΅Ρ‚Ρ€ΡƒΡˆΠΊΠΎΠΉ, Π½ΠΎ ΠΈΠΌΠ΅ΠΉΡ‚Π΅ Π² Π²ΠΈΠ΄Ρƒ, Ρ‡Ρ‚ΠΎ 1/4 стакана ΠΏΠ΅Ρ‚Ρ€ΡƒΡˆΠΊΠΈ — это 1 ΠΏΡ€ΠΈΠΏΡ€Π°Π²Π°.

НаТмитС здСсь, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°ΡΠΏΠ΅Ρ‡Π°Ρ‚Π°Ρ‚ΡŒ

Как Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π² Photoshop | Small Business

Если Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΎΠ½Π½Ρ‹Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ для ΠΊΠ»ΠΈΠ΅Π½Ρ‚Π° ΠΈΠ»ΠΈ для Ρ€Π΅ΠΊΠ»Π°ΠΌΠ½Ρ‹Ρ… ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»ΠΎΠ² вашСго бизнСса, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ инструмСнт Photoshop Shape для рисования столбцов ΠΈ строк Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚ «ВСкст» прСдоставляСт тСкст для Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Π° стили слоя ΠΏΠΎΠ·Π²ΠΎΠ»ΡΡŽΡ‚ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ ΠΈ изящСство. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ Π³Ρ€Π°Ρ„ΠΈΠΊΡƒ инструмСнта Β«Π€ΠΈΠ³ΡƒΡ€Π°Β» вмСсто Π³Ρ€Π°Ρ„ΠΈΠΊΠΈ ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΠΎΠ³ΠΎ инструмСнта рисования Β«ΠšΠΈΡΡ‚ΡŒΒ», Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π»Π΅Π³ΠΊΠΎ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒ ΠΈ Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Ρ‚ΡŒ Π»ΠΈΠ½ΠΈΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ послС ΠΈΡ… рисования. Π“Ρ€Π°Ρ„ΠΈΠΊΠ° инструмСнта Π€ΠΈΠ³ΡƒΡ€Π° Ρ‚Π°ΠΊΠΆΠ΅ содСрТит Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°Ρ†ΠΈΠΈ ΠΏΠΎ добавлСнию тСкста, Ρ‡Π΅Π³ΠΎ Π½Π΅Ρ‚ Π² Ρ‚Π°Π±Π»ΠΈΡ†Π°Ρ…, нарисованных ΠΊΠΈΡΡ‚ΡŒΡŽ.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ U.S. Letter, Π·Π°Ρ‚Π΅ΠΌ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠΊΠ½ΠΎΠΏΠΊΡƒ «Набор инструмСнтов» Π² ΠΊΡ€Π°ΠΉΠ½Π΅ΠΌ Π»Π΅Π²ΠΎΠΌ ΡƒΠ³Π»Ρƒ ΠΏΠ°Π½Π΅Π»ΠΈ инструмСнтов Β«ΠŸΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹Β».НаТмитС ΠΊΠΎΠΌΠ°Π½Π΄Ρƒ Β«Π‘Π±Ρ€ΠΎΡΠΈΡ‚ΡŒ всС», Ρ‡Ρ‚ΠΎΠ±Ρ‹ прСдыдущая конфигурация инструмСнтов Photoshop Shape Π½Π΅ мСшала Ρ€ΠΈΡΠΎΠ²Π°Π½ΠΈΡŽ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.

НаТмитС Β«DΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Ρ‡Π΅Ρ€Π½Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚ ΠΏΠ΅Ρ€Π΅Π΄Π½ΠΈΠΌ ΠΈ Π±Π΅Π»Ρ‹ΠΌ Ρ†Π²Π΅Ρ‚ΠΎΠΌ Ρ„ΠΎΠ½Π°, Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ эллипс со сплошной Π»ΠΈΠ½ΠΈΠ΅ΠΉ Π½Π° ΠΏΠ°Π»ΠΈΡ‚Ρ€Π΅ Β«Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚Ρ‹Β», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ ΠΊΠΎΠΌΠ°Π½Π΄Ρƒ Β«Π€ΠΎΡ€ΠΌΠ°Β». Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½Ρ‹ΠΉ Π·Π½Π°Ρ‡ΠΎΠΊ Π½Π° ΠΏΠ°Π½Π΅Π»ΠΈ инструмСнтов Β«ΠŸΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹Β», Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΈ ΠΏΠ΅Ρ€Π΅Ρ‚Π°Ρ‰ΠΈΡ‚Π΅ холст, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½ΠΈΠΊ Π½ΡƒΠΆΠ½ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π° для Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.

Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ сСгмСнт Π»ΠΈΠ½ΠΈΠΈ Π½Π° ΠΏΠ°Π½Π΅Π»ΠΈ инструмСнтов Β«ΠŸΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹Β», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°Π³Ρ€ΡƒΠ·ΠΈΡ‚ΡŒ инструмСнт для рисования сСгмСнтов Π»ΠΈΠ½ΠΈΠΈ, Π·Π°Ρ‚Π΅ΠΌ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠΊΠ»Π°Π²ΠΈΡˆΡƒ Β«-Β» — дСфис, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠΊΠ°Π·Π°Ρ‚ΡŒ Ρ€Π΅ΠΆΠΈΠΌ вычитания.Π’ этом Ρ€Π΅ΠΆΠΈΠΌΠ΅ строки столбцов ΠΈ строк Ρ‡Π΅Ρ‚ΠΊΠΎ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°ΡŽΡ‚ΡΡ Π½Π° Ρ„ΠΎΠ½Π΅ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹.

Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ„ΠΎΠ½ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ Π² Ρ‚ΠΎΠΌ мСстС, Π³Π΄Π΅ Π΄ΠΎΠ»ΠΆΠ½Π° Π½Π°Ρ‡ΠΈΠ½Π°Ρ‚ΡŒΡΡ линия столбца. ΠŸΠ΅Ρ€Π΅ΠΌΠ΅ΡΡ‚ΠΈΡ‚Π΅ ΠΌΡ‹ΡˆΡŒ Ρ‚ΡƒΠ΄Π°, Π³Π΄Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ линия столбца Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΠ»Π°ΡΡŒ, Π·Π°Ρ‚Π΅ΠΌ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠΈ ΡƒΠ΄Π΅Ρ€ΠΆΠΈΠ²Π°ΠΉΡ‚Π΅ ΠΊΠ»Π°Π²ΠΈΡˆΡƒ Β«ShiftΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠΊΠ°Π·Π°Ρ‚ΡŒ строго Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ линию. Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‚ΠΎΡ‡ΠΊΡƒ, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅, Ρ‡Ρ‚ΠΎΠ±Ρ‹ линия Π·Π°ΠΊΠ°Π½Ρ‡ΠΈΠ²Π°Π»Π°ΡΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°Π²Π΅Ρ€ΡˆΠΈΡ‚ΡŒ линию.

Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΎΡΡ‚Π°Π²ΡˆΠΈΠ΅ΡΡ строки столбца ΠΈ строки, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ для Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ Ρ‡Π΅Ρ€Π½ΡƒΡŽ стрСлку Π½Π° ΠΏΠ°Π»ΠΈΡ‚Ρ€Π΅ инструмСнтов, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ инструмСнт Π²Ρ‹Π±ΠΎΡ€Π° ΠΏΡƒΡ‚ΠΈ.НаТмитС ΠΈ ΡƒΠ΄Π΅Ρ€ΠΆΠΈΠ²Π°ΠΉΡ‚Π΅ Shift, Π·Π°Ρ‚Π΅ΠΌ Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ всС строки столбцов, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚ΡŒ ΠΈΡ…. НаТмитС Π²Ρ‚ΠΎΡ€ΡƒΡŽ ΠΊΡ€Π°ΠΉΠ½ΡŽΡŽ ΠΏΡ€Π°Π²ΡƒΡŽ ΠΊΠ½ΠΎΠΏΠΊΡƒ Π½Π° ΠΏΠ°Π½Π΅Π»ΠΈ инструмСнтов Β«ΠŸΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹Β», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ Β«Π Π°ΡΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Π°ΠΌ ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈΒ». Photoshop Ρ€Π°Π²Π½ΠΎΠΌΠ΅Ρ€Π½ΠΎ раздСляСт Π²Ρ‹Π±Ρ€Π°Π½Π½Ρ‹Π΅ Π²Π°ΠΌΠΈ Π»ΠΈΠ½ΠΈΠΈ столбцов. РаспрСдСлитС Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½Ρ‹Π΅ Π»ΠΈΠ½ΠΈΠΈ Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΠΊΠ½ΠΎΠΏΠΊΠΈ Β«Π Π°ΡΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈΒ», пятой ΠΊΠ½ΠΎΠΏΠΊΠΈ справа Π½Π° ΠΏΠ°Π½Π΅Π»ΠΈ инструмСнтов Β«ΠŸΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹Β». НаТмитС Β«XΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π±Π΅Π»Ρ‹ΠΉ Ρ†Π²Π΅Ρ‚ ΠΏΠ΅Ρ€Π΅Π΄Π½ΠΈΠΌ ΠΏΠ»Π°Π½ΠΎΠΌ.

Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ элСмСнт Β«Π€ΠΎΡ€ΠΌΠ°Β» Π½Π° ΠΏΠ°Π½Π΅Π»ΠΈ Β«Π‘Π»ΠΎΠΈΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ этот слой, Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Β«TΒ», Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΠΏΡƒΡΡ‚ΠΈΡ‚ΡŒ инструмСнт «ВСкст», Π·Π°Ρ‚Π΅ΠΌ Π²Π²Π΅Π΄ΠΈΡ‚Π΅ Β«36 ptΒ» Π² ΠΏΠΎΠ»Π΅ Β«Π Π°Π·ΠΌΠ΅Ρ€ ΡˆΡ€ΠΈΡ„Ρ‚Π°Β» Π½Π° ΠΏΠ°Π½Π΅Π»ΠΈ инструмСнтов Β«ΠŸΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹Β».Π©Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ячСйку Ρ‚Π°Π±Π»ΠΈΡ†Ρ‹, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ячСйку, Π·Π°Ρ‚Π΅ΠΌ Π²Π²Π΅Π΄ΠΈΡ‚Π΅ тСкст ячСйки. Когда Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΡ‚Π΅, Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Β«Ctrl-EnterΒ». ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΠΈΡ‚Π΅ этот шаг, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ тСкст Π² Π΄Ρ€ΡƒΠ³ΠΈΠ΅ ячСйки, Π½Π΅ Π·Π°Π±ΡƒΠ΄ΡŒΡ‚Π΅ сначала Ρ‰Π΅Π»ΠΊΠ½ΡƒΡ‚ΡŒ Β«Π€ΠΈΠ³ΡƒΡ€Π°Β» Π½Π° ΠΏΠ°Π½Π΅Π»ΠΈ Β«Π‘Π»ΠΎΠΈΒ».

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Π’Π°Ρˆ адрСс email Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠΏΡƒΠ±Π»ΠΈΠΊΠΎΠ²Π°Π½. ΠžΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ поля ΠΏΠΎΠΌΠ΅Ρ‡Π΅Π½Ρ‹ *