web前段學習2016.6.6

時間 2019-11-18

標籤 web 前段學習 2016.6.6 欄目 HTML 简体版

原文原文鏈接

目前上網的方式：
手機
平板
電腦
移動端：智能手機、平板
PC：電腦、筆記本
運行在移動端的東西：APP
ios：object-c
android：java
pc端的東西：桌面應用程序 c++javascript

咱們上網的方式都是經過瀏覽器打開地址來進行上網css

前端是作網頁開發的，也能作app開發，跨平臺html

前端是作能看得見摸得着的東西前端

常見的系統：
ios:
android:
windowsPhone:java

windows
Mac OS Xlinux

linux
...android

------------------------------------------------
前端之網頁開發ios

網頁開發：前端開發+後臺開發c++

前端：呈現數據
後臺：管理數據windows

html:網頁的內容、網頁結構---結構層
css:負責網頁的樣式---表現層
javascript：是一種專爲網頁交互的腳本語言---行爲層

HTML:超文本標記語言
目前最新版本爲HTML5，用得最普遍的是HTML4

------------------------------------------------
如何來編輯HTML？
用記事本編輯--->修改後綴名(擴展名)--->用瀏覽器運行

瀏覽器

瀏覽器內核：渲染引擎、javascript解析引擎

渲染引擎:主要是用來渲染HTML、CSS
javascript解析引擎:專門用來解析javascript

瀏覽器：
Firefox(火狐)---Gecho
IE（Internet Explorer）---Trident
Chrome(谷歌)---Webkit
Safari(蘋果)---Webkit
Opera(歐朋)---Presto/Blink

HTML文檔結構
<html>
<head>
<title></title>
</head>
<body>
主要戰場
</body>
</html>

一張網頁裏面只有一對html標籤、head標籤、body標籤、title標籤
------------------------------------------------
HTML的語法

html標籤（標記）

單標記 <tag/>

雙標記 <tag></tag>

html的屬性

<tag 屬性名1="屬性值1" 屬性名2="屬性值2" ...>---起始標記（標籤）
內容
</tag>---結束標記（標籤）

<耳朵寬度="250cm" 高度="500cm"></耳朵>

HTML的注意事項
1 必需要符合基本語法
2 必需要定義文檔類型
<!DOCTYPE html>
DOCTYPE：document type

<body></body>
background='圖片路徑'---表示背景圖片
圖片：.jpg .png(透明圖片) .gif(動態圖)。。。

路徑---
絕對路徑：相對於磁盤的路徑，物理路徑
相對路徑：文件相對於網頁源文件的位置
同級關係：直接引用文件名
上一級關係：../圖片名
下一級關係：文件夾名/圖片名
-------------------------------
一文本格式標籤
換行標籤
 
特殊字符標籤
< < （left）
> > (right)
  空格
" "
© 版權號

計算機的單位
基本單位:字節(B) 一個字符佔一個字節，一個漢字佔兩個字節
最小單位：位(bit)
1B=8bit
1kb(千字節)=1024B
1MB(兆字節)=1024kb

標題標籤
<hn></hn>，n:1---6,逐級變小
<h1></h1>
特色：字體加粗，自動換行

段落標籤

特色：自動換行
屬性：
align="left/right/center",水平對齊方式

預編譯標籤
<pre></pre>
特色：原樣輸出，自動換行

水平分割線標籤
<hr/>
屬性：
color="顏色"
size="5px/5%",設置水平分割線的粗細
width="50px/50%"，設置水平分割線的寬度
align="left(居左)/right(居右)/center(居中)",水平對齊方式
特色：自動換行

二字符格式標籤---不換行
----文本加粗
----文本傾斜
----下劃線
<s></s>----刪除線
---字體變小

---字體標籤
屬性：
size=n,n:1----7,逐級變大，改變字體大小
color="顏色"，改變字體顏色
face="黑體"，設置字體類型，默認爲宋體

圖片標籤<img/>屬性：src="路徑"，設置圖片路徑width="100px",設置圖片的寬度height="100px"，設置圖片的高度title="相關提示信息",設置鼠標懸停時顯示的文字描述alt="相關提示信息"

相關標籤/搜索

每日一句

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