HTMLを実際に書いてみよう!

HTMLとは?

普段よく見るWebサイトの中では、通常のテキストではなく、HTML(Hyper Text Markup Language)というものが使われています。

そして、一緒に使われるのが、CSS(Cascade Style Sheet)というもの。CSSはデザインを決めるために使われます。

 

そんなによく使われるのかー

 

ボタンを置いてみます。

 

実際のHTML/CSSを見てみよう!

それでは、実際のコードのサンプルを見てみましょう!

HTML??

 

実際のHTMLはこんな感じです。

 

デザインの評価はこんなページを作ると良いです

<ul class="nav nav-tabs">
  <li role="presentation" class="active"><a href="#">Home</a></li>
  <li role="presentation"><a href="#">Profile</a></li>
  <li role="presentation"><a href="#">Messages</a></li>
</ul>

 

CSSは??

CSSはこんな感じ!

 

.article h2 {
padding: 0.5em;/*文字周りの余白*/
color: white;/*文字色*/
background: #4790BB;/*背景色*/
border-left: solid 5px #2A5772;/*左線(実線 太さ 色)*/
}

.article h3 {
padding: 0.3em;/*文字周りの余白*/
color: #494949;/*文字色*/
border: initial;
border-left: solid 5px #2A5772;/*左線(実線 太さ 色)*/
padding-left: 12px;
}

HTMLの中のJavaScriptは??

 

実は、プログラムも記載できます。JavaScriptという言語で記載。

<html>
  <head>
    <script type="text/javascript" src=“sample.js"></script>
  </head>
  <body>
  </body>
</html>

コメント