Webサイト専門プログラマの言いたい放題

元システムエンジニアがサイト制作とプログラミングについて好き放題しゃべります。

【スタイルシートで簡単にグラフが描ける方法】

f:id:wp-lesson:20170426200224j:plain

世論調査のようなアンケートページを
作成中の生徒さんから質問がありました。
 
「アンケートの結果をグラフみたいに
 表示したいのですが、できますか?」

 
中級者以上なら、
 
HTML5Canvasタグ
JavaScript

 
この2つを組み合わせれば
グラフが描けることを
ご存知かもしれませんね。
 
しかし、どのみちJavaScript
グラフの座標や長さを計算する
プログラムを書かなければなりませんので、
 
「できればコードを書くのは避けたい」
 
という方にはハードルが
高いかと思います。
 
そこで今日のレッスンでは、
 
『とっても仕組みが簡単なので
 初心者でもすぐ理解できる方法』

 
をお教えしました。
習得時間はたったの30分です。
 
・HTMLタグの基本的な知識
CSSの基本的な知識

 
この2つだけで棒グラフが描けます。
JavaScriptを使う必要はありません。

PR

CODEMYのマンツーマンレッスンでは、WordPress
HTML5やCSS3を基礎からしっかり学びたい方のために、
コース学習の中でカリキュラムをご提案致します。
 
▼無料相談をお気軽にご利用ください。
http://codemy-lesson.office-ing.net/contact
 
━━━━━━━━━━━━━━━━━━
講師が執筆した本が発売されました
━━━━━━━━━━━━━━━━━━
 
WordPressのツボとコツがゼッタイにわかる本』
 
Amazonで概要を見る
http://amzn.to/2nd7Ia5
 
『ホームページ作成のツボとコツがゼッタイにわかる本』
 
Amazonで概要を見る
http://amzn.to/2bXJkbs
 
━━━━━━━━━━━━━━━━━━
CODEMYのオンラインレッスン
━━━━━━━━━━━━━━━━━━
 
【1】自宅でマンツーマンレッスン
http://codemy-lesson.office-ing.net/
知りたいことだけ学べる個人レッスンです。
 
【2】動画と個別添削のプログラミング講座
http://bit.ly/2h7ZeRJ
 
HTML/CSS/JavaScriptの基本が身に付くレッスンです。
↓無料体験はこちら
http://bit.ly/2hw7mIy