HTML/CSS總結1

来源:http://www.cnblogs.com/haimengqingyuan/archive/2016/09/25/5905403.html
-Advertisement-
Play Games

1.定義網頁背景顏色 <body bgcolor="背景色"> 顏色可以用2種方式表示:1. 直接指定顏色名稱,如blue。2.使用十六進位數據表示如#RRGGBB,分別表示兩位十六進位數據. 2.設置背景圖片 <body background="圖片的地址"> 3.設置文字顏色 <body tex ...


1.定義網頁背景顏色

  <body bgcolor="背景色">    

   顏色可以用2種方式表示:1. 直接指定顏色名稱,如blue。2.使用十六進位數據表示如#RRGGBB,分別表示兩位十六進位數據.

 

2.設置背景圖片

   <body background="圖片的地址">

 

3.設置文字顏色

   <body text="文字的顏色">

 

4.設置鏈接文字屬性

   <body link="顏色">

   alink可以用來設置滑鼠單擊鏈接時的顏色;vlink可以設置被訪問過的超鏈接的顏色。

 

5.設置頁面邊距

  <body topmargin=value leftmargin=value rightmargin=value bottommargin=value>

 

6.標題標記

  <title>...</title>

 

7.定義頁面關鍵字

  <meta name="ketwords" content="輸入具體的關鍵字">

 

8.定義頁面描述

 <meta name="description" content="設置頁面描述">

 

9.定義編輯工具

 <meta name="generator" content="Frontpage">

 

10.定義作者信息

 <meta name="autor" content="作者的姓名">

 

11.定義網頁文字及語言

 <meta http-equiv="content-type" content="text/html;charset=字元集類型">

 

12.定義網頁的定時跳轉

 <meta http-equiv="refresh" content="跳轉的時間;URL=跳轉到的地址">

用http-equiv中的refresh不僅可以實現頁面自身的自動刷新,也可以實現頁面間的自動跳轉過程。

 

13.鏈接

      1. 創建基本超鏈接:<a 屬性=“鏈接目標”>鏈接顯示文本</a>

          屬性:href--指定鏈接地址;name--給鏈接名字;title--給鏈接添加提示文字;target--指定鏈  接的目標視窗;Target參數的屬性取值:-self--在當前頁面中打開鏈接;  -blank--在一個全新的空白視窗中打開鏈接;-top--在頂層框架中打開鏈接,也可理解為在根框架中打開鏈接;-parent--在當前框架的上一層打開鏈接。

      2. 創建圖像鏈接

          <a href=”鏈接目標”>鏈接的圖像</a>

      3. 創建錨點

          <a name=”錨點的名稱”></a>   錨點就是指在給定名稱的一個網頁中的某一個位置,在創建錨點鏈接前首先要建立錨點。

          <a href=”#錨點的名稱”>...</a>

 

14.表單

     <form action="表單的處理程式" method="傳送方法"></form>   一般情況下表單的處理程式action和傳送方法method是必不可少的參數。

     Action用於指定表單數據提交到哪個地址進行處理。表單的處理程式是表單要提交的地址,即表單中收集到的資料將要傳遞到的程式地址。

     傳送方法的值只有兩種,即get和post。Get--表單數據被傳送到action屬性指定的URL,然後這個新的URL被送到處理程式上。Post--表單數據被包含在表單主體中,然後被送到處理程式中。

 

15.插入圖像

     <img src=”圖像的地址” height=”圖像的高度” width=”圖像的寬度” hspace=”水平邊距” vspace=”垂直邊距” align=”對齊方式” alt=”提示文字的內容”>

 

16.添加多媒體文件

    <embed src=”多媒體文件地址” width=”多媒體的寬度” height=”多媒體的高度” autostart=”是否自動運行” loop=”是否迴圈播放” ></embed>

    <bgsound src=”背景音樂地址 ” loop=”播放次數”>

 

17.插入其他標記

    插入空格符號:&nbsp;

   插入特殊符號:&amp;...&copy;

 

18.設置文字格式

    font用來控制字體、字型大小、顏色等屬性;<font face=”字體樣式”>...</font> 可以通過face設置不同的字體。<font size=”文字字型大小”>..</font>用來設置字體大小。<font color=”字體顏色”>...</font> 用來設置文字顏色。

    <b>加粗的文字</b>、<strong>加粗的文字</strong> 、<i>斜體文字</i>、<em>斜體文字</em>、<cite>斜體文字</cite>、<u>下劃線內容</u>、<sup>上標內容</sup>、<sub>下標內容</sub>

 

19.設置段落格式

   <p>段落文字</p>、<align=對齊方式>、<nobr>不換行文字</nobr>、<br>換行標記

 

20.水平線標記

    <hr>在網頁中輸入一個此標記即添加了一條預設樣式的水平線、<hr width=”寬度”>、<hr size=”高度”>、<hr color=”顏色”>、<hr align=”對齊方式”>、<hr noshade>利用水平線去掉陰影

 

21.css

      1.css:層疊樣式表。使用css能夠簡化網頁的格式化代碼,加快下載的速度,也減少了需要上傳的代碼數量,大大減少了重覆勞動的工作量。樣式表的首要目的的為網頁上的元素精確定位。其次他把網頁上的內容結構與格式控制相分離,使得網頁可以僅由內容構成,而將網頁的格式通過通過css樣式表文件來控制

      2.Css語法結構僅由3部分組成,分別是選擇符、樣式屬性和值,基本語法如下:

        選擇符{樣式屬性:取值;樣式屬性:取值;...}

      3.基本css選擇器

         標簽選擇器:直接將html標簽作為選擇器如p選擇器;類別選擇器:標記選擇器一旦聲明,則頁面中所有的該標記都會相應的產生變化;Id選擇器的使用方法和class選擇器基本相同,不同之處在於id選擇器只能在html頁面中使用一次。

      4.css的使用方式

         鏈接外部樣式表:<link type=”text/css” rel=”stylesheet” href=”外部樣式表的文件名稱”>

         行內方式:<標記 style=”樣式屬性:屬性值;樣式屬性:屬性值;...”>

         嵌入外部樣式表:

         <style type=text/css>

           @import url(“外部樣式表的文件名稱”);

         </style>

         內部樣式表:

        <style type=”text/css”>

        <!--

            選擇符1(樣式屬性:屬性值;樣式屬性:屬性值;...)

            選擇符2(樣式屬性:屬性值;樣式屬性:屬性值;...)

             ....

            選擇符n(樣式屬性:屬性值;樣式屬性:屬性值;...)

         -->

       </style>

      5.設置css屬性

         css屬性分為:類型、背景、區塊、方框、邊框、列表、定位、擴展。

         css類型屬性:Font-family、Font-size、Font-style、Line-height、Text-decoretion、Font-weight、Font-variant、Text-transform、Color

         css背景屬性:Background-color、Background-image、Background-repeat、Background-attachment(確定背景圖像是固定在它的原始位置還是隨內容一起滾動)、Background-position(X)和background-position(Y):指定背景圖像相對於元素的初始位置。

         css區塊屬性:Word-spacing:設置單詞的間距;Letter-spacing:增加或減小字母或字元的間距。vertical-align:指定應用它的元素的垂直對齊方式。Text-align:設置元素中文本對齊方式。Text-indent:指定第一行文本縮進的程度。White-space:確定如何處理元素的空白。Display:指定是否及如何顯示元素。

         css方框屬性:Width和height屬性設置元素的寬度和高度。Float:設置其他元素在哪個邊圍繞元素浮動。Padding:指定元素內容與元素邊框之間的間距。Margin:指定一個元素的邊框與另一個元素之間的間距。

         css邊框屬性:Style:設置邊框的樣式外觀。Width:設置元素邊框的粗細。Color:設置邊框的顏色。

         css列表屬性:List-style-type:設置項目符號或編號的外觀。List-style-image:可以為項目符號指定自定義圖像。單擊瀏覽按鈕選擇圖像或輸入圖像路徑。List-style-position:設置列表項文本是否換行和縮進以及文本是否換行到左邊距。

         css定位屬性:Position:四個可選值:absolute能夠準確將元素移動到你想要的位置,絕對定位元素的位置。Fixed--相對於視窗的固定定位。Relative--相對定位是相對於元素預設的位置的定位。Static--該屬性值是所有元素定位的預設情況,可用static取消繼承,即還原元素定位的預設值。Visibility:如果不指定可見性屬性,則預設情況下大多數瀏覽器都繼承父級的值。

         css擴展屬性:Page-break-before:其中兩個屬性的作用是為列印的頁面設置分頁符。Page-break-after:檢索或設置對象後出現的頁分割符。Cursor:指針位於樣式所控制的對象上時改變指針圖像。Filter:對樣式所控制的對象應用特殊效果。

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 微信小程式全稱微信公眾平臺·小程式,原名微信公眾平臺·應用號(簡稱微信應用號) 聲明 微信小程式開發工具類似於一個輕量級的IDE集成開發環境,目前僅開放給了少部分受微信官方邀請的人士(據說僅200個名額)進行內測,因此目前未受到邀請的人士只能使用破解版; 本破解版資源來自於網上,與本人無關,僅供技術 ...
  • function clickFunc(id) { var params = new Array(); params.push({ name: "id", value: id}); Post("/Action/method", params);}function Post(URL, PARAMTERS ...
  • 20:32:59 Ctrl+/ 或 Ctrl+Shift+/ 註釋(// 或者 ) Shift+F6 重構-重命名 Ctrl+X 刪除行 Ctrl+D 複製行 Ctrl+G 查找行 Ctrl+Shift+Up/Down 代碼向上/下移動。 F2 或Shift+F2 高亮錯誤或警告快速定位 寫代碼,按 ...
  • 事件背景: 最近在做一個移動端業務的時候碰到一個bug,在ios上對body綁定click事實現事件代理冒泡至某些元素上盡然不生效。 思考: 暫藉助jquery展示下事件綁定代碼,將所有標簽含有data-tip屬性的元素通過事件代理至body 這樣做在android和pc上都可以正常實現,但是在io ...
  • js中三種彈窗 1)alert 彈出警告 無返回值---------alert('第一行\n第二行'); 2)confirm()選擇確定或取消,返回t或f----var result = confirm('是否刪除!'); 3)prompt()彈出輸入框,返回輸入內容----var value = ...
  • 以下是個人對這三個老大難的總結(最近一直在學習原生JS,翻了不少書,不少文檔,雖然還是新手,但我會繼續堅持走我自己的路) 原型鏈 所有對象都是基於 ,`Object.prototype Object.prototype Object.prototype toString() [[class]] '[ ...
  • <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, ...
  • 本文是翻譯Function.apply and Function.call in JavaScript,希望對大家有所幫助 轉自“http://www.jb51.net/article/52416.htm” 第一次翻譯技術文章,見笑了! 翻譯原文: Function.apply and Functi ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...