1 Востаннє редагувалося Yola (06.09.2017 12:10:28)

Тема: Як створити такий клас для таблиці

У долученні ви можеете побачити як би я хотів, щоб виглядала таблиця такого змісту:

<table class=def_block>
<tr><th>Означення</th></tr>
<tr><td>Нехай $D \in C$ буде областю визначення і нехай $f : D \to C$ буде неперервною функцією. Первісна $f$ у $D$ це аналітична функція $F : D \to C$ така, що $F' = f$ у $D$.</td></tr>
</table>

Як визначити цей клас, def_block?

Необов'язково, щоб клас був саме таким, можливі інші варіанти, які ви вважваєте підхожими для цієї цілі.

Post's attachments

Untitled.png 10.67 kb, 177 downloads since 2017-09-06 

2 Востаннє редагувалося NaharD (06.09.2017 11:55:15)

Re: Як створити такий клас для таблиці

Ось так можна. https://codepen.io/NagarD/pen/BdeyYZ

<style>
.def_block
{
    display:none;
}
</style>

<table class=def_block>
<tr><th>Означення</th></tr>
<tr><td>Нехай $D \in C$ буде областю визначення і нехай $f : D \to C$ буде неперервною функцією. Первісна $f$ у $D$ це аналітична функція $F : D \to C$ така, що $F' = f$ у $D$.</td></tr>
</table>
Подякували: 221VOLT, Monolith2

3 Востаннє редагувалося FakiNyan (06.09.2017 16:32:18)

Re: Як створити такий клас для таблиці

https://jsfiddle.net/5wnf2eL8/1/
там є спеціяльні теги для визначень
шматок HTML

<dl class="def_block">
  <dt>срака</dt>
  <p>Definition</p>
  <dd>М'яка частина тіла, що знаходиться нижче спини та вижче ніг, у дівок може бути гарною, а у чоловіків волохатою</dd>
</dl>

css

.def_block {
  border-radius: 10px;
  box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.5);
  overflow: hidden;
  text-align: left;
  background: rgb(235, 235, 255);
}

.def_block dt {
  display: none;
}

.def_block dd {
  margin-left: 5px;
}

.def_block p {
  background: blue;
  color: white;
  margin-top: 0;
  margin-bottom: 0px;
  text-indent: 5px;
}
Подякували: Yola, 0xDADA11C72

4 Востаннє редагувалося Yola (06.09.2017 15:38:23)

Re: Як створити такий клас для таблиці

Щиро дякую, сере! ви мені надзвичайно допомогли!

Таке додаткове запитання. а чи можна, щоб dt заповнювалось автоматично. тобто я хочу мати кілька класів як-от def_definition, def_theorem і т.д. І я хотів би щоб якщо я використовую def_definition, то в dt автоматом ставилось означення, а якщо def_theorem, то автоматом ставилось теорема.

Також, можливо має сенс копіювати код сюди також, щоб не треба було нікуди переходити і для пошуковиків сайт буде видніший. Ще раз дякую!

5 Востаннє редагувалося FakiNyan (06.09.2017 16:37:41)

Re: Як створити такий клас для таблиці

Yola написав:

Щиро дякую, сере! ви мені надзвичайно допомогли!

Таке додаткове запитання. а чи можна, щоб dt заповнювалось автоматично. тобто я хочу мати кілька класів як-от def_definition, def_theorem і т.д. І я хотів би щоб якщо я використовую def_definition, то в dt автоматом ставилось означення, а якщо def_theorem, то автоматом ставилось теорема.

Також, можливо має сенс копіювати код сюди також, щоб не треба було нікуди переходити і для пошуковиків сайт буде видніший. Ще раз дякую!

так я ж не в dt пишу Definition, а в p. В dt має бути ім'я того, про що пишеться. Типу

<dl>
 <dt>Кава</dt>
 <dd>Ну то такий напій, котрий роблять з зерен кави</dd>
</dl>

оте, що ви кажете, можна зробити через JS, але воно, швидше за все, не буде індексуватись пошуковими рушіями, бо ці дані будуть підставлятись в момент завантаження сторіночки, коли спрацьовує js код, але я можу помилятись

Подякували: Yola, 0xDADA11C7, leofun013

6

Re: Як створити такий клас для таблиці

@FakiNyan, дякую завдяки вам мені вдалось написати отаку статтю Нотатки на курс "Вступ до комплексного аналізу"

Чи не підкажете як би мені розширити цей блок, так щоб туди ще й доведення вставити можна було? Дякую!

Подякували: 0xDADA11C71

7

Re: Як створити такий клас для таблиці

це ви про дизайн запитуєте?

8 Востаннє редагувалося FakiNyan (09.09.2017 15:38:58)

Re: Як створити такий клас для таблиці

я тут глянув на ваш сайт, і тут dl не підходе, бо воно годиться для опису якогось предмета, або явища, як в словнику.
А у вас там просто блоки інформації з заголовком, для цього більше підійде section. Доведення я втулив в один блок, типу, теорема і доведення нероздільні... ну то таке, я не дизайнер, так що хз

https://jsfiddle.net/h94efmag/4/

Подякували: Yola, 0xDADA11C7, leofun013

9

Re: Як створити такий клас для таблиці

От як я зробив на базі вашого:

/* усі інші стилі точнісінько як у вашій першій відповіді */
.def_block proof:before {
  margin-left: 5px;
  content: "Доведення:";
  font-weight: bold;
}

<dl class="def_block">
  <dt>срака</dt>
  <p>Теорема</p>
  <dd>М'яка частина тіла, що знаходиться нижче спини та вижче ніг, у дівок може бути гарною, а у чоловіків волохатою</dd>
  <proof/>
  <dd>
    Це ж очевидно...
  </dd>
</dl>
Подякували: 0xDADA11C7, FakiNyan2

10

Re: Як створити такий клас для таблиці

ну то нехай так і буде, якщо вам подобається, тільки замініть dl на section, перший p на h3, наприклад, а dd на p, ну ви пойняли