1. 程式人生 > >///html/css-html-連結和影象-1~11

///html/css-html-連結和影象-1~11

很多東西都可以是超連結

<a href="  .html">這是連結</a>  作用從當前html頁面跳轉到指定頁面

  href 指定跳轉頁面的路徑

<a href=" http://www.baidu.com">這是連結</a>  作用從當前html頁面跳轉到指定頁面

第一個是相對路徑,第二個是絕對路徑,不會變化

相對路徑可以變成絕對路徑,開啟後的http://

怎麼選擇

http://   localhost:                                                  63342   /code/   lj.html

網路協議  IP地址(每臺電腦獨有,IPV4 IPV6) 埠號    路徑     檔名稱 

http://www.baidu.com

虛擬地址(域名):對應的IP地址,並不是沒有埠號,為80(允許忽略)

屬性  :1.target 開啟方式

<a target=“_blank”  href="  .html">這是連結</a>

1._self 當前頁面開啟  _blank 表示在新視窗/便籤開啟連結 

   _top頂級  _parent父級視窗開啟,這倆是視窗時期的問題,最大視窗和上一個視窗,IE6之前用的

2.mailto 實現email連結效果   配合有郵箱的軟體的電腦

   配合href屬性寫的,是以mail2開頭的

 <a  href="mailTo:xxxx.qq.com">這是連結</a>  

3-6

 

影象img 空集

屬性

1.src  設定引入指定圖片的路徑

2.alt  不顯示圖片時的文字提示

改變圖片顯示的大小

1.元素屬性  width height < img  width= height= src=" .jpg" alt="">  可以只設置高/寬,不會變形

2.css屬性   width height  <style> 建議用這個

但是 圖片和頁面相對獨立載入,屬於html頁面外部資源,太多會載入慢--解決方式??

圖片背景background-image

<style>

body{

background-image:url(" .img");

}

引入背景影象,1.如果引入的圖片比較大,大於當前頁面區,顯示不完整2.圖片小於當前頁面,會重複顯示至鋪滿整個頁面

解決方法:1.製作和頁面完全一致的背景,但是頁面大小也會變的 2.?

和圖片的區別,右鍵不一樣;影象元素可被包裹在a標籤

設定背景影象(style url下面寫)

效果怎麼變好

1.平鋪方式:

background-repeat: no-repaet/repeat/repeata-x/repeat-y/  space(儘可能重複,不剪下,會有空白,預設水平方向)/round(會拉伸,可設定 height width,不會有顯示一般的情況)

background-position:top/center/bottom      /right/center/left/ 分垂直和水平,只寫一個表示水平和垂直方向一致

                                  50px  100px; 水平 垂直,負的也可以

                                  50%  50%;

background-size: 40px 50px; 寬 高

背景影象關聯

attachment:fixed;

屬性

寫到一起

6~7

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

6-7