【HTML5・CSS3】おしゃれなテーブルデザインのサンプルソース5点 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
地味な離島ライター内藤です。普段はコーダーとして仕事をしていますが、たまにはデザイナーさんのように人の目に触れる仕事もしてみたい！ そこで本日は、日々の業務で見かけてこれは使えるぞと思ったtableを、独自に再構築してソースコードを公開しようと思います。 table作成時に参考になるサイト 本題に入る、その前に。XPの公式サポートも終了し、HTML5＋CSS3の普及が進んでいます。今更ながら、この技術でどんなtableが実現できるのか、とてもわかりやすく説明されていたサイトをまずご紹介します。 table専門参考ページ4選 table専門の参考ページを4つほど選んでみました。 CSS3を使って美しく装飾されたテーブルの作り方｜Webpark CSS3でのtableの作り方を、見た目とソースから解説してあります。 テーブル｜CSSデザイン｜スタイルシート（CSS）｜PHP & JavaScr
知らないといつまでたってもHTMLとCSSが理解できない暗黙の仕様4つ
調べる。 備忘録としてwebやデザインについて調べたり 新しく知ったことなどを書き残していくカテゴリです。
HTMLテーブルをリッチに便利な機能を追加する·Grid MOONGIFT
GridはHTMLテーブルにソートやヘッダ固定、行選択と言った機能を追加するJavaScriptライブラリです。 業務システムを作っていると必ず発生するのがテーブルでの一覧表です。WebでExcelレベルのことは実現できませんが、リッチな表としてGridを使ってみるのは良さそうです。 デモです。 必要な場所だけチェックしてハイライトできます。 横スクロールしても左側の列はそのままです。 数値のオーダーも適切に動きます。 縦スクロールしてもヘッダー部はそのままです。 カラム幅の変更もできます。 GridはIE7以上、Google Chrome/Firefox/Safari/Operaに対応しています。jQueryやMootoolsと一緒に使うこともできます。機能はヘッダー、フッター、カラムの固定化やカラムのリサイズ、カラムのソート、行の選択などになります。データフォーマットはJSONの他、X
UIWebViewでつくるUI
This document discusses using UIWebView in iOS applications. It covers loading HTML and CSS content into UIWebView, handling touch events, supporting Retina displays, and using CSS effects like gradients, shadows, animations and rounded corners. It also provides resources for learning more about web development for iOS like the Safari Developer Center documentation.Read less
Home
Just make cool sh** stuff. Current Stack – Back to basics. Going “build–step free” for a handcrafted experience. Feb 23 2024 @joshua Yearning for a simpler time – the artisanal web. Websites are too BIG, too complicated, and too hard. Reactive programing is conceptually easy to grasp – but the distance between the end result vs. frameworks & tooling is too far apart. I get it, the web is a compl
MobTabGen
MobTabGen ヘルプ MobTabGen (Mobile Table Generator)は、スマートフォンでブログを書いている人向けに作られたツールです。 PCのWebブラウザでも動作します。 基本的な使い方 行を改行で、列を「|」（パイプ）で区切ったテキストを上のテキストエリアに入力すると、リアルタイムでTableのhtmlソースコードが生成できます。 セルを空白にしたい場合は、「|」（パイプ）だけ記入します。例: 先頭が空白「|hoge|hoge」、2番目が空白「hoge||hoge」、末尾が空白「hoge|hoge|」 セルを横に連結したい セルを横に連結したい場合（colspan）は、セルの内容の後に「~」（チルダ）を連結したい数だけ追記します。 例: 20cm~~~ セルを縦に連結したい セルを縦に連結したい場合（rowspan）は、セルの内容の後に「_」（アンダーバー）
脱GitHub初心者を目指す人のREADMEマークダウン使いこなし術 | ゆっくりと…
README がキチッと書かれているプロジェクトって、どんなに小さくても立派に見えますよネ。 GitHub の場合、大抵はマークダウン記法で書かれた README.md とか README.markdown とかいう名前のファイルが、HTML に変換 （マークアップ） されて表示されていることはご存知でしょう。 マークダウン記法自体はとても簡単なのですが、GitHub では GitHub Flavored Markdown （略して GFM） という GitHub 用にアレンジされたマークダウン・エンジンが採用されていて、一般のマークダウン・エディタでチェックしてからコミットしても、意図通りの見た目にならないことが多々あります。私 （もちろん GitHub 初心者です！） の場合、README ファイルだけで10回以上もコミットしてしまいました。「マークアップ （レンダリング） を気にして
PHPアプリからCSSセレクタでHTML／XML文書を解析する - Zend_Dom -
はじめに 本連載では、PHP上で動作するアプリケーションフレームワーク「Zend Framework」について紹介していきます。今回はDOMドキュメントを扱うためのモジュールであるZend_Domについて紹介します。 現在、Zend_DomにはZend_Dom_Queryクラスが実装されています。このZend_Dom_Queryを利用すれば、XML文書やHTML文書の内容に対してCSSセレクタやXPathでアクセスすることができます。例えば外部サービスから提供されたHTML文書を解析して、マッシュアップに利用したい場合などに威力を発揮します。 対象読者 PHPの基本構文は一通り理解しているが、フレームワークを利用したことはないという方を対象としています。 必要な環境 Zend FrameworkはPHP 5.1.4以降とWebサーバがインストールされている環境で利用可能です。本稿ではWeb
HTMLのインデントをキレイにしてくれるWEBサービス「Ham Cutlet」
HTMLを書いていて、心がけていても時間に追われているとだんだんと乱れてきて、インデントされていなかったり、ルールがバラバラなソースになってしまうなんてことも多いと思いますが、今日紹介するのはHTMLのインデントをキレイにしてくれるWEBサービス「Ham Cutlet」です。 利用方法は非常に簡単で、WEB上で、HTMLをコピペ、その後設置されている「COOK!ボタン」をクリック。これだけです。 詳しくは以下 このサービスにはHamlというHTML/XHTMLを生成するためのマークアップ言語が使われているみたいで、「HTML → 一旦hamlにする → HTMLに戻す」という流れでインデントの整頓を実現しているとのこと。hamlに興味のある方は「日本Hamlの会」もどうぞ。 実際、インデントが無くても問題なく、動作しますし、整ったからと言ってオモテ面に影響があるわけでないのですが、メンテナ
携帯サイト（html）の制作に入る前に確認しておきたいチェック項目 │ これからゆっくり考L +α
「デザインは素敵なんだけど、携帯でこれはちょっとできないなー」とか、「無理ではないけどできれば避けておいた方がいいよなー」っていうデザインがあがってくることが多い今日この頃。 モバイルコーディングをやり慣れている人じゃないとモバイルでできることできないこと、cssを使わないと実現できないこと、table使わないと実現できないこと、などが分かりにくいと思うので当然だとは思うのですが。 ですが、知っているのと知らないのとでは工数がかなり違ってきます。 一旦デザインして、コーダーにそれを見せて「ココとココとココは実現不可能。やり直してください。」で差し戻され、デザインをやり直してってなると、デザインも2度手間、デザインをチェックして無理な項目を洗い出すコーダーにも余計な手間がかかります。 今回洗いだした項目は、なんせ自分がコーダーなので、コーダーがデザインファイルをもらった時にバーッと見てチェッ
HTML5サンプル集 - 株式会社あゆた
このページでは、HTML5のAPIを利用した簡単なサンプルを公開しています。 このサンプルの多くは、弊社技術顧問の白石氏がマイコミジャーナルに寄稿した記事で使用したプログラムを元に、多少の改変を加えたものです。 どれも非常にシンプルなものではありますが、HTML5の各機能を試すためのとっかかりとしてご利用頂けると思います。 白石氏が寄稿した記事はこちらになります。これらの記事と合わせてサンプルをご利用になって頂く事で、各機能の理解がより深まることでしょう。 詳解! HTML 5と関連APIの最新動向 - 新タグ&API編 詳解! HTML 5と関連APIの最新動向 - Webアプリ開発編 アプリケーションキャッシュのサンプル (ダウンロード) (Safari4、Google Chrome3で動作確認済み。Firefoxだと、アプリケーションキャッシュのイベントが正しく発生せず、動作しないと
MOONGIFT: » 手軽なXSS対策「HTML Purifier」:オープンソースを毎日紹介
XSS対策は非常に煩わしい。ただHTMLタグを全て禁止すれば良いのだろうか。それはユーザビリティを著しく下げてしまうし、何よりHTMLタグ以外のスタイルシートのプロパティを使ったものも存在する。 ユーザビリティを維持しつつ、危険をなくしていきたければ、このライブラリが便利だ。 今回紹介するオープンソース・ソフトウェアはHTML Purifier、HTMLを解析し、危険なコードを回避してくれるフィルターだ。 HTML PurifierはPHP4または5で動作するライブラリだ。解析元のHTMLを渡せば、クリーンナップされたHTMLが返却されてくる。ドキュメントタイプも、HTML4.01（Strict/Transitional）、XHTML1.0（Strict/Transitional）、XHTML1.1に対応している。 文字コードもUTF-8に対応しているので安心だ。日本語が絡んだ余計な情報が
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Chico UI
今風のウェブを作る際に使えるCSS/HTML/JSのテンプレ『Easy Front-End Framework』 - 100SHIKI 〜 世界のアイデアを日替わりで
IDEA * IDEA