HTMLやCSSの知識は不要！ 積み木感覚でレイアウトを組み立てるだけで、簡単にBootstrapのページ作成ができてしまうウェブサービスを紹介します。 ほんの数分で、今時のかっこいいページが本当に簡単にできちゃいます！
1. HTML/CSS 〜 「お・も・て・な・し」をブラウザにも 〜 TAKEHARU IGARI Front-end Engineer / Evangelist ブラウザにやさしい <html5j パフォーマンス部 第⼀回勉強会 /> 2. プロフィール • TAKEHARU IGARI 猪狩 丈治 - 所属 • 株式会社 Lei Hauʼoli フロントエンドエンジニア - 略歴 • 表⽰速度、保守性、ブランディング、SEOを考慮したフロントエンドエンジニアリングを得意とし、 現在、各ナショナルクライアントのプロジェクトや、株式会社リクルートの主要サービスのフロント エンド開発に携わり、⾼速化コンサルティングも⾏う。 - 執筆 • 技術評論社「WEB+DB PRESS」 • Vol.66 〜我流コードからの卒業HTML構造化指南 • Vol.59 〜「Webサイト超⾼速化実況中継 ──
こんにちは! ヨス（プロフィールはこちら）です。 WEB制作に関わっている方にはお馴染みのタグと言えば<br>、もしくは<br />タグです。5年前ぐらい前までは何かとお世話になっていたこのタグですが、徐々に嫌われるようになってきました。 というわけで今回は、<br />を使わないほうが良い理由です。 改行タグは他のデバイスで見るとズレるから使うな! なぜ<br />を使わない方が良いのでしょうか?その理由はこの一言で終わってしまうのですが、そうなんです。 ほかのデバイスで見たときにズレる! WEBコンテンツをWindowsとかMacで書くと、普通はPC用のモニターに合わせて改行をすると思います。文字の横幅って、スマホだと大分狭いんですよね。スマホどころか、デスクトップでもモニターが違えば改行の位置もずれちゃうんです。 なので、デバイスの多様化に対応するために「改行タグ」は一切使わなくなっ
![[HTML] BRタグは使うな! 私が「改行」を一切使わなくなった1つの理由 | ヨッセンス](https://cdn-ak-scissors.b.st-hatena.com/image/square/07e900bad8412bab6de332583864865d583b9a42/height=288;version=1;width=512/https%3A%2F%2Ffanyv88.com%3A443%2Fhttps%2Fyossense.com%2Fwp-content%2Fuploads%2Fbr-do-not-use-250.jpg)
画像の準備 とりあえずアニメーションさせる画像を用意します。ループさせるので継ぎ目のない画像を作成した方がいいかもです。 作成したら「bg.png」という名前で保存します。 今回はこんな画像を作成してみました。 デザインがしょぼいとか言ってはいけない！ html+cssでバックグランドに画像を配置 html+cssは特別なことはなく普通に作ります。 画像はbodyの「background」で配置してみました。 html <body> <div id="container"> <h1>jQueryでバックグラウンドを無限ループ</h1> <p> このページはjQueryでバックグランド画像をアニメーションループさせるサンプルページです。 </p> </div> </body> css body{ background: #A6E9FF url(bg.png) repeat-x; margin
HTML/CSS/JavaScriptを駆使した画像の重ね方
いわゆる、かずー氏クラスタアイコンの作り方Way to cover an image with another image サンプルページへはこちらのリンクまたは画像をクリック！ 私@wada811のアイコンが、 他の人のかずー氏クラスタアイコンのように 全体サイズになっていないのは 重ねるのが簡単すぎて 重ねたい画像が同じサイズの特殊事例にしか 対応できないように見えるため あえて小さく重ねています。 方法としては6つもありました！ 正直自分でも驚きです。 background: absolute; で絶対配置で重ねる方法 背景画像を指定した div に img タグを置いて重ねる方法 2の方法を擬似要素 :after の content: url() で重ねる方法 3の方法で content ではなく背景画像に指定して重ねる方法 CSS3 の複数画像の背景指定で重ねる方法 Canvas
コーディング規約を作ろうコーディング規約やスタイルガイドは、HTMLやCSSのマークアップや、各種プログラミング言語の書き方をまとめたものです。コーディングスタンダードやコーディングガイドラインとも呼ばれますね。コーディング規約を決めていなかったり、あいまいにしたまま進めていくと、書式が統一されていないため、コードを追加すればするほどゴチャゴチャしたコードになりがちです。チームでコーディングしていくならなおさら。今回チーム用のコーディング規約を見直すことになったので、その時感じた抑えておくべきポイントをまとめてみます。 コーディング規約に含むべき項目ディレクトリー階層ファイルを保存するフォルダーの階層や、そのフォルダーの名前を決めておきます。画像を格納しているフォルダーを例にあげても、「image」「images」「img」などの名前が考えられます。人によってつけるフォルダーの名前が変わっ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
