サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
買ってよかったもの
unformedbuilding.com
タイトルどおりですが、許可した漢字だけを使うように指摘するtextlint-rule-ja-allowed-kanjiというtextlintルールを作りました。 すでに特定の漢字セットを使うように指摘するtextlintルールはありますが、自分の要望とはちょっと違う感じでした。 たとえば常用漢字以外は必ずエラーになるというものなので、ユーザーが許可する漢字を増やしたり減らしたりできるようにしたかったのです。 また、基本的にはエラーになる漢字でも特定の熟語は許可するようにしたかったというのもあります。 動機もともとはNHK放送文化研究所の『NHK漢字表記辞典』を基準にしたルールがほしかったという事情があります。 「新用字用語辞典の概要まとまる(1) | ことば(放送用語) - ことばの研究 | NHK放送文化研究所」のPDFを見ると分かるように、NHKの基準は常用漢字とは異なっています。 ほ
以前にも少し書いたのですが、ウェブブラウザーで使えるページ内検索による体験が阻害されるのが本当にストレスで、その例を残しておこうと思います。 採用側の気持ちも分かりますので、どうなると皆が幸せになるのか分からないという種類のものなので困ったところです。 省略されたテキストoverflow: hiddenとtext-overflow: ellipsisまたは-webkit-line-clampによってテキストが省略された場合、その省略部分がページ内検索にヒットすると非常に探しづらいです。 特に、グリッドで区切られたアイテムが複数列・複数行で並んでいる際に顕著です。 以前の記事のとおり、わたしはYouTubeでよく遭遇します。 下記のデモは、1000個のアイテムを並べたものです。 このうち、「Red Rose」というワードは12個のアイテムに含まれています。 デモを開いて「Red Rose」で
これは「BEM Advent Calendar 2013」19日目の記事です。 タイトルに書いてある通り、Robert HaritonovによるMCSSのドキュメントを日本語訳しました。 ほぼ同内容のものをプルリクエストしてあるので、そのうち本家でも公開されると思います。 公式ページでも公開されました。 英語版があったので基本的には英語版から日本語訳したのですが、英語版で意味がよく分からない部分があって、そういうのはオリジナルのロシア語版を機械翻訳で英語にして、それを元にしたりしました。ので、英語版からの完全翻訳ではありません。 本当はロシア語できる人がオリジナルのドキュメント群を翻訳したほうがよいと思います。 MCSSは主にCSSの管理方法についての考え方で、読んでいて自分のやり方に一番向いているのではないかと思いました。 そこで、ちゃんと理解しておきたいということもあって翻訳してみまし
毎回設定方法を忘れて検索するのがつらいのでメモしておきます。 C:\Develop以下で構成。XAMPPのドキュメントルートはそのまま、実際に使うのはC:\Develop\www以下にディレクトリ作る。WordPressのルートはC:\Develop\www\wpにする。MySQLのdataもXAMPPとは別ディレクトリのC:\Develop\mysqlに。WordPressのURLはwp.localhostにする。バーチャルホストの設定とか今回はC:\Develop\xamppにインストールする。 インストールが終わったらphp.iniの設定。 mbstring.language = Japanese date.timezone=Asia/Tokyoとりあえずこれだけやって、他は本番用サーバーにあわせる。 参考リンク: php.iniファイルの確認と修正 - XAMPPの使い方 Apac
日本語文中の英数で日本語の文字との間に半角スペースを入れるか入れないかという話があります。検索すると色々議論されていたりして面白いです。 このブログでは場所によって半角スペースを入れたり入れなかったりしていますが(2020年1月追記:現在は入れていません)、『日本語組版処理の要件』に合わせてユーザーエージェントがいい感じに処理してほしいなーとか思います。 そこで「それCSSでできるよ」と言える(ようになるかもしれない)プロパティを紹介してみます。 これがまさに日英数が混在する文章で、英語や数字と日本語の間に4分の1スペースを自動で追加したり、全角括弧で生じる大きなスペースをトリムしたりできるプロパティです。 text-spacingは元々text-trimとtext-autospaceという別々のプロパティを統合したものです。これは2011年9月1日版のチェンジログに載っています。 統合に
次のdiv要素のうち、:empty擬似クラスが適用されるのはどれでしょう。 1. テキストあり <div>(Text)</div> 2. 空 <div></div> 3. 半角スペース1つ <div> </div> 4. 半角スペース2つ <div> </div> 5. 改行 <div> </div> 6. コメント <div><!-- comment --></div> 7. テキストなしで空の子要素を持つ <div><span></span></div>正解は2と6です。 実際の動作はサンプルをどうぞ。 :empty? :empty擬似クラスは「Selectors Level 3」を見ると、次のように書かれています。 The:emptypseudo-class represents an element that has no children at all. In terms of
とりあえず仕様を見てみます。 This property describes the foreground color of an element’s text content. Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification - 14.1 Foreground color: the 'color' propertyThis property describes the foreground color of an element's text content. In addition it is used to provide a potential indirect value (currentColor) for any other properties that accept color value
ボーダーのスタイルをリセットする場合などに使われる指定について。 border: 0とborder: noneどちらを使いますか? ということではなく、この2つはどう違うのか、という話です。 borderプロパティについてですが、これは4つのボーダーの指定をまとめて行うショートハンドプロパティです。 構文としては次のようになります。 (参考:CSS 2.1 Box model, CSS Backgrounds and Borders Module Level 3) // CSS 2.1 [ <border-width> || <border-style> || <'border-top-color'> ] | inherit // CSS Backgrounds and Borders Module Level 3 <border-width> || <border-style> || <
よくあるドロップダウンメニューのアイディアです。 CSS 3D Transformsに対応しているブラウザにはそれを使ったUIを、そうでないブラウザにはシンプルな切り替えを提供します。 ドロップダウンメニューのアイディア CSSのみ補足コメントつきで載せておきます。 .nav a { display: block; padding: 0 0.5em; color: #f6f6f6; line-height: 2; text-decoration: none; } /* ulのスタイルリセット */ .nav ul { margin: 0; padding: 0; list-style: none; } /* clearfix */ .nav > ul:after { display: block; clear: both; content: ""; } /* メニューを横並びに */ .n
CSS Programming Advent Calendar 2012の2日目です。 まだ2日目ですし、あんまりややこしくないものをやろうと思ってストップウォッチを作ってみました。 CSS Stopwatch ダウンロード 右上のボタンでスタート、ストップ、リセットです。 上部中央のランプは色なしがリセット状態、青がスタート(カウント中)、赤が停止中を表します。 左のスイッチでは数字部分のカウントスタイルの変更ができます。これはリセット状態でないと変更できません。 :checked擬似クラス間接兄弟セレクタCSS CountersCSS 3D TransformsCSS AnimationsCSS GradientsRoot emViewport percentage lengthpointer-eventscalc()などを使っています。 IE 10, Firefox(17で確認),
WordPressの「Wiki Page Links」というプラグインを改造していたのですが、そのときのメモです。 このプラグインは[[キーワード]]という書式で固定ページのタイトルに同じものがあれば自動でリンクしてくれるのですが、これの検索範囲を任意の投稿タイプにしたかったのです。 それと、違う書式で(たとえば{{キーワード}}みたいな感じ)で任意のタクソノミーからタームを検索してリンクする、というのもやりたかった。 文中からの検索や置換は元のプラグインのものを流用するとして、問題はキーワードから投稿のURLとタームのURLを探し出すところでした。 // キーワード $link_target_title = html_entity_decode('探したいキーワード', ENT_QUOTES); // リンク先URL $url = null;投稿の場合 // 公開されている投稿タイプ $
次のページ
このページを最初にブックマークしてみませんか?
『Unformed Building』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く