1 1 1............................ 1 2............................ 1 3 HTML5 CSS3................... 2 4........................ 2 2 3 1...............

Similar documents

Microsoft PowerPoint - 08回目.pptx

07_経営論集2010　小松先生.indd

経営論集2011_07_小松先生.indd

HTML5&CSS3 レッスンブック

Web 設計入門

PowerPoint プレゼンテーション

HTMLとメタデータ

27短01研01斉藤.indd

Network Computing の基礎

これわかWord2010_第1部_ indd

パワポカバー入稿用.indd

これでわかるAccess2010

【お試し版】Web制作者のためのCSS設計の教科書（非売品）

インターネットマガジン2004年3月号―INTERNET magazine No.110

World Wide Web =WWW Web ipad Web Web HTML hyper text markup language CSS cascading style sheet Web Web HTML CSS HTML

Wide Scanner TWAIN Source ユーザーズガイド

AccessflÌfl—−ÇŠš1

エクセルカバー入稿用.indd

ホームページ制作スターターズ

ボタンのトランジション 1 トランジションを利用してボタンを作ってみましょうボタンを工夫することでひときわ光る web ページにすることができますもう Illustrator や Photoshop でボタンの画像を作る必要はありません JavaScript でスクリプトを書く必

立ち読みページ

文書構造とスタイル

要素にフォーカスが当たったときは例えば以下のように記述する input:focus{} 疑似要素 p:first-lin{ } 一行目だけ p:first-letter{} 最初の文字だけ要素の前や後に付け加えるには以下のように記述する p:before{content:" 記号や文字 ";}

入門ガイド

6 2 s µ µµµ µµµµ µ µ h µs µ µµµµ µ µ µ s mµµµµµ µµµ µµ µ u m µmµµµµµ µµ µ µ µ µ µ µ µ µ s 1

あいち電子自治体ガイドライン（第1章）

<4D F736F F F696E74202D C835B B E B8CDD8AB B83685D>

EC 千葉のホームページで使用している CSS CSSスタイルシート ( 外部記載 ) /* == 標示枠背景に壁紙設置 ( 全画面共通 )======= */ body { background-ima

InfoPros13_digest.key

Microsoft Word - 教材WebページのHTML5及びCSS3の解説

02›f›æ’»“ì-16.qxd

コンテンツ・プロデュース機能の基盤強化に関する調査研究

コンテンツ・プロデュース機能の

大メニューをマウスカーソルで hover すると半透明の小メニューが上から伸びてきます小メニューを hover するとメニューの背景色とテキストの色が変わります NaviMenuAnime01 の説明 HTML の記述 (NaviMenuAnime01.html) id 属性 menu-box

インターネット社会の発展

コンピュータサイエンス 1. ウェブの基本

第6回　CSS入門（つづき）

本資料ではアメブロのヘッダー画像とメニューバーの設定をご自身で行っていただくためのものです < 目次 > 1. ヘッダー画像の設定方法 1-1: 自分の指定した画像をヘッダー画像に設定方法 1-2: 自分で簡単な

1 1 2 Wiki 2 3 PukiWiki 3 4 PukiWiki 4 1 PukiWiki Basic

メニューのトランジション 1 (text-overflow) トランジションを利用して面白い個性的なメニューを作ってみましょう web ページもぐっと引き立つでしょうここで紹介するメニューも Illustrator や Photoshop でメニューの画像を作る必要はありません J

178 5 I 1 ( ) ( ) ( ) ( ) (1) ( 2 )

生活設計レジメ

44 4 I (1) ( ) (10 15 ) ( 17 ) ( 3 1 ) (2)

平成18年版　男女共同参画白書

padding( パディング ) padding プロパティでボックスの内側の余白を指定しますこの部分の内側には背景 ( 背景色や背景画像 ) を表示できます border( ボーダー ) border プロパティでボックスの境界線を指定しますボーダーには色太さ線の種類を指定できます画像で

サンプル CSS1 入力フィールドの輪郭 (outline) のトランジション入力フィールドをクリックすると変化します InputOutlineTransition の説明 HTML の記述 (InputOutlineTransition.html) id 属性 field の div 要素を作り

子ボックスや孫ボックスなどに position: absolute; と指定するとそれぞれ親ボックスに対する絶対位置で配置できるので親ボックスの上に複数の子ボックスや孫ボックスを重ねて配置することができますトランジションやアニメーションを作成するときに非常に便利なので覚えておきましょう top

■サイトを定義する

CSSNite-LP54-kubo-ito.key

: 1/15( ): HTML web page (2) 1/18( ): (1) 1/25( ): (2) 1

JIS Web Web JIS JIS 5.1.a 5.1.b 5.2.a 5.2.b 5.2.c 5.2.d 5.2.e 5.2.f 5.2.g 5.3.a 5.3.b 5.3.c 5.3.d 5.3.e 5.3.f 5.3.g 5.3.h 5.3.i 5.4.a 5.4.b 5.4.c 5.4.

Web プログラミング 1 HTML+CSS (3) (2 章 ) 2013/5/8( 水 ) 演習室の PC のハードディスクには演習で作成したデータは保管できません各 PC のネットワーク接続ショートカットからメディア情報センターのサーバーにアクセスしてください (Z ドライブとして使用で

Transcription:

1 1 1............................ 1 2............................ 1 3 HTML5 CSS3................... 2 4........................ 2 2 3 1.............................. 3 2........................... 3 3...................... 4 3 5 1.......................... 5 2 HTML5........................... 6 3 CSS3............................. 7 4 HP......................... 12 5.................. 17 4 18 1........................ 18 2.................... 23 3........................... 24 5 24

1 1 HTML HTML CSS HTML CSS HTML5 CSS3 HP 2 HTML5 CSS3 HTML CSS HTML CSS HTML HTML CSS HTML5 CSS3 HTML5 CSS3-1 -

3 HTML5 CSS3 HTML5 HTML4.01 CSS3 CSS2 HTML5 1 HTML 2 HTML HTML5 HTML4.01 CSS 4 2011 HTML5 HTML5 CSS3 HP HTML5 CSS3 HTML5 CSS3 HTML5 CSS3-2 -

2 1 HTML5 CSS3 HTML CSS HTML CSS HP HP HTML5 CSS3 2 HTML CSS HTML4.01 HTML5 HTML5 CSS3 HTML5 HTML5 HTML4.01-3 -

HP CSS3 HTML CSS CSS HTML 3 HTML5 HTML5 HTML5 CSS3 HTML CSS HTML&CSS HTML5&CSS3 2013 HTML5&CSS3 WEB HTML CSS - 4 -

CHAPTER01 CHAPTER08 CHAPTER07 HTML5 CHAPTER08 CSS3 CHAPTER 10 CSS/CSS3 2011 CSS HTML 3 1 5 1 HTML5 CSS3 HP 2 border-radius HTML5 CSS3 HP 3 id #pagenaka float - 5 -

CSS3 CSS Javascript HTML <head> </head> 2 HTML5 3 HTML5 HTML5 3 HTML html body h1 h2 p i HTML5 4 section /article /aside /nav HTML CSS CSS 4-6 -

ii HTML / h1 h6 6 <p> </p> span ul li 5 3 3 3 CSS3 CSS3 CSS3 CSS - 7 -

CSS3 6 1 1 i CSS3 CSS3 / /UI 3 HTML CSS <ul> 3 7 CSS ul.sample1 li, ul.sample2 li, ul.sample3 li text-align:center; margin:10px; 5 HTML CSS HTML 1 HTML HTML CSS 8 ul.sample child, ul.sample child2, ul.sample child3, ul.sample child4, ul.sample child5-8 -

<ul> </ul> margin <li> </li> ul.sample child li, ul.sample child2 li, ul.sample child3 li, ul.sample child4 li, ul.sample child5 li padding / /UI HTML CSS UI 9 ii CSS CSS 4 40px text-shadow 10 border-radius border-radius 2-9 -

11 3 2 3 3 Safari Firefox Safari iii float float float float float float 2 3 CSS float float float float iv / 13-10 -

14 v margin padding CSS margin padding margin padding padding margin 2 margin margin padding margin padding margin margin padding padding 3 HTML CSS vi 1 2 3 HTML - 11 -

CSS 1 2 3 16 1 solid 15px 1 2 3 double dotted border border border 8 17 vii body backgroundcolor background-image background-repeat background-position background-position 18 + + left, center, right top, center, bottom 4 HP HTML5 CSS3-12 -

19 body id #hr 1000px HP 3 HOME BLOG GALLERY MAIL LINK 5 a:hover 970 250px 1 10 border class h2.iro Information Information h1 h2-13 -

MEMO CSS float HP i 20 float CSS3 float ii HTML 21 HTML HP - 14 -

CSS CSS margin iii CSS 22 display:inline; float:left; a display:inline; 1 1 5 HOME CSS CSS3 CSS3 iv HTML 23-15 -

margin a paddding text-decoration padding 24 border-bottom v HTML 2 class.kakomi zentai 25 margin h1 h2 #contents p h1 h2 HTML <span style> </span> h1 h2 CSS 2 class - 16 -

.kakomi zentai width:100%; height:auto; height:auto; 0 overflow:hidden; CSS overflow:scroll; overflow:scroll-y; scrollbar vi padding:15px 0px; display:inline; padding text-decoration:none; a:hover 5 < > < > 1 1-17 -

<ul> </ul> div id <center> HTML5 CSS 1 1 1 1 MENU CSS.space.space2 class.space 80px.space2 40px HTML CSS margin 4 1 6 2-18 -

HTML5 CSS3 HP 6 6 6 6-19 -

HTML5 CSS3 HP MENU MENU transition 1 0.7 6 4 6 6 3-20 -

HTML5 CSS3 HP h2 6 1 1 HTML5 HP 26 CSS3 CSS3 6 6 6-21 -

6 6 6 HTML5 CSS3 6 6 HTML5 CSS3 HTML CSS HTML CSS HP 6 6 HP - 22 -

CSS HP <a href= > </a> NOTFOUND <a href= # > </a> 2 2 1000px 705px 10px HTML5 HP CSS3 id #tall width:1100px; height:100%; 27-23 -

3 HTML CSS HTML CSS HTML HTML5 CSS3 HP HP 5 1 HTML CSS - 24 -

HTML CSS HTML CSS - 25 -

1 http://www.tagindex.com/ 2 http://www.sophiait.com/ 2013 HTML&CSS HTML5&CSS3 2011 10 CSS/CSS3 2006 HTML&CSS HTML http://www.htmq.com/ HTML5 http://html5.imedia-web.net/ - 26 -