Quantcast
Channel: 簡単ホームページ作成支援-Detaramehp »覚えておくと便利なhtml・CSS
Browsing all 6 articles
Browse latest View live

Image may be NSFW.
Clik here to view.

htmlで使うclassとidって何?

htmlのコードを確認してみると<body>~</body>内には<● class=”◆”>とか<● id=”◆”>のようなコードがたくさんあります。 今回はこのclassやidの使い方を説明していきます。 classとidって何? 特定の要素に対してclassやidを使いスタイルを適用する場合に使います。...

View Article



Image may be NSFW.
Clik here to view.

カスタマイズする時に理解しておきたいdiv要素

ブログなどのソースを確認してみると、<body>~</body>の中には特に<div ●=”★”>~</div>みたいなコードが沢山あると思います。 この<div>~</div>って書いてある所は一つのブロック(ひとかたまり)にしてるある部分でカスタマイズする時には是非理解しておきたい要素の一つです。 div要素でブロック分け...

View Article

Image may be NSFW.
Clik here to view.

Google Chrome Developer Toolsで要素を確認

各ブラウザにはWeb開発者向けにとっても便利なツールがあります。 Internet Explorerだと開発者ツール、Firefoxだと要素を調査、Safariだと要素の詳細を表示、Google Chromeだと要素を検証などです。 どれも似たような感じなんですが、Google Chromeの要素を検証(Developer Tools)が一番使いやすいような感じなので、Developer...

View Article

Image may be NSFW.
Clik here to view.

Google Chrome Developer ToolsでCSSを確認

前回の記事「Google Chrome Developer Toolsで要素を確認」の後編みたいな感じですが、今回はDeveloper ToolsでCSSを確認する方法を紹介します。 この記事を見る前に「Google Chrome Developer Toolsで要素を確認」 をご覧いただくと分かりやすいと思います。 Google Chrome Developer Tools Google...

View Article

Image may be NSFW.
Clik here to view.

カスタマイズで覚えておきたいCSSのposition

カスタマイズ初心者の方は、この記事を読む前に下記の記事を読まれることをオススメします。 カスタマイズする時に理解しておきたいdiv要素 Google Chrome Developer Toolsで要素を確認 Google Chrome Developer ToolsでCSSを確認 それでは本題のカスタマイズで覚えておきたいCSSのpositionを説明していきます。...

View Article


Image may be NSFW.
Clik here to view.

YouTubeをcssで可変にするトリック

CSS のメディア クエリを使いYouTubeを画面サイズ(PC Tablet smartphone)によって表示サイズを変更するのは難しいです。しかしCSS: Elastic Videosで紹介されているcssで可変にするトリック方法を使うと簡単に画面サイズ(PC Tablet smartphone)によって動画サイズを変更出来ます。 今回はCSS: Elastic...

View Article
Browsing all 6 articles
Browse latest View live




Latest Images