web 應用程式開發原理二

2021-07-13 17:00:12 字數 2152 閱讀 9647

###css層疊樣式表

它是用於定義html元素的顯示形式,是一種格式化網頁內容的技術

###新增樣式表的方式

1. 內聯式:直接在元素中加入style屬性width:300px;height:200px">

2. 嵌入式:書寫style標籤,在標籤中指明樣式。可以用於網頁中的不同元素

3. 外聯式:將樣式規則書寫到檔案中,可以用於不同的網頁,重用度最好。

層疊樣式表的含義:如果有多個規則來描述同乙個元素,那麼會根據樣式表的優先順序,

來決定最終顯示什麼樣式

對於匯入css方式的優先順序:內聯式》嵌入式》外聯式 

###css選擇器

元素選擇器div:利用元素的標籤名稱作用選擇範圍。div{}表示所有的div元素均採用該樣式

h1,h2{}表示所有的h1標籤和h2標籤均採用該樣式

類選擇器 .:利用元素的class屬性來引入類選擇器的樣式。可以用於多種元素。同一種元素

也可以選擇性使用

.mm{}

該div採用mm類選擇器定義的樣式

id選擇器 #:讓擁有該id屬性的元素採用該樣式

#p1{}  id號為p1的元素採用該樣式

包含選擇器 :元素內的子元素採用該樣式

#mydiv span{}  id號為mydiv元素中

所有的span標籤採用該樣式

div.aa{}表示所有的div中,class屬性為aaa的元素採用該樣式

萬用字元 *:所有的元素均採用該樣式。

#onediv *{}表示id為onediv中,所有的元素均採用該樣式。

偽類選擇器:執行完某個動作的元素採用該樣式。

#data tr:hover{}  表示滑鼠懸停在id為打他下的tr元素是,採用該樣式

###css屬性單位

顏色單位:使用0-255之間的整數值來設定。如color:rgb(128,0,128)

使用十六進製制陣列定義顏色,如#fc0eab;

為顏色取名:aqua,black,blue,fuchsia,gray,green等,

布局屬性:margin屬性

1.水平盒子的間距為兩個盒子間距的和

2.垂直盒子的間距為兩個盒子間距的較大值

3.margin值可以設定為負值

padding屬性:

1. padding屬性用來描述盒模型的邊框和內容之間插入多少空間

2. margin是當前元素和border的距離;padding是內容和border的距離

3. margin是對外的,padding是對內的

4. margin只對塊級元素有效。padding對所有元素都有效

###盒子模型

1. 內容(content):元素中的內容

2. 外邊框(margin):代表 元素外邊的空間,這個控制項將元素相互分開

3. 邊框(border):位於元素的邊距內和元素的邊框外之間的可配置的線

4. 內邊框(padding):元素內容和元素邊框之間的空間 

盒子模型均可以用「上右下左」方式設定。如果僅給出兩個或三個值,那麼缺失邊的屬性值取與對邊相同的值

盒子之間的關係:

1. 所謂標準流,指在不使用其他與排列和定位相關的特殊css規則時,各種元素的排列規則

2. 1文字元素按照從上到下、從左到右的格式布局

3. 2塊級元素按照從上到下依次排列

4. 3內嵌元素按照從左到右依次排列

display:none和visibility:hidden的區別

1. 這兩個樣式都可以隱藏元素

2. display:none元素看不見,同時元素不占用位置

3. visibility:hidden元素看不見,但元素會占用位置

4. word-break:break-all;超出部分的文字自動換行

####內嵌元素和塊級元素的互相轉換

內嵌元素--->塊級元素     display:block

塊級元素--->內嵌元素     float:left

###css優先順序

1. !important可以改變css選擇器的優先順序。加上乙個「!important」就優先於正常的css規則

2. div{

background=color:

blue !important;

}adasd

結果div顏色為藍色 

Web應用程式開發 二

web應用程式開發 二 乙個host代表乙個web站點 1 虛擬目錄的根目錄 自己指定乙個檔案系統目錄是web站點的根目錄,在server.xml中在元素中間增加 2 虛擬目錄的子目錄 1 在server.xml中在元素中間增加 3 達成乙個war包,在server.xml檔案中配置 虛擬子目錄的名...

MyEclispe開發WEB應用程式

myeclispe開發web應用程式 一 準備 二 配置 安裝完myeclipse後在eclipse中會出現乙個myeclipse的選單 設定web伺服器 tomcat 選擇tomcat jdk,增加乙個tomcat jdk 三 建立工程 在new project wizard中選擇j2ee下的we...

web 應用元件 應用程式

1,web 內容都是儲存在 web 伺服器上的。2,web 伺服器所使用的是 http 協議,因此經常會被稱為 http 伺服器。3,http 伺服器儲存了網際網路中的資料,如果http 客戶端發出請求的話,它們會提供資料 4,http 客戶端和 http 伺服器共同構成了全球資訊網的基本元件 5,...