css 經典表格-tft每日頭條

css 經典表格

圖文更新时间:2024-11-10 16:48:03

目标

表格邊框合并
表格邊框的間距設置
表格标題位置的設置

表格可以說是網頁必備的元素之一，但是原生的表格樣式都是很醜，列如表格加入邊框的默認情況下，單元格與單元格之間有一定的空隙；設置單元格邊框間距等等，都是可以通過css來設置自己的默認樣式

表格邊框合并

默認情況下，表格有邊框的情況下，内部看似有一層填充物，其實是表格的外邊框和内部單元格的間距。

這層間距是可以通過表格的标簽屬性進行設置，讓它看起來像是合并了一樣，但是這樣的合并并不完美，會得到一個很粗的邊框。

理想中的邊框合并，應該達到exelce表格那樣，是一個細線表格。Css專門有個屬性是為了表格邊框合并服務的。

語法：border-collapse：屬性值

css 經典表格（css基礎篇11--表格樣式）1

屬性值

會發現，通過css控制合并和通過标簽屬性合并的效果都不一樣，通過css控制的效果跟exelce表格一模一樣，屬于細線表格。

css 經典表格（css基礎篇11--表格樣式）2

對比圖

表格邊框間距

如果想自己設置表格邊框的間距，一樣是可以通過css來控制。

語法：border-spacing:像素值;

這個屬性可以設置兩個值。指定了1個像素值時，這個值将作用于橫向和縱向上的間距；當指定了2個length值時，第1個作用于橫向間距，第2個作用于縱向間距。

css 經典表格（css基礎篇11--表格樣式）3

兩個值

css 經典表格（css基礎篇11--表格樣式）4

邊框被拉大

單元格之間的距離也是一樣的。

表格标題位置

表格的标題不一定都是設置在表格的上方，也有可能是設置在下方。

可以使用css來定義表格标題的位置

語法：caption-side:屬性值;

css 經典表格（css基礎篇11--表格樣式）5

屬性值

這樣就可以得到一個倒置标題的表格

css 經典表格（css基礎篇11--表格樣式）6

标題倒置

總結

這些表格樣式屬性可能會有不少人會覺得很陌生，是因為這些樣式屬性都是用來做重置樣式，隻需要寫一次，以後再也不用動它了！

css 經典表格（css基礎篇11--表格樣式）7

總結

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!

查看全部

网友关注

圖文百家姓計簽名寫法
百家姓計簽名寫法?信息化時代，電腦、手機的功能越來越強大，許多要用筆寫的文章、報告、筆記等等都可以用各類輸入（包括錄音轉化）、打印替代除了在校的師生，目前用筆最多的大概隻有個人的簽名了，簽名是向外展現最多的手寫字體如何把自己的名字簽得更好看... 2022-10-15
圖文國外重金屬樂隊介紹
國外重金屬樂隊介紹?，接下來我們就來聊聊關于國外重金屬樂隊介紹?以下内容大家不妨參考一二希望能幫到您!國外重金屬樂隊介紹, 2022-10-28
圖文樂高蝙蝠俠絕版
據外媒報道，當地時間周六--同時還是蝙蝠俠日，樂高宣布推出源自蒂姆·波頓執導的第一部蝙蝠俠電影的新蝙蝠套裝--Batman1989Batwing。Batwing（蝙蝠翼戰鬥機）是蝙蝠俠個人定制的空中戰車。在波頓的電影中，當小醜入侵高譚市20... 2023-01-24
圖文吸水石盆景植物咋樣施肥
說起盆景相信大家都不陌生，有的是用松樹做的，有的是用一些假山做的，那麼我們做的盆景生長環境也是不一樣的，那麼我們吸水石是盆景植物中很常見的，那麼什麼是吸水石呢？小編給大家先科普下呢。吸水石本質是沙積石，所以我們可以得知這種石頭有很好的吸水性... 2022-12-05
圖文道德經真正的智慧
希言自然。故飄風不終朝，驟雨不終日。孰為此者？天地。天地尚不能久，而況於人乎？故從事於道者，同於道；德者，同於德；失者，同於失。同於道者，道亦樂得之；同於德者，德亦樂得之；同於失者，失亦樂得之。信不足焉，有不信焉。——道經·第二十三章1、什... 2022-11-29
圖文孫曉雲老師演講
秋季開學不久孩子們陸續步入學校學習日前中國書協主席、江蘇省書協主席孫曉雲接受了媒體采訪她表示，成長期的教育尤其是幼年教育對孩子的一生十分重要要知道什麼是“美”什麼是承傳早早在幼小心田裡播下種子孫曉雲引導式教育應該從幼年抓起我認為，教育第一課... 2022-11-27
圖文 dota2月夜楓技巧
最近楓哥直播看的多的兄弟肯定知道，OB基地的網和電又開啟了“大姨媽”模式，直播間時不時的就要黑屏一下，一會兒是斷電，一會兒是斷網。本來幾兄弟最近都回歸了正常的DOTA2模式，鲷哥在微博上感慨還是Dota2好玩，輸一盤立馬就想着幹回來；楓哥也... 2023-03-08
圖文如何煮牛腩又爛又好吃
longtimenosee～～最近受相機的影響停更了一陣子（聽我解釋真的不是我主動想停更）停更的日子裡我度日如年分外思念大家于是默默憋了一個大招以此來挽回你們的心試問有誰能拒絕得了一碗炖的軟爛入味的牛腩？如果有，那你一定是看過了我今天的視頻... 2022-12-11
圖文海賊王霍金斯是不是死了
海賊王霍金斯是不是死了?大家好，我是小蜘蛛更加詳細的《海賊王》1011話情報終于迎來了更新，在本話提到基拉要跟霍金斯幹架，那本期的内容就來看看，他們是如何幹架的吧，我來為大家科普一下關于海賊王霍金斯是不是死了?下面希望有你要的答案，我們一起... 2022-10-03
圖文朗讀者經典語錄第一期
從遇見，到陪伴，從選擇禮物，到第一次的眼淚，從告别，到鼓起勇氣繼續前行，從溫暖的家，感受每一次愛的味道，直到有一天，我們才知道什麼是青春。在這滋潤心靈的節目裡，有感動，有感悟，更有感恩...青春不散，朗讀不停！-所有的遇見，都是久别後的重逢... 2022-12-02
圖文最害人的弟子規書籍
“國學源自天地。伏羲仰天俯地而悟易經，屈原漫遊天地而得九歌，竹林七賢隐居山林而通三玄。古之高士，欲有所得，無不與天地相接。”中國曆史悠久，且是世界皆知的禮儀之邦，許多美好的品德，都被先祖記錄在國學之中代代相傳，才成就了一個泱泱大國。詩詞歌賦... 2023-01-05
圖文 ps平面設計入門教程零基礎
很多小夥伴在開始學photoshop的時候，總是遇到各種各樣的問題，不知道跟誰學，也不知道怎麼學，更不知道如何有效率的學。花了很多時間去琢磨和探索，然後在學習的路上發現越走越偏。從安裝到卸載可以不到一個月哈哈哈。能堅持下來的人，往往都是某個... 2022-11-23
圖文蒼蘭訣選項
這部劇剛開播就遭到群嘲，“成人版巴啦啦小魔仙”，“演技尴尬”，"原聲出戲"等等。但随着劇情的推進，誇獎的聲音越來越多，許多觀衆在網絡上玩劇情梗，特效，劇情設定，細節處理等等都是可圈可點，網友更是直呼這部劇高開暴走。可是在完結... 2023-01-08
圖文悲傷的情歌趙佳霖
山上下雨了，滴在泥土上的聲音很清晰。氤氲的江南氣息，是熟悉的味道。暮色散開，雨卻沒有停歇。如今國破山河在，山外的天地間已然換了一幅景象。還未寫下《虞美人·聽雨》的蔣捷望着草廬外陰沉的天空。聽着滴滴答答的雨聲，他想起了以前的事情，端起茶盞，抿... 2023-03-13
圖文甯波四橫五縱快速路目的
甯波四橫五縱快速路目的?來源：【交彙點新聞客戶端】交彙點訊近日，為統籌疫情防控和經濟社會發展，南京市、鎮江市新冠肺炎疫情防控指揮機構協商決定，4月24日起實施甯句區域一體化聯防聯控該措施實施幾天來，成效如何？是否給甯句線上每日通勤往返人員帶... 2022-10-05
圖文清透自然水潤妝容教程
和立體濃豔的歐美妝相比，秧秧一直都覺得日系妝容更适合我們的五官和氣質。總體來說，日系妝容偏自然，幾乎沒有什麼面具感。翻翻日雜我們就會發現，大部分日系妝容都非常透明，别看她們臉上顔色不多，但一套畫下來感覺個個膚色白裡透紅，就像是天生長着嫩豆腐... 2022-12-09
圖文男子組織上海多人轟趴
大多數人到轟趴館内，都是為了休閑放松，唱唱歌、打打遊戲，可是有一夥人，他們到轟趴館後，任何娛樂設施都不用，而是拿出大量手機卡、銀行卡，這樣的異常行為引起了警方的注意。今年年初的一天晚上，一輛白色私家車來到哈爾濱市龍江第一村，執勤民警發現，車... 2022-10-26
圖文經典連環畫橫屏特殊的任務
白樸/原著胡楠/改編謝志高/繪畫1唐高宗儀鳳年間，工部尚書裴行儉的兒子裴少俊前往洛陽辦事，偶遇同是官宦人家的小姐千金，兩人一見鐘情，難舍難分。3嬷嬷見這情景，不忍心道：“就當我不知道，你二人遠走高飛吧！如果日後官人高中再來認親！”第二天，少... 2023-02-16
圖文商鋪土地産權年限到期
作者：于園園姚曉培根據國務院《城鎮國有土地使用權出讓和轉讓暫行條例》第十二條的規定，居住用地土地使用權最高出讓年限為70年，商業用地土地使用權最高出讓年限為40年。但實踐中，存在開發商與購房人将住宅底商買賣合同中的土地使用年限也約定為70年... 2023-01-28
圖文持之以恒海納百川有容乃大
專題為深入貫徹落實把實體經濟做強做優，發揮重大投資項目帶動作用等論述要求，持續助力實體經濟推動産業結構調整優化，構建互惠共赢的銀企合作關系。2020年6月2日，交通銀行廣東省分行與廣東海大集團股份有限公司(以下簡稱：海大集團)舉行主題為“海... 2022-11-07
圖文積家機芯最新消息
[腕表之家鐘表技術]大約從2年前（2020年），積家開始逐步對旗下大師系列、北宸系列，進行機芯升級，提升機芯動力。将以往積家普遍38小時到40小時的機芯動力，提升到70小時動力。解決了過去玩家經常抱怨積家動力偏短的問題。新款北宸萬年曆，是積... 2023-01-22
圖文怎麼才能讓自己口才提升得更快
很多人口才不好，某程度上往往是不懂得如何組織語言去表達自己。而想要提高自己的口才，其中一種十分有效的方式，就是通過複述不同的語言材料，來獲取組織語言的說話經驗。所謂複述，就是用自己的語言，把聽過看過的材料或者别人說過的話，重新組織以後再講述... 2022-12-09
圖文蘇烈的名字該如何起
《以字為名的蘇烈到底是何許人也》大家好我是海哥！前幾天，一個一直在某玩熱門手遊的朋友問我，新出的英雄蘇烈是不是曆史人物？我一聽到這個名字，不由得激動起來，那個小時候狠的牙癢癢，長大了佩服得五體投地的名字可是許久未被他人提到了，我拍着桌子，大... 2023-02-06
圖文暴雪魔獸手遊研發多久
《魔獸》将推出手遊的傳聞由來已久，最初在2017年，看起來到了2022年這個傳聞終于要成真了。暴雪剛剛确認一個新的《魔獸》手遊将在今年發售。在其季度财報上，暴雪說他們計劃在2022年為《魔獸》系列推出實質性新内容，包括《魔獸世界》和《爐石傳... 2023-02-08
圖文天安門廣場國旗是怎麼挂的
伴随着悠揚的歌聲，相信每一個有血性的中國人，都會因國旗的升起而為之自豪。兒時的操場上，奧運會的賽場上、天安門廣場上，每一次國歌響起，都會讓人内心慷慨激昂。國旗作為一個國家名片，是一個國家的象征。每當天安門廣場升國旗的時候，會有很多民衆一早等... 2023-02-21
圖文中考古詩詞默寫備考策略
古詩文默寫1.《觀滄海》中最能表現詩人博大胸襟和豪邁氣魄的詩句是：日月之行，若出其中。星漢燦爛，若出其裡。2.《聞王昌齡左遷龍标遙有此寄》中直接抒發詩人對友人遠谪的關切之情的詩句是：我寄愁心與明月，随君直到夜郎西。3.《次北固山下》抒寫時序... 2022-11-05
圖文瘋狂外星人徐峥演的什麼
瘋狂外星人徐峥演的什麼?2019年春節檔，憑借着“甯浩黃渤沈騰徐峥”的頂級配置，科幻喜劇《瘋狂的外星人》票房破14億，斬獲檔期第二名，我來為大家講解一下關于瘋狂外星人徐峥演的什麼?跟着小編一起來看一看吧!瘋狂外星人徐峥演的什麼2019年春節... 2022-10-16
圖文四月女孩取什麼名字好
四月女孩取什麼名字好?爸爸媽媽總是寄予孩子不同的期望，因此這種期望會蘊含在名字中，那麼選擇一個有詩意寓意好的女寶寶名字，具有詩文的詩情畫意，書香墨氣給人以美不勝收的感受，帶領人進入那古色古香，端莊典雅的意境，如果您正有此需求，可參考如下的有... 2022-10-03
圖文施華洛世奇水晶值得長期持有嗎
據彭博社消息，受新冠疫情及重組計劃的影響，奧地利水晶品牌Swarovski（施華洛世奇）今年業績遭遇重創，預計公司核心的水晶業務全年的銷售額或同比大跌逾30%至20億歐元。為尋求融資，Swarovski正考慮通過創始家族放棄部分股份，以尋求... 2023-03-08
圖文風法100級史詩裝備選擇
昨日國服體驗服天界、魔界服務器均進行了100級的更新，但内容相比前幾次更新區别不大，并且男鬼三覺沒有實裝，目前僅有克倫特商店進行了更新。【克倫特商店】将淨化書和扭轉書進行了官方定價，不過持續時間到6.18也就是說并不是永久更新，可能後續會上... 2022-11-25

tft每日頭條

> 圖文

> css 經典表格

css 經典表格

相关圖文资讯推荐

热门圖文资讯推荐

网友关注