前端學習之路-CSS介紹，Html介紹，JavaScript介紹

時間 2019-11-13

標籤前端學習之路 css 介紹 html javascript 欄目 CSS 简体版

原文原文鏈接

CSS介紹

學前端必備掌握CSS樣式，css爲層疊樣式表，用來定義頁面的顯示效果，增強用戶的體驗樂趣，那麼如何用css到html中呢？javascript

style屬性方式

利用標籤中的style屬性來改變顯示樣式css

<p style="background-color: #FFF000">
 p標籤
</p>

在head中加入style標籤html

<head>
 <style type=」text/css」>
  p { color: #FFF000;}
 </style>
</head>

連接方式前端

<link rel="stylesheet" type="text/css" href="head.css" media="screen" />

總結CSS

選擇器名稱 {
屬性名：屬性值；
…….
}java

屬性與屬性之間用分號隔開
屬性與屬性值用冒號鏈接數組

選擇器

class選擇器
id選擇器

. class
# id瀏覽器

Html

html爲超文本標記語言，經過標籤來定義的語言，代碼不用區分大小寫。安全

頭標籤函數

<head></head>
<title>：指定瀏覽器中標題欄顯示的內容。
<meta>：網頁的描述信息。

在標籤中經常使用：

字體學習

<font size=5 color=red>
標題標籤：<h1><h2>…..<h6>

列表

<dl>
 <dt>名稱</dt>
  <dd>Tom</dd>
 <dt>名稱</dt>
  <dd>Tom</dd>
</dl>

<ol> <ul> <li>

圖像

圖像標籤：<img>
圖像地圖：<map>

表格

表格標籤：<table>
標題<caption> 表頭<th> 行<tr> 單元格<td>

<table border="1" width=」100%」>
    <caption>表格標題</caption>
    <tr algin=」center」>
        <th>姓名</th>
        <th>年齡</th>
    </tr>
    <tr algin=」center」>
        <td>dashucoding</td>
        <td>10</td>
    </tr>
</table>

超連接

超連接<a href=」」>

定位標記<a href=」#標記」>

表單

文本框 text
密碼框 password
單選框 radio
複選框 checkbox
提交按鈕 submit
重置按鈕 reset
按鈕 button
圖像 image

JavaScript介紹

JavaScript是基於對象和事件驅動的腳本語言，爲html提供信息的動態交互，安全性高，跨平臺性強。JS是基於對象，且是弱類型。

引入：

將JavaScript腳本代碼嵌入到HTML文檔中

<script language="javascript" type="text/javascript">
    document.write("歡迎來到JavaScript世界！");
</script>

<script language="javascript" src="javascript.js"></script>

<input type="button" name="mybtn" value="僞URL引入" onclick="javascript:alert('鼠標單擊！')"> 
<script language="javascript" type="text/javascript">
function clickme()
{
    alert("鼠標單擊！");
}
</script>

<form name="myform">
   <input type="button" name="mybtn" value="按鈕" onclick="clickme()">
</form>

腳本代碼的位置

在<head></head>標記對之間放置
在<body></body>標記對之間放置

變量

變量名以字母或下劃線（"_"）開頭
變量能夠包含數字、從 A 至 Z 的大小寫字母
JavaScript區分大小寫

變量的聲明和賦值

定義變量：var name;
賦值：name = dashucoding;

常量

整型
浮點型
字符串型
數據類型
弱類型，區分大小寫

數值型

整型、浮點型
字符串型
單引號或雙引號引發來
布爾型
true, false
Null、undefined

運算符

算術運算符

+、-、 * 、 / 、%、++、--

比較運算符

==、!=、>、>=、<、<=

邏輯運算符

&&、||、！

條件運算符

？：

函數

function  函數名(參數...){
    執行語句；
    return 返回值；
}

數組

var arr = new Array();

for(var x=0; x<arr.length; x++){
    alert(arr[x]);
}

循環語句

for語句
while語句
for…in語句
中斷循環語句

for(初始化;  條件;  增量){
    語句;
}

while(條件){                                  
    語句;             
}

for(變量  in  對象){
    語句;
}

結語

本文主要講解 前端學習之路-CSS介紹，Html介紹，JavaScript介紹
下面我將繼續對Java、 Android中的其餘知識深刻講解，有興趣能夠繼續關注
小禮物走一走 or 點贊

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。