добавление текста под таблицей в контейнере

Question

добавление текста под таблицей в контейнере

0

Учитывая следующий HTML, который создает список благотворительных доноров и заголовок вверху. Я хотел бы добавить название Благотворительности внизу в контейнере. Я совершенно новый с HTML, и я делаю это как свою первую задачу.

КОД CSS:

/*** central column on page ***/
div #divContainer {
    max-width: 50%;
    margin: 0 auto;
    font-family: Verdana;
    padding: 1em 1em 1em 1em;
    /* rounded corners */
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    /* add gradient */
    background-color: #908080;
    background: -webkit-gradient (linear, left top, left bottom, from(#606060), to(#C65C65));
    background: -moz-linear-gradient (top, #606060, #998880);
    /* add box shadows */
    -moz-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
    box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
}
/*** Donner Role ***/
 table.CRG {
    align="center";
    vertical-align="center";
    text-align:center;
    border:3px solid black;
    border-collapse:collapse;
}
/*** table td element, all section ***/
 table.CRG td {
    color:white;
    vertical-align:middle;
    padding: 0.5em;
    border:3px solid black;
    font-weight:bold;
}
 h1 {
    color:#FFE47A;
    font-size:1.5em;
 }

HTML-код:

    <!-- CENTTERED COLUMN ON THE PAGE-->
<div id="divContainer">
    <!-- HTML5 TABLE FORMATTED VIA CSS3-->
    <table class="CRG" width="100%">
        <!-- TABLE BODY: MAIN CONTENT from Function CRG -->
        <tbody>
             <h1><center> My Charity </center> </h1>

            <tr>
                <td>Mr. Smithn</td>
            </tr>
            <tr>
                <td>Mr. Jones</td>
            </tr>
            <tr>
                <td>Mrs. Generous</td>
            </tr>
            <tr>
                <td>Reserved</td>
            </tr>
            <tr>
                <td>Reserved</td>
            </tr>
            <tr>
                <td>Reserved</td>
            </tr>
            <tr>
                <td>Reserved</td>
            </tr>
            <tr>
                <td>Reserved</td>
            </tr>
        </tbody>
    </table>
</div>

user3161700 05 янв. 2014, в 03:45

Источник

0

Когда вы говорите: «Я хотел бы добавить название Благотворительности внизу внутри контейнера», я понимаю, что вы хотите, чтобы это происходило динамически ... итак, когда это должно произойти? и откуда эта информация?
Theraot 05 янв. 2014, в 02:39
0

Я бы посоветовал не использовать центральные теги, потому что они устарели, и хотя браузеры могут их поддерживать, они находятся в процессе удаления.
BuddhistBeast 05 янв. 2014, в 02:40
0

может быть, вы хотели бы узнать о html-тегах, поэтому можете создать что-то понятное и эффективное, используя правильные теги и атрибуты webdesign.about.com/od/tables/f/blfaqhtmltable.htm
G-Cyr 05 янв. 2014, в 02:45

Показать ещё 1 комментарий

Теги:

html

css

html-table

1 ответ

Ещё вопросы

Когда вы говорите: «Я хотел бы добавить название Благотворительности внизу внутри контейнера», я понимаю, что вы хотите, чтобы это происходило динамически ... итак, когда это должно произойти? и откуда эта информация?
Я бы посоветовал не использовать центральные теги, потому что они устарели, и хотя браузеры могут их поддерживать, они находятся в процессе удаления.
может быть, вы хотели бы узнать о html-тегах, поэтому можете создать что-то понятное и эффективное, используя правильные теги и атрибуты webdesign.about.com/od/tables/f/blfaqhtmltable.htm

TimSPQR · Answer 1 · 2014-01-05T01-15-00.000Z

Существует так много способов, которыми это может быть обработано... слишком много, чтобы помещать в один пост. Вот лишь некоторые общие идеи. Хотя ваши данные являются "табличными", я не буду фокусироваться на таблицах, но другие варианты - ссылаясь на "старую пилу" - не используйте таблицы для макета, используйте их для табличных данных.

divs, используя классы или псевдоклассы:

<div class='headerdiv'></div>
<div class='donordiv'></div>
<div class='donordiv'></div>
<div class='donordiv'></div>
<div class='donordiv'></div>
<div class='donordiv'></div>
<div class='donordiv'></div>
<div class='footerdiv'></div>

Необязательные списки - стилизация с использованием классов или псевдоклассов.

<ul>
  <li class='headerlist'>
    <ul>
      <li class='donor'>donor1</li>
      <li class='donor'>donor2</li>
      <li class='donor'>donor3</li>
      <li class='donor'>donor4</li>
    </ul>
  </li>
  <li class='footerstuff'>footer stuff</li>
</ul>

Если вам нравятся dls, dts и т.д., Снова стилизуйте классы css или псевдоклассы.

<dl>
  <dt>Title</dt>
    <dd>donor 1</dd>
    <dd>donor 2</dd>
    <dd>donor 3</dd>
    <dd>donor 4</dd>
  <dt>Stuff</dt>
</dl>

И я готов поспорить, что есть много других способов, которые эксперты покажут нам.