PowerShell PowerShellスクリプトに引数を渡す方法
CSS
CSSCSSでアニメーションanimation-delayを指定してアニメーション開始時間を指定する方法
CSSでアニメーションanimation-delayを指定してアニメーション開始時間を指定する方法animation-delay: 5s;と指定すると、5秒後にアニメーションが開始されます。2個目のliタグにだけanimation-dela...
CSSCSSでanimation-durationを指定してアニメーション時間を指定する方法
CSSでanimation-durationを指定してアニメーション時間を指定する方法「CSSで@keyframesでアニメーションしてみる」で、liタグをアニメーションしてみましたが、複数のliタグに対して異なる時間を指定して、アニメーシ...
CSSCSSで@keyframesでアニメーションしてみる
CSSで@keyframesでアニメーションしてみる@keyframesっていうのを使うとアニメーションができてデザイナブルなページが作成できたりします。ここを参考にしました。body { background: #00CCFF;} @-...
CSSハイブリッド開発（HTML5+CSS3）のログイン情報の保持方法について
ハイブリッド開発（HTML5+CSS3）のログイン情報の保持方法についてハイブリッド開発でログイン情報をどう保持するかをちょっと考えていたのですが、セッションとかクッキーとかは古いかと思っていて、HTML5から追加されたsessionStr...
CSSHTML5のラジオボタンをCSSでdisplay:none;すると、An invalid form control with name=’～’ is not focusable.エラー
HTML5のラジオボタンをCSSでdisplay:none;すると、An invalid form control with name='～' is not focusable.エラー
CSSCSSでtableの行ごと、列ごとにスタイルをあてる方法
CSSでtableの行ごと、列ごとにスタイルをあてる方法CSS3から疑似クラスを使用すれば1行目のスタイル、2行目のスタイルというように行ごと、また、列ごとにスタイルをあてることができるようです。列ごとにスタイルをあてるにはtr:nth-o...
CSSIE11でプリンタの縦横の印刷に合わせてCSSを変更する方法
IE11でプリンタの縦横の印刷に合わせてCSSを変更する方法IE11でプリンタの縦印刷の場合はあるスタイルシートを当て、横印刷の場合は別のスタイルシートを当てたい場合、メディアクエリをふたつに分けて実現する事ができます。印刷時にプリンタ自体...
CSSCSSでul,liのドットを消す方法
CSSでul,liのドットを消す方法ul,liでナビゲーションを作る際にドットを消したい場合があります。普通に書くとドットが表示されます。 aaa bbb上記のCSSです。<ul><li>aaa</li><li>bbb</li>...
CSSCSSのposition:flex;でスクロールしても表示される領域を確保する方法
CSSのposition:flex;でスクロールしても表示される領域を確保する方法CSSでpositionプロパティは理解するのが難しいです。position:flex;とすることによってヘッダ領域に表示することができます。画面が縦長でスク...
CSSCSSのflex-directionでフッターを固定する方法
CSSのflex-directionでフッターを固定する方法flex-directionプロパティを使用すると、子要素を左から右、右から左、上から下、下から上といったように表示することができるようになります。フレックスアイテム1フレックスア...
CSSCSSのoverflowの使い方
CSSのoverflowの使い方overflowを使用するとブロック要素から表示しきれない部分をどうするかを指定できます。デフォルトは、overflow: visible;で、表示しきれない部分ははみ出しても表示することになります。サンプル...
CSSCSSのrgbaで透過する方法とopacityとの違い
CSSのrgbaで透過する方法とopacityとの違いrgbaを使うと透過させる事ができます。opacityと同じく0〜1が範囲となります。0.70.50.1cssです。<div style="width: 100px; height: 1...
CSSCSSのborder-radiusの使い方
CSSのborder-radiusの使い方border-radiusを使えば要素の四隅を丸めることができます。「CSSのdivタグで円を描く方法」では四隅を全て50%とすることにより円を描きました。border-radiusでは、左上、右上...
CSSCSSのspanタグで三角を描く方法
CSSのspanタグで三角を描く方法CSSのspanタグで三角を描いてみます。borderを使用します。cssです。.danraku{ border-top: 10px solid transparent; border-right: ...
CSSCSSのdivタグで円を描く方法
CSSのdivタグで円を描く方法DIVタグなどのブロック要素でborder-radiusを50%で指定すれば、円を描けることが出来ます。前提として、widthとheightは同じであることとなります。でないと楕円形になってしまいます。上記は...
CSSCSSのdisplayプロパティを使用してブロック要素を横に並べる
CSSのdisplayプロパティを使用してブロック要素を横に並べるdivタグにblock:inline-block;を指定して横に並べてみます。cssです。.danraku{ border:1px solid; display:inli...
CSSCSSのドット(.)とシャープ(#)の違い
CSSのドット(.)とシャープ(#)の違いcssファイルに.aaaという表記と#aaaという表記方法があります。これはhtmlファイル側のid属性の場合は#、class属性の場合は.となります。#の方をidセレクタ、.の方をclassセレク...
CSSCSSのpaddingはmarginの逆でborderの内側みたい
CSSのpaddingはmarginの逆でborderの内側みたいmarginはブロック要素の外側であることがわかりました。逆にpaddingを指定すると、ボーダーの内側に対して余白を指定するようです。例えばdivタグ内のコンテンツ位置が変...
CSS今更ながらCSSのmarginについて勉強してみました
今更ながらCSSのmarginについて勉強してみましたmarginが良く分かっていなかったので実際に試してみました。わかりやすいようにbodyとdivタグにborderをつけています。marginはmargin:上 右 下 左というように指...
CSSCSSで印刷時の縦横を指定する方法
CSSで印刷時の縦横を指定する方法CSSで印刷時の縦横を指定できたら素晴らしいですね。なんとChromeならその指定できるようです。残念ながらIE11では効かなかったです。以下、横指定です。@media print { size: A4 ...
ChromeChromeでmedia printを確認・デバッグする方法
Chromeでmedia printを確認・デバッグする方法
CSSCSSのtext-indentを使用して段落の１行目をインデントする方法
CSSのtext-indentを使用して段落の１行目をインデントする方法最近デザインに目覚めはじめました@takahashiです。CSSで文章の１行目を全角１文字分インデントしたい、といった場合はtext-indentを使えば一発で可能です...
CSSCSSのdisplay:inlineとdisplay:flexの違い
CSSのdisplay:inlineとdisplay:flexの違いdisplay:inlineはブロック要素（divタグなど）を横並びに表示することができます。それに対し、display:flexは、親要素の下の子要素の高さなどを統一する...
CSSHTMLでIMEを無効にする方法
HTMLでIMEを無効にする方法Chromeでは無理でしたが、IE11ではスタイルシートで無効にすることができました。<html><body><div> TEL: <input type="text" style="ime-mode:di...