1. 程式人生 > >HTML,CSS ,Javascript的簡單介紹

HTML,CSS ,Javascript的簡單介紹

前端三個基礎HTML,CSS ,Javascript 。

首先需要說一下,這三個的區別和聯絡:
HTML代表著結構,CSS代表著樣式,Javascript代表著行為。

HTML和CSS通過選擇器關聯,常用的選擇器有兩個,一個是class,一個是id。class可以重複使用,而id只能使用一次(因為其唯一性,所以在於後臺互動的時候用id)。

以下是一個套路內容,可以不寫,不是必須的。

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

HTML中呼叫CSS的三種方式:

1.嵌入式


使用HTML的style元素,在文件中定義CSS樣式。

<head>
<style type="text/css"> 
h1{color:red} 
p{color:blue} 
</style> 
</head>

2.內聯式
每一個HTML元素都包含一個style屬性,可以直接定義樣式。該樣式僅能用於該元素的內容,對於另一個同名的元素則不起作用。

<div style="color:#FFF;font-weight:bold;">內聯樣式</div> 

3.外部引用式
一般使用link元素。

<head>
<link rel="stylesheet" href="css的路徑(相對html的路徑)" type="text/css" > </head>

在HTML中呼叫Javascript:

1.呼叫所在檔案

<head> 
<script type="text/javascript" src="jquery.js"> </script>
<script type="text/javascript" src="myjs.js"> </script>  
</head> 

先呼叫jquery庫,再呼叫自己寫的,有先後順序。

2.直接寫在頁面上

<script>
    寫javascript的程式碼
</script>

div標籤:< div >< /div >
是塊,用於佈局,從上往下排洩,一個佔一行。

span標籤:< span>< /span> < span>< /span> 。
同一行中分開,連續的span中間不論隔多少個空格都只識別一個。

form標籤:< form> < input> button </ form>
form為表單,主要用於提交,(涉及MVC----model層,control層,view層之間的交流),其中一般包括< input>輸入的內容和自定義的提交按鈕button。