Question

我创建了一个网站 here ，在Kontakt部分我添加了营业时间，但我无法弄清楚如何对齐它很好，还有其他信息。

所以我只是在那里放PNG来模拟我正在寻找的外观。

尽管如此，我想知道如何正确编码，因为当我在更大的屏幕或平板设备上查看时，它会与支架混在一起，因为它旁边没有支架。

以下代码是左括号中文本所在的代码，它工作正常，但我不知道如何正确编码开放时间。

    <section id="blog-area">
        <div class="container">
            <div class="row text-center inner">
                <div class="col-sm-6">
                    <div class="blog-content"><br><br>

                        <h2 class="feature-content-title green-text">+ 421 903 977 345</h2>

                        <p><strong>Iľja Takács</strong><br><br>

                        iljatakacs@gmail.com<br>
                        facebook @lakovnaturen<br><br>
                        Tureň 390, 903 01 Senec | Areál bývalého PD Tureň</p><br>


                        </div>
                    </div>

链接到png图片：http://testinglakovna.borec.cz/img/otvaraciehodiny.png

Answer 1

我建议你做一张桌子。这样，您可以定义像素的每个宽度，并确保所有内容都与您在网站上显示的方式一致。

我做了一个简单的JSFiddle希望有所帮助。

<table class="tg">
  <tr>
    <td class="day">Po</td>
    <td class="time">09.00</td>
    <td class="sign">-</td>
    <td class="time">20.00</td>
  </tr>
  <tr>
    <td class="day">Ut</td>
    <td class="time">09.00</td>
    <td class="sign">-</td>
    <td class="time">20.00</td>
  </tr>
  <tr>
    <td class="day">St</td>
    <td class="time">09.00</td>
    <td class="sign">-</td>
    <td class="time">20.00</td>
  </tr>
  <tr>
    <td class="day">St</td>
    <td class="time">09.00</td>
    <td class="sign">-</td>
    <td class="time">20.00</td>
  </tr>
  <tr>
    <td class="day">Pia</td>
    <td class="time">09.00</td>
    <td class="sign">-</td>
    <td class="time">20.00</td>
  </tr>
  <tr>
    <td class="day">So</td>
    <td class="time">09.00</td>
    <td class="sign">-</td>
    <td class="time">20.00</td>
  </tr>
  <tr>
    <td class="day">Ne</td>
    <td class="extra" colspan="3">Na objednavku</td>
  </tr>
</table>

Jsfiddle

如何编码开放时间以良好对齐显示？

1 个答案: