• <abbr id="qqgmy"></abbr>
      <menu id="qqgmy"><abbr id="qqgmy"></abbr></menu>
    • <rt id="qqgmy"><code id="qqgmy"></code></rt>
      • 網(wǎng)頁設計中的表標題

        • 2019-05-16 17:06:43
        • 閱讀次數(shù):
        • 作者:盈嵐科技小編
        • 來源:http://www.margaycoffee.com

        顧名思義,表標超是一小段文本,描述了表內(nèi)容的本質(zhì)。因此,對于2003年第4季度的一個股票行情表,表標題元素的內(nèi)容可能讀作“Q4 2003 Stock Performance”,利用屬性caption-side,可以把這個元素放在table之上,也可以放在table的底下,而不論該表標題出現(xiàn)在表結構中的哪個位置(在HTML中,caption元素只能出現(xiàn)在開始table元素的后面,不過其他語言可能有不同的規(guī)則)。

        表標題有點奇怪,至少從視覺上看有些奇怪。網(wǎng)站建設規(guī)范指出,表標題格式化為就好像它是直接放在表框之前(或之后)的一個塊框,只有兩個不同。首先,表標題仍能從表繼承值;其次,用戶代理在考慮如何處理表前面的run-in元素時會忽略表標越框。因此,如果一個run-in元素在表之前,它不會進人表的上標題,也不會進入表中,而是處理為好像其display值為block。

        caption-side

        值:top | bottom

        初始值:top

        應用于:display值為table-caption 的元素

        繼承性:有

        計算值:根據(jù)指定確定

        說明:網(wǎng)站建設中還有值left和right,不過由于缺乏廣泛的支持,這兩個值在CSS2.1中已經(jīng)去掉

        通過一個簡單的例子就可以說明有關表標題表示的大部分重要方面。考慮以下樣式,如圖11-5所示:

        caption {background: gray; margins 1em 0;caption-side: top;}

        table{color: white; background: black; margin: 0.5em 0,"}

        caption元素中的文本從table繼承了color值white,但caption有自己的背景。table 的外邊框邊界和caption的外邊距邊界之間的間隔為1em,因為table的上外邊距與caption的下外邊距合并,見第7章的描述。最后,caption的寬度要基于table元素的內(nèi)容寬度,這是caption的包含塊。如果把caption-side的值改為bottom,會得到同樣的結果,只不過caption將出現(xiàn)在表框的后面,另外將合并caption的上外邊距和table 的下外邊距。

        大多數(shù)情況下,為caption應用樣式非常類似于塊級元素,它們可以有內(nèi)邊距、邊框。背景等。例如,如果網(wǎng)頁設計人員需要改變caption中文本的水平對齊,可以使用屬性text-align。因此,要把上例中的標題右對齊,可以寫作:

        caption (background: gray; margin: 1em 0; caption-side: top; text-align: right;}

        注意:到2006年中期,網(wǎng)頁設計人員為表標題設置樣式還是一個很危險的事情。有些瀏覽器支持表標題的上下外邊距,但有些并不支持,有些瀏覽器會相對于表的寬度計算表標題寬度,而另外一些瀏覽器則用完全不同的方法來計算。把所有這些行為都列出來是沒有意義的,因為可以預見到這個領域的變化很快。之所以在此特別說明,主要是為了讓讀者對可能遇到的問題提前有所認識。

        當前文章標題:網(wǎng)頁設計中的表標題

        當前URL:http://www.margaycoffee.com/news/wzzz/3020.html

        上一篇:網(wǎng)頁設計中的表層

        下一篇:網(wǎng)頁設計中的表單元格邊框

        網(wǎng)站建設、網(wǎng)絡營銷咨詢專線:181-8386-5875(點擊可一鍵撥號)
        在线一区视频二区三区,av无码久久久不卡网站,亚洲国产人成精品,国产成人白丝视频
        • <abbr id="qqgmy"></abbr>
          <menu id="qqgmy"><abbr id="qqgmy"></abbr></menu>
        • <rt id="qqgmy"><code id="qqgmy"></code></rt>