専修大学 ネットワーク情報学部 2012年度 特殊演習 (Webプログラミング) 新居雅行 / Masayuki Nii
2 HTML/CSS 2012 4 23 1
2-1 Web 2
2-1 80 SSL Apache WindowsIIS Internet Information Server HTTP HyperText Transfer Protocol HTML HTML 1 1 [ URI] [POST] GET POST URL URILocater Identifier 3
URI URI index.html index.htm index.php 4
2-2 HTML CSS 5
2-2 HTML HyperText Markup Language HTML.html.htm MIME text/html CSS Cascading Style Sheet HTML HTML.css MIME text/css < =" "...> </ > HTML < =" "... /> &#x[16 ]; &#[10 ]; < 6
HTML HEAD BODY TITLE SCRIPT STYLE LINK META P H1 H7 DIV SPAN TABLE TBODY THEAD TFOOT TR TH TD UL OL LI FORM INPUT SELECT OPTION TEXTAREA IMG CANVAS VIDEO AUDIO 7
2-3 CSS 8
(A) style (B) STYLE (C) LINK : ; (A) <span style="background-color: red;"> STYLE { : ;... } div { background-color: red; } (C) <link rel="stylesheet" type="text/css" href=" " media="all" /> (C) <meta http-equiv="content-script-type" content="text/css" /> (A) (B) (C) class.class id #id id 1id : [ ] P {... } P DIV.copyright {... }DIVclass copyright DIV#main {... } id main DIV 1.column {... } class column TABLE.simplelist TD.blank {... } class simplelist TABLE class blank TD A:visited {... } A P[title="reference"] {... } P title reference P[title*="reference"] {... } P title reference 9
% px 1 =1px em 1 1em ex x1ex ptpc in cm mm red white 16 RGB #FFFFFF RGB rgb(255,255,255) rgb(100%,100%,100%) url("http://msyk.net/images/ pic.png") all screen print LINKmedia @import @url(...) print; @import @media print {...} 10
2-4 [ ] 11
2-4 HTML Dreamweaver HTML Dreamweaver HTML 3 1 2 4 12
5 2 3 1 13
5 6 4 14
2 1 15
4 3 5 16
4 1 2 3 5 6 1 2 3 17
6 4 5 18
2-5 19
2-5 ch02.html H2 1 2 3 4 1 20