2019/2/11 / 最終更新日 : 2019/2/15 admin_design Stylesheet - スタイルシート スタイルシートからブロックの順序を入れ替える cssは編集可能で、htmlソースに手を加えたくない、もしくは手を加えられないような場合って以外とあると思います。 そのような場合にhtmlソースをそのままで、スタイルシートに手を加えることで、ブロックの順序（表示位置） […]
2019/2/6 / 最終更新日 : 2019/2/6 admin_design JavaScript 特定のclassセレクタを持つ要素の親要素にスタイルを適用する 言ってること伝わります？（笑） WordPressだと、function.php にごにょごにょすると、bodyタグのクラスセレクタにページスラッグを追加できたりするので、コンテンツ部分を作ってしまってからでも、各ページ […]
2019/2/2 / 最終更新日 : 2019/2/2 admin_design Stylesheet - スタイルシート before擬似要素で指定した背景画像の位置決め – 行頭マークなどの配置 こんな具合にメニュー項目の左側にアイコンをつけたい。なんて場合が多々ありますが、あとあとのメンテナンスのしやすさや、工数を削減するために、既存サイトのコンテンツを活用しながらデザインリニューアルするために、HTMLに i […]
2018/12/15 / 最終更新日 : 2018/12/15 admin_design Stylesheet - スタイルシート なんだかゆっくりしたいわぁ♨ ゆっくりスクロール ゆっくり色変わり ページトップボタンのついているサイトの中で、ボタンの色がシュッと色が変わって、シャキッとページトップに移動するサイトって少なくないですね。 お硬いサイトやなんかはそれで良いと思うのですが、デザインに凝っているサイトだった […]
2018/11/12 / 最終更新日 : 2018/11/12 admin_design Stylesheet - スタイルシート 疑似要素を利用して融通の利く下線を引く 慣れてしまえば、そういうものだと割り切れるのですが、スタイルシートのボーダーは長さが指定できない。 border-width は指定できるが、そこでいう「幅」はボーダーの幅（長さ）ではなく、ボーダーの太さ（線の高さ）なの […]
2018/9/15 / 最終更新日 : 2018/11/9 admin_design Stylesheet - スタイルシート 要素の最初、最後、偶数、奇数、n番目にスタイルを適用させたーい リスト項目やメニュー項目で、「奇数項目に背景色を」とか「最初だけ左枠線をつけたい」とか、結構あります。 簡単にスタイルシートで指定できますが、簡単に忘れます(；´Д｀) なので、備忘録としてメモメモ 最初の要素 R […]
2018/8/14 / 最終更新日 : 2018/8/14 admin_design Design - デザイン クリッカブルでレスポンシブな日本地図 – Clickable and Responsive Japanese Map クリッカブルな日本地図を描きたい。とき、日本地図の画像を用意して、都道府県の座標を落としていく、イメージマップを使われてきたのが一般的かと思いますが、イマドキ「Japan Map プラグイン」という jQuery プラグ […]
2018/7/21 / 最終更新日 : 2018/7/21 admin_design Stylesheet - スタイルシート 特定のカテゴリーだけカテゴリーウィジェットに表示させない最も簡単な方法 「未分類」とか、見せたくないカテゴリーがあることは多いのだけど、標準のカテゴリーウィジェットを使うと、全部丸見え。いやん 表示、非表示を指定出るプラグインを使用したり、function.php に書き込んでフィルターをか […]
2018/1/7 / 最終更新日 : 2018/1/7 admin_design Stylesheet - スタイルシート display: inline-block の下の隙間がどうしても消せなかった件 ブロック要素を、inline-block にしたら、なぜか下に余白ができてしまった。 margin でも padding でもない。 inline-block を block などにするとそんな余白はできないのに、inl […]
2018/1/2 / 最終更新日 : 2018/1/2 admin_design Stylesheet - スタイルシート IEで max-width が効かない だからIEキライですw クロスブラウザを考えたとき、大抵足手まといになるのはIE。 最も使いづらいブラウザが最もシェアがあるというWindowsの罠ですね。 この「max-width が効かない」にいたっては、もうバグで […]