html5報表
㈠ 有什麼html5圖表效果比較好的圖表工具么
可以用FineReport。FineReport的圖表就是html5圖表技術實現的，圖表功能比較強大，參數傳遞靈活，回且有移動版，最關鍵的答是，完全符合樓主的開發量少的要求！剛剛特地去官網確認了一下，FineReport的基本理念就是零代碼。其實嚴格來說，FineReport是一款專門做報表的工具，但報表中一般圖、表共存，所以FineReport的圖和表的功能都比較強了~
㈡ html5怎麼製作漂亮的餅狀 報表
利用canvas可以製作餅狀 報表等，需要學習HTML5/CSS3/Javascript等知識，如果學習可以看下這方面的視頻教程。
如是用作項目，可直接用現成插件，如網路echarts等
㈢ html5 怎麼寫如下表格。tr分上下兩欄這種。
<html>
<body>
<tablewidth="100%"border="1">
<tr>
<tdrowspan="2">序號</td>
<tdrowspan="2">項目名抄稱</td>
<tdrowspan="2">單位</td>
<tdcolspan="3">預算<tr><td>型號</td><td>數量</td><td>單位</td></tr></td>
</tr>
</table>
</body>
</html>
這里不止跨行還要跨列
㈣ html5表格
給你寫了個簡單的課程表樣式的表格
看一下
<style type="text/css">
table { border-collapse:collapse;text-align:center; vertical-align:middle;}
table tr{ height:25px;}
table td{ width:100px;}
.bg1{ background:#ccc;}
table tr:hover{ background:#09C;}
.bg2{ background:#999;}
.t1,.t2,.t3,.t4,.b1,.b2,.b3,.b4,.tab{ display:block; overflow:hidden;}
.t1,.t2,.t3,.b1,.b2,.b3{ height:1px;}
.t2,.t3,.t4,.b2,.b3,.b4,.tab{ border-left:2px solid #f6f; border-right:2px solid #f6f;}
.t1,.b1{ margin:0 5px; background: #F6F;}
.t2,.b2{ margin:0 3px; border-width:2px;}
.t3,.b3{ margin:0 2px;}
.t4,.b4{ height:2px; margin:0 1px;}
.tab{ height:130px; background:#F7F8F9;}
.tab_width{ width:700px; margin:0 auto; cursor:pointer;}
</style>
<div class="tab_width">
<b class="t1"></b><b class="t2"></b><b class="t3"></b><b class="t4"></b>
<div class="tab">
<table>
<tr>
<td>星期一</td>
<td>星期二</td>
<td>星期三</td>
<td>星期四</td>
<td>星期五</td>
<td>星期六</td>
<td>星期日</td>
</tr>
<tr class="bg1">
<td>國學</td>
<td>數學</td>
<td>英語</td>
<td>多媒體</td>
<td>體育</td>
<td>毛概</td>
<td>實驗</td>
</tr>
<tr class="bg2">
<td>國學</td>
<td>數學</td>
<td>英語</td>
<td>多媒體</td>
<td>體育</td>
<td>毛概</td>
<td>實驗</td>
</tr>
<tr class="bg1">
<td>國學</td>
<td>數學</td>
<td>英語</td>
<td>多媒體</td>
<td>體育</td>
<td>毛概</td>
<td>實驗</td>
</tr>
<tr class="bg2">
<td>國學</td>
<td>數學</td>
<td>英語</td>
<td>多媒體</td>
<td>體育</td>
<td>毛概</td>
<td>實驗</td>
</tr>
</table>
</div>
<b class="b4"></b><b class="b3"></b><b class="b2"></b><b class="b1"></b>
</div>
提問者評價
謝謝了···
㈤ HTML5中如何繪制圖表
圖表的背景一般是精心設計的它有一定的梯度、網格線、號碼標簽和月份名稱等等，如果直接通過JavaScript進行繪制可能需數十行或上百行的代碼。但是如果我們直接通過Canvas直接創建一個背景圖。我們只需要在其他的軟體如PS上繪制好一個背景圖，然後載入到Canvas上就可以了。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>繪制圖表</title>
</head>
<body>
<div id="result-stub" class="well hidden">
<canvas id="canvas" width="345" height="345">
<p>你的瀏覽器不支持canvas元素</p>
</canvas>
</div>
<script>
// 1、要繪制圖表首先我們要獲取到canvas對象以及具有圖表背景的圖片對象。
var
canvas = document.getElementById('canvas'),
context = null;
context = canvas.getContext('2d');
var img = new Image();
img.src ='chart-background.png';//這里是一張具有圖表背景的圖片
// 2、繪制一個具有圖表背景的圖片後再根據要繪制的曲線圖各個點在canvas是中的坐標繪制直線。
img.onload = function() {
//繪制圖片
context.drawImage(img, 0, 0);
//繪制直線
context.beginPath();
context.moveTo(70, 105);
context.lineTo(105, 132);
context.lineTo(142, 250);
context.lineTo(176, 175);
context.lineTo(212, 145);
context.lineTo(245, 197);
context.lineTo(280, 90);
context.stroke();
}
</script>
<script src="jquery.js"></script>
</body>
</html>
3、本示例的最終繪制效果如下：這樣一個曲線圖表就繪制出來的，其他的圖表也可以用類似的方法進行繪制。
這些都是有關於HTML5新特性的一些應用。給你推薦一個教程網站秒秒學，該網站上有關於HTML5新特性的講解。
㈥ html做個表格代碼
html做個表格的步驟如下：
1、首先新建一個html，點擊<body></body>中間，先填入表格內容；
㈦ 目前在做HTML5，報表控制項暫時選為HighCharts（圖形界面比較好），不知道有沒有比這更好的報表控制項
嗯，報表控制項與圖表控制項還是不一樣的。
但是你以加了個「圖形界面比較好」，比較費解。我估計你的意思還是圖表控制項。
然後你也沒有講明白有啥條件限制，我估計你是JavaScript 圖表插件，好吧。
好的插件有很多。以下有10個非常酷的JavaScript圖表庫，有簡單的也有復雜的，以滿足不同的需求。
個人還是很推薦highcharts的，RGraph很炫，
1. Cubism.js
一個基於D3.js的插件，可以實時顯示時間序列。D3.js是一個針對HTML和SVG的JavaScript可視化庫。
2. RGraph
一個HTML5 JavaScript圖表庫，支持20多種不同類型的圖表。
3. Cytoscape Web
一個開源的圖形可視化庫，基於jQuery編寫。
4. sigma.js
一個開源的輕量級JavaScript庫，使用HTML canvas元素來繪制圖形。
5. Morris.js
一個小巧的、效果漂亮的JavaScript庫，用於可視化時間序列數據。
6. Timeplot
基於DHTML的AJAX部件，用於繪制時間序列，並在上面疊加基於時間的事件。
7. Dracula
一套用於顯示和設計互動式圖表的工具，包含了各種不同的演算法。無需Flash、Java和其他插件。
8. gRaphael
一個開源的JavaScript圖表庫，基於Raphael（拉斐爾）JavaScript庫。
9. gvChart
一個jQuery插件，使用谷歌的Charts API以及HTML <table>標記中的數據，來創建互動式、可視化的圖表。
10. jQuery Highcharts Table
簡易，漂亮，該插件可以將HTML表格中的數據自動轉換成圖表，也可以抓取excel，連資料庫也沒有問題。
㈧ html5，table表格
你好！
<style>
table{
font-family:arial,宋體,sans-serif;
border-spacing:0;
border-collapse:collapse;
}
tbody{
display:table-row-group;
vertical-align:middle;
border-color:inherit;
}
td,
th{
display:table-cell;
vertical-align:inherit;
}
tableth,
tabletd{
padding:2px10px;
font-size:12px;
line-height:22px;
height:22px;
border:1pxsolid#e6e6e6;
}
tableth{
border-bottom:1pxsolid#e6e6e6;
text-align:left;
font-weight:700;
height:23px;
background-color:#f8f8f8;
}
table.table-view{
margin:5px0;
border-collapse:collapse;
word-wrap:break-word;
word-break:break-all;
font-size:12px;
line-height:22px;
color:#000;
}
caption{
display:table-caption;
text-align:-webkit-center;
}
tablecaption{
font-weight:700;
padding:10px0;
padding:8px09px;
font-size:14px;
}
tablea{
color:#136ec2;
text-decoration:none;
}
</style>
<tablelog-set-param="table_view"class="table-viewlog-set-param">
<caption>金滿貫</caption>
<tbody>
<tr>
<thheight="0"align="left">
<divclass="para"label-mole="para">網球獎項</div>
<divclass="para"label-mole="para">（英文）</div>
</th>
<thheight="0"align="left">
<divclass="para"label-mole="para">網球獎項</div>
<divclass="para"label-mole="para">（中文）</div>
</th>
<th>分類</th>
<thheight="0"align="left">信息</th>
</tr>
<tr>
<tdwidth="100"height="0"align="left"valign="center"rowspan="2"><b>GoldenSlam</b></td>
<tdwidth="87"height="0"align="left"valign="center"rowspan="2">
<divclass="para"label-mole="para"><atarget="_blank"href="/item/%E9%87%91%E6%BB%A1%E8%B4%AF"><b>金滿貫</b></a></div>
<divclass="para"label-mole="para"><b>★★★★</b></div>
</td>
<tdwidth="91"align="left"valign="center">年度金滿貫</td>
<tdvalign="top"align="left"width="354">
<divclass="para"label-mole="para">（年度金滿貫：是指一位選手在一個賽季里（一年）同時獲得所有四大滿貫賽事的冠軍和<atarget="_blank"href="/item/%E5%A4%8F%E5%AD%A3%E5%A5%A5%E6%9E%97%E5%8C%B9%E5%85%8B%E8%BF%90%E5%8A%A8%E4%BC%9A">夏季奧林匹克運動會</a>網球項目金牌。）</div>
</td>
</tr>
<tr>
<tdwidth="91"align="left"valign="center">職業金滿貫</td>
<tdwidth="354"align="left"valign="center">（職業金滿貫：是指一位選手在職業生涯中非連續奪得所有四大滿貫賽事的冠軍和<atarget="_blank"href="/item/%E5%A4%8F%E5%AD%A3%E5%A5%A5%E6%9E%97%E5%8C%B9%E5%85%8B%E8%BF%90%E5%8A%A8%E4%BC%9A">夏季奧林匹克運動會</a>網球項目金牌。）</td>
</tr>
</tbody>
</table>
希望對你有幫助！
㈨ HTML5 table 表格如何做
Bootstrap 提供了一套響應式、移動設備優先的流式網格系統，隨著屏幕或視口（viewport）尺寸的增加，系統會自動分為最多12列。
你分的網格錯誤了，每一行最多有12列
希望對你有幫助，望點贊！
㈩ html5怎麼做圖表
highcharts 有很多各種表格樣式，復制出來稍微修改下就可以了