イマジカデジタルスケープ・AfterEffects・Photoshop・HTML・CSS・JavaScript・1日トレーニング Web・動画・映像・ゲーム・DTP・CG・Adobe Creative Cloud・キャリア・就活に
HTMLコーダーからフロントエンドエンジニアにステップするために必要な知識と技術を解説。現場で求められる人材となるためには、何を知っていて、何ができなければいけないのか。Web制作の最先端にいるコーディング会社だからこそ教えられるノウハウが満載。 ■目次: Chapter1 変わっていくWeb製作者の役割と責任 01 これまでの職種定義と作業範囲 02 フロントエンドエンジニアという職種 03 フロントエンドエンジニアに求められる知識と技術 Chapter2 フロントエンドエンジニアとして学ぶべきこと 01 JavaScriptでできること 02 HTML5でできること 03 CSS3でできること 04 スマートフォンサイトの作り方 05 WordPressでできること 06 レスポンシブ・ウェブデザイン 07 ソーシャルメディアと連動したコンテンツ Chapter3 フロントエンドエンジ
<table cellspacing="0" cellpadding="0" class="sample"> <tr><th>タイトル</th><th>巻</th><th>出版社</th><th>作者</th><th>発刊日</th><th>定価</th></tr> <tr><td>月詠 -Moon Phase-</td><td>11</td><td>ワニブックス</td><td>有馬 啓太郎</td><td>2006/03/25</td><td>903円</td></tr> <tr><td>Rozen Maiden</td><td>6</td><td>幻冬舎</td><td>PEACH-PIT</td><td>2006/01/24</td><td>620円</td></tr> <tr><td>涼宮ハルヒの憂鬱</td><td>1</td><td>角川書店</td><td>谷川 流 </t
見やすくクリックしやすい箱形ページ番号 一部のニュース系サイトなどで見かける、箱形のページ移動リンクを作ってみましょう。 ただ数字を並べるだけよりも大きく見えるので、分かりやすくてクリックしやすいリンクになります。 例えば以下のようなものです。 上記では、画像は使っていません。ページ番号はすべてテキスト(文字)です。ですから、大きさの変更が可能です。 ブラウザの設定で文字サイズを変更すると、ページ番号の大きさも変化します。 上記は、ページが10まであって3ページ目が表示されている場合の例です。 「3」の部分だけ色が変わっていてクリックできないのはそのためです。 テキストですから、数字以外も使用可能です。例えば、A・B・C…なども使えます。使ってみた例は下記の通りです。
色指定のしかたの例 すでに style.css に body { margin: 5%; } と書いてあるところで,背景色を銀色に指定したい場合は, body { margin: 5%; background-color: silver; } のように付け加えます。 大見出し(<h1>...</h1>)の文字色を赤にするには body { margin: 5%; background-color: silver; } h1 { color: red; } とします。 これらのスタイル指定は別ファイルで行うのが推奨ですが,次のようにHTMLファイルに直接書き込む簡便な方法もあります。 <h1 style="color:red">ほげほげ</h1> タグの付いていないところの文字色を指定するには,無意味なタグ span を使って,例えば次のようにします。 <p>これは<span style="
2021年1月28日付でW3CのHTML5シリーズはすべて廃止され,1月29日付のHTML Review Draftが新たにW3C Recommendationになりました。これは業界団体WHATWGのHTML Living Standardのこの時点でのスナップショットであり,事実上HTML標準はWHATWGのHTML Living Standardに統合されることになります。このサイトでも今後はHTML5という番号付きの記述をやめて,HTMLに統一していきます。 目次 はじめての「ホームページ」?(前口上) はじめてのHTML アップロード(三重大学での実習専用) はじめてのCSS いろいろなタグ HTMLの色指定 リンク 画像 表 スタイルシート セクションに番号を自動で付ける 二段組もどき 二段組もどき 2 二段組もどき 3 三段組もどき 携帯端末への配慮 ロボットを排除するには
Web ページの透過表示機能などを悪用することで、ユーザに意図しないクリック動作をさせる「クリックジャッキング」と呼ばれる攻撃手法が知られています。この対策のひとつとして、Web サイト側があらかじめHTTP レスポンスヘッダに X-FRAME-OPTIONS ヘッダを含めておき、Web ブラウザがこの値を解釈することにより、クリックジャッキングを防止する手法があります。 Internet Explorer 8 をはじめとして Mozilla Firefox、Apple Safari、Google Chrome、Opera など多くの Web ブラウザの最新版が X-FRAME-OPTIONS ヘッダを認識するようになっています。 Web サイト側で X-FRAME-OPTIONS ヘッダを活用することで、クリックジャッキングへの対応が可能となる環境が整ってきています。ぜひ、Web サイト
この動画は、WordBench東京の勉強会の様子を撮った動画です。 WordPressの勉強会 - 11月26日(土)WordBench東京勉強会 WordPress3.3リリース直前&WordCamp Tokyo 2011前日 http://tokyo.wordbench.org/2011/11/01/study-20111126/ http://atnd.org/events/21616 (3)「『CSSだけでも結構イケル』テーマのカスタマイズとオリジナルテーマ作成への第一歩」by うえぶるじょん PHPがわからなくても「CSSだけでも結構イケル」を合言葉にテーマのカスタマイズ方法を考えます。最後にはちょっぴりオリジナルテーマ作成にも挑戦してみたいと思います。 うえぶるじょん プロフィール フリーでWebなこととかそうでもないこととか。主にHTMLのコーディングやWordPres
■WEBtantオンラインスクール↓ http://www.webtant.net/online/html5css3_/hc01.html 見よう見まねではなく、実習を通じて新しいCSS3プロパティを実装します。 CSS3で追加されたプロパティ、セレクタの中でも実務ですぐに使いたい角丸や各種シャドウなど、実用的なプロパティを実習して習得できます。 ■目次 1章 CSSの概要 2章 CSS3利用の注意点 3章 セレクタ(概要・属性セレクタ) 4章 セレクタ(疑似クラス・その他) 5章 border-radius 6章 text-shadow 7章 box-shadow 8章 border-image 9章 multipul background 10章 linear-gradient 11章 メディ
最近では若者の中でもストレスやイライラを抱えながら日常生活を送っている方が非常に多いのですが、もちろんそのような方が精神的な病気に掛かってしまったり鬱傾向になってしまう事は少なく有りません。 学校や仕事内で精神的にストレスやイライラを抱えてしまい、その事が体内の循環器系の疾患にまで発展する事も多いのです。 中には糖尿病や生活習慣病、更には高血圧と言う重度な病気にまで発展するケースも有るのですが、これらのリスクを解消するためには実はある成分を豊富に摂取する事で改善が見込まれているのです。 その成分こそが、セサミンなのです。 セサミンには糖尿病や生活習慣病、高血圧等の予防を期待できる効果が含まれており、直接的に自律神経に働く作用を持っているのです。 その事からセサミンを毎日摂取し続ける事によって、毎日ストレスやイライラを抱えずに済み、更には精神的な負担を軽減しながら日常生活を過ごす事も可能にな
CSSレイアウト[TIPS] position : absoluteについて 「position : absolute」はpositionプロパティのなかの1つで、ボックス要素を絶対的な位置で配置する。 position:absoluteで指定されたボックスは、他の要素との関係は切り離され別物になる。親ボックス以外の他のボックス要素から影響を一切受けない。 position:absoluteには必ず「親」がいる。これが大事。 親にしたいボックスに「position:static」以外のposition指定をし(たいていはrelativeでOK)、そのなかに子を入れてposition:absolute指定をする。「top」「bottom」「left」「right」の値は、親ボックスからの距離。 親ボックスを指定しなければ「ブラウザウィンドウ」が親になる。 結論から言うと、親ボックスが「ブラウ
第16回(最終回) 最新のデザイン表現を適用する ここまで紹介してきたCSSのレイアウトや装飾テクニックは、現在利用者の多いInternet Explorer 7や8、Safari、FirefoxなどのWebブラウザでほぼ問題なく動作するものでした。本連載の最終回は、未来に向けた準備として現在策定中の「CSS 3」の中からモダンブラウザで既に適用可能なスタイルをいくつか紹介します。 (公開日:2010年4月16日 解説:こもりまさあき) 現在策定中のCSS 3について CSSで指定したスタイル指示は、WebブラウザのCSSサポートの度合いによって適用できるかどうかが異なります。例えば、今現在の主流であるブラウザの多くではCSSレベル2(CSS 2)をサポートしているものがほとんどです(特定のプロパティだけ未サポートも含め)。その一方、現在CSSの次のバージョンにあたるCSSレベル3(CSS
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く