好看的table css樣式

阿新 • • 發佈：2019-01-14

漂亮的table表格樣式css原始碼漂亮的table表格樣式css原始碼

<head>
    <title></title>
    <style type="text/css">
        table
        {
            border-collapse: collapse;
            margin: 0 auto;
            text-align: center;
        }
        table td, table th
        {
            border: 1px solid #cad9ea;
            color: #666;
            height: 30px;
        }
        table thead th
        {
            background-color: #CCE8EB;
            width: 100px;
        }
        table tr:nth-child(odd)
        {
            background: #fff;
        }
        table tr:nth-child(even)
        {
            background: #F5FAFA;
        }
    </style>
</head>
<body>
    <table width="90%" class="table">
        <caption>
            <h2>
                車間能源消耗比例</h2>
        </caption>
        <thead>
            <tr>
                <th>
                    車間
                </th>
                <th>
                    產量
                </th>
                <th>
                    電量
                </th>
                <th>
                    單耗
                </th>
            </tr>
        </thead>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
        <tr>
            <td>
                109
            </td>
            <td>
                13
            </td>
            <td>
                1.34
            </td>
            <td>
                213
            </td>
        </tr>
    </table>
</body>
</html>

好看的table css樣式

漂亮的table表格樣式css原始碼漂亮的table表格樣式css原始碼<head> <title></title> <style type="text/css"> table {

一些好看的css樣式

最近看了了一本書叫《css揭祕》，裡面的內容讓我有種css原來能這樣玩的感覺，哈哈哈。在這裡跟大家分享一部分裡面的樣式，有興趣的可以去看看。這本書有電子版。先看看效果圖：那個螞蟻行軍框是可以動的，有趣html程式碼，想要看那個css樣式就用對應的className<di

好看的CSS——Table樣式表

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"utf-8" /> <title>壞狼安全網-漂亮CSS

如何給table的指定td進行css樣式改變

背景 ble 背景色 blog css code -c div pre td:nth-child(3){background-color:#000; color:#fff;}/*把第3個td的背景設為黑色*/ :nth-child()不止可以給table指定樣式 p標簽

製作好看又非常簡單CSS樣式的顏色塊

首先，在html建立一個div塊 html檔案如下 <div class="color-lump"></div>我現在想要的是一個高80px，寬80px，背景色是綠色（#33cd5f）的顏色塊，於是 CSS檔案內容如下 .color-lump{

table裡的cellSpacing用css樣式代替方法

我們做WEB程式開發過程中,經常會為了Table中的cellSpacing,cellpadding等樣式的設定發愁,經常沒有辦法可想了,就會直接在Table中設定cellSpacing,cellpadding了,這樣以後要改頁面風格時,或做多主題風格時,就會發現改起來是多麼的

html網頁什麼樣的字型最好看，css設定各種中文字型樣式程式碼

css程式碼如下: { font-family:"Microsoft YaHei",微軟雅黑,"MicrosoftJhengHei",華文細黑,STHeiti,MingLiu } 加上中文名“微軟

table藉助css樣式美化例子-新增員工資訊

html——table標籤及其css樣式

<table border="1" width="400px" height="200px"> <caption>完整table</caption> //標題

asp.net 修改嵌在table中的gridview的css樣式（範例）

#gridview1tr th { font-family:宋體; font-size:10pt; padding:0px 1px 0px 1px;

css樣式之display屬性----table和block的區別

所有主流瀏覽器都支援 display 屬性。註釋：如果規定了 !DOCTYPE，則 Internet Explorer 8 （以及更高版本）支援屬性值 "inline-table"、"run-in"、"table"、"table-caption"、"table-cell

【.NET】table標籤+網頁與css樣式的結合使用

Table table標籤就是建立一個表格，tr代表行，th代表列的表頭，td代表列 <table class="m_table"> <tr>

CSS樣式命名規則

blog 背景是個保持 log 類型小寫字母模塊前綴命名一直是個讓我頭痛的問題，特別是那些看上去差不多的模塊，所以就得想辦法啦，我總結了下面的方法，雖然還在試驗中。希望對大家有幫助。歡迎大家提出改進的意見。具體如下：要註意的內容：一，命名所選用的單詞應選擇不

每天一個JavaScript實例-展示設置和獲取CSS樣式設置

width func height nts style scrip meta on() 屬性 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" conte

css 樣式小竅門

blue head 消失技術 log pad ul li -h img css 樣式小竅門 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF

css樣式總結

images 固定超出顯示總結 ellipsis flow lips inpu 文本較多時，只顯示n行多余的用…代替（以下代碼直接在less中封裝好的） @num---想要顯示的行數 .font-hide(@num){ word-break: break-al

CSS樣式的優先級

多重使用判斷優先情況瀏覽器根據優先級原則當一個標簽擁有多重樣式，根據以下規則渲染： 1、相同權值情況下，CSS樣式的優先級——就近原則（離被設置元素越近優先級別越高）：內聯樣式>內部樣式>外部樣式 2、權值不同時，瀏覽器是根據權值來判斷使用哪

Vue.js 控制css樣式

bsp script pkg ott bottom cnblogs pre blog span <script src="https://unpkg.com/vue/dist/vue.js"></script> <style type="te

從零開始學習html（十五）css樣式設置小技巧——下

right ron pos 瀏覽器 spl pan esc 插入 ccf 六、垂直居中-父元素高度確定的單行文本 1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta charset="

css樣式重置

單元素中文表單元 mat cursor pac sci ural att /* 清除內外邊距 */ body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 結構元素 */ dl,

好看的table css樣式

相關推薦