HTML の a 要素に target=”_blank” をつけるのはもうやめよう
HTML の a 要素に target 属性をつけて、リンク先の文書をどこで開くのかを指定できますね。 デフォルトは _self で、元のドキュメントと同じフレーム。無指定だとこれになるので、わざわざこれを書くことは少ないと思うけど。 一番よく使うのは target="_blank" じゃないでしょうか。リンク先のドキュメントを新しいタブやウィンドウで開くやつですね。 これ、以前はよくつかってました。ルールとして サイト内リンクは target 指定なし 外部サイトへのリンクは target="_blank" というのが多かったんじゃないかな。 でも最近、これはもうリンク先がどこであろうと指定しない方がいいんじゃないか、と思ってます。 もちろんサイトによってそれぞれ使いわけはあると思うんだけど、少なくともほとんどの手元のサイトの場合はいらない。 target="_blank" を使ってきた
Font Size Idea: Px At The Root, Rem For Components, Em For Text Elements | CSS-Tricks
Font Size Idea: px at the Root, rem for Components, em for Text Elements Me, for the last year or so: “rem‘s are so cool! I’m gonna size everything with them, that way I can adjust the font-size on the root element and everything will scale with it!” It was a nice dream. And it wasn’t a disaster. That’s what I’m doing right now here on CSS-Tricks and this is how it plays out in a very simple scena
文字が動く！ MARQUEEを効果的に使ったウェブサイトまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
みなさん、こんにちは。菊池です。今年でインターネット歴15年になりました。 ずっと流行っては消えていくウェブサイトのトレンドを見てきたわけですが、今回は最近……どころか10年以上見ていない「MARQUEE」を使っているサイトをまとめてみました。 MARQUEEとは？ HTMLタグの一つ。このタグを指定すれば、ウェブサイト上で文章を右から左へとスクロールさせることができる。そのため、視点の位置を移動させずに読むことができて、とても便利でスタイリッシュ。かつモダーン。 しかし、悲しい哉、今ではほとんど使われていないロストテクノロジーの一種。 それではMARQUEEの世界を探訪してみましょう。 速読ウェブサービス https://hitode909.appspot.com/speed_reading/ 宮沢賢治の短編小説「ポラーノの広場」の冒頭が高速で流れてくるウェブサイト。何と今月公開されたば
HTML5 で追加された属性の中からマイナーっぽいのを紹介してみる
HTML5 から追加された属性の中から、まだあまり広く使われてなさそうな属性さんたちに日の目を見て頂くための紹介記事を書いてみようかと思います。 この記事は、HTML5 Advent Calendar 2013、11日目の記事です。 去年の HTML5 Advent Calendar 2012 では、Microdata 関連の記事を書いたんですが、今年も登録してみたものの、見事にネタが無いのでどうしようかなと...... ということで、HTML5 から追加された属性 （要素じゃなく属性の方） の中から、まだあまり広く使われてなさそうな属性さんたちに日の目を見て頂くための紹介記事を書いてみようかと思います。 ちなみに、「あまり広く使われていなさそうな」 は完全に私の独断と偏見ですのでよろしくお願いします。 placeholder 属性 最初なのであまりマイナーっぽくないやつから。その名の通り
<html>,<body>は要らない？Googleが推奨するHTMLファイルの記法 - Qiita
つまりhtml, head, bodyなどの使い慣れたお決まりのタグは今更書くまでもないということ。 参考: どのようなタグが省略可能か http://www.whatwg.org/specs/web-apps/current-work/multipage/syntax.html#syntax-tag-omission P.S. STORYS.JP、 coincheck などのサービスを運営、開発しています。興味のある方はぜひ 和田まで連絡を！ Register as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back useful informationYou can use dark themeWhat you can
[Å] 書いたあとからHTMLタグで囲めるDraftPadのアシスト公開
[Å] 書いたあとからHTMLタグで囲めるDraftPadのアシスト公開
![[Å] 書いたあとからHTMLタグで囲めるDraftPadのアシスト公開](https://cdn-ak-scissors.b.st-hatena.com/image/square/7c472e067c00db6bf8e92c310e119db272804077/height=288;version=1;width=512/http%3A%2F%2Fwebmemo.biz%2Fwp-content%2Fuploads%2F20121213-2242531.jpg)
HTML5とCSS3のオンラインサンプルが良い感じ | Web活メモ帳
Web上で見て触れる、HTML5とCSS3のオンラインサンプルがすごく良かったのでご紹介。 HTML5 & CSS3 Tools and Tutorials パラメータを自由に触りながら、実際に動作している様子をリアルタイムにプレビューする事が可能です。 以下に使っている様子を載せてみます。 ↑設定した項目を選択します。 まずはBox Propertiesを試してみます。 ↑設定可能な項目が表示されます。 パラメータをグリグリいじれちゃいます。 ↑設定した内容はリアルタイムにプレビュー表示されました。 使用するコードと対応するブラウザも教えてくれます。 違うものも試してみましょう。 ↑Videoを設定している所です。 動画ファイルはURLを直接入力して設定します。 ↑プレビューです。 細かいブラウザのバージョンも教えてくれました。 他にも設定可能な項目はたくさんありました。 興味のある方は
スマートフォンサイト制作にdisplay:tableとdisplay:table-cellが便利！
2012/10/18：画像に一部誤りがありましたので、修正致しました。 こんにちは。 スマートフォンサイト制作案件が増えて楽しいKanaです。 スマートフォンサイトのコーディングは、古いブラウザ (ie6とかie6とかie6とか！)のことを考えるとできなかったCSSの指定ができるので、とても楽しいですね！ スマートフォンサイトの制作はリキッドレイアウト。 ナビゲーションの数が奇数！…均等にするにはwidth指定面倒だな〜画像とテキストを横に並べなきゃ…縦方向の揃え位置を指定できたらいいのに…。と思ったことはありませんか？ そんな時の強い味方がdisplay:tableと、display:table-cellです。 スマートフォンサイトのコーディングを頻繁にされている方は、既にご存知かもしれませんが、これからスマートフォンサイト作るよ！という方には、とても便利だと思います！ display:
Google HTML/CSS Style Guide
Revision 2.1 This style guide contains many details that are initially hidden from view. They are marked by the triangle icon, which you see here on your left. Click it now. You should see “Hooray” appear below. Hooray! Now you know you can expand points to get more details. Alternatively, there’s a “toggle all” at the top of this document. This document defines formatting and style rules for HTML
existing rel values - Microformats Wiki
This page contains tables of known HTML rel values from specifications, formats, proposals, brainstorms, and non-trivial POSH usage in the wild. In addition, dropped and rejected values are listed at the end for comprehensiveness. usage: see how is 'rel' used. Regarding rev, see: should 'rev' even be used. This page is also the official rel registry (WHATWG HTML (original link), W3C HTML5). Add ne
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【CSS】ul,olのリストを横並びにするときにfloatじゃなくてdisplay:inline-blockを使う方法 - ディレイマニア
http://www.hp-stylelink.com/news/2013/07/20130716.php