概要 ツイートを埋め込むような web サービスを作る場合、リツイートとイイネのリンクを実装することがあるかもしれません。 そのリンク（正式名称はインテント）を Vue.js で作成する方法です。 実装 リンクの定義です。 // ツイート ID （いわゆる id_str…

長過ぎる文字列に対して、文末に「…」をつけて省略して表示したい時があります。 これをHTMLのtable要素で実現する方法について書きます。 固定幅テーブル まず、行が固定幅で良いのなら以下のように書けます。 table { table-layout: fixed; } td { white-s…

Hamlについて軽く勉強しました。 ※Haml＝HTMLがカンタンに書けるもの。同系統に、jade, slimがあり。 ドットインストールを見て、 dotinstall.com 公式ドキュメントを見たくらい。 haml.info 感想としては、やっぱり今使っているslimの方がいいかなと。 まず…

chuckです。 自分のための個人サイトを作成しているので、作成過程を記録します。 ちなみに、現状↓ http://chuck0523.github.io/front-end-coding/rotateWindow/rotateWindow.html まあ、クリックイベントならスライドできます。 ここにスワイプ動作も付け加…

chuckです。 HTMLとCSSでオシャレなベルト風アイテムを作ってみたいと思います。 ひとまずの完成図はこちら。 こちらをベースにして試行錯誤していこうかなと思います。

chuckです。タイトルはちょっと意味不明かもしれません。 画像で見たほうが早いですね。 要はこれを こうしたいというお話。 つまり、列の枠線としてではなく、列の区切りとしてボーダーをつけたいという使い方ですね。 HTML まずHTML的にはこうです。 gist3…

chuckです。 オシャレなサイトを発見しました。こちらです。 www.startup50.jp こちらのTOPページの背景画像が動いている（ように見える）んですよね。 面白いなーと思ったので、自分なりに再現してみます。

どうも！chuckです。 いきなり私事ですが、最近は転職に興味アリアリですｗ 求人を眺めているとやっぱりフロントエンドエンジニアになりたいな！と思う次第です。 そこで！今回はHTMLを高速で記述できると噂のslimを使ってみたいと思います。

どうも！chuckです。 前回こちらの記事でHTMLのvideoタグについて書きました。 HTML5のvideoタグを試してみるも、敗北する - コンパイラかく語りきchuckwebtips.hatenablog.com まー、使ってみたはいいものの動かないｗ しかし今日はリベンジに成功したので…

どうも！chuckです。 CSSのdisplay（ディスプレイ）プロパティってあるじゃないですか。ブロックレベル要素とかインライン要素とか、そういうやつです(´ω`) 今回、主要なHTMLタグについて、デフォルトでのdisplayの状態をまとめてみましたヽ(=´▽`=)ﾉ

どうも！chuckです。 皆さん、HTML5使ってますか？？当たり前？それともまだ手をつけてない？？ 僕自身、HTML5で使ったことあるのはCanvasくらい。なので、今日はHTML5の中でも気になっていたVideoタグを試してみましたヽ(=´▽`=)ﾉ