1、跪求網頁製作簡單入門html的一系列代碼速成
用一分鍾製作自己的第一個網頁: 下面我們來試著做一個簡單的網頁,希望您能跟著我們操作,這只會花費您一分鍾時間。現在您也許不知道那些尖括弧「<>」和裡面的字母究竟是些什麼東西,不要擔心,我們會在後面的教程中向您介紹。 首先請運行記事本,或在任意位置新建一個文本文檔,在記事本內輸入如下內容: 網頁教學網以下為引用的內容: 我是這個網頁的標題 這是我的第一個網頁。 輸入完畢後將文件保存,命名為「index.html」。(點擊「文件」—>「另存為」。在「文件名」一欄填入「index.html」,在「保存類型」一欄選擇"所有文件",然後點擊「保存按鈕」) Webjx.Com保存之後,雙擊該文件,瀏覽器就會自動打開這個網頁了。請確認一下你的網頁是否與該頁面相同,如果相同,那麼你就成功地完成了自己的第一個比較簡陋的網頁。 Webjx.Com請注意,這只是一個簡單的頁面,雖然它在語法上符合XHTML的標准,但是如果要作為一個完整的、符合W3C標準的XHTML網頁,它還缺少一些內容。相關內容將在後面的教程中介紹。這個網頁僅僅是用來講解一些基礎的XHTML知識。 基礎知識講解 Webjx.Com 我們剛剛製作的網頁以 開頭,以 結尾,它們分別代表網頁文件的開始和結束。 Webjx.Com英文中head是頭的意思,body是身體的意思。網頁的 和 兩部分就分別代表了網頁的「頭」和「身子」。也許你注意到了,我們網頁的「頭」裡面「有一個 。title一詞是標題的意思,網頁的標題(title)將會顯示在瀏覽器上方的標題欄中。而網頁的身子,也就是 與 標簽中間的內容將作為正文被顯示在瀏覽器中。 網頁教學網這個網頁很單薄,head和body中都沒有什麼內容。我們會在以後的教程中逐漸豐富網頁的內容。但是現在請您記住一個概念:網頁的頭(head)是為瀏覽器寫的,它將不會顯示在頁面上,而身子(body)是為網站的用戶寫的,是瀏覽器將要顯示的內容。 菜鳥惡搞XHTML之錯誤示例 網頁教學網 打開下面這兩個錯誤示例看看。它們的代碼都存在十分嚴重的錯誤,但是瀏覽器卻會准確無誤地顯示這兩個網頁。 示例1——身子長在腦袋裡 我是這個網頁的標題 這是我的第一個網頁。 網頁教學網看看上面這個網頁, 和 之間的內容正常的顯示在頁面上了。但是這是滑稽的錯誤,把身子放在腦袋裡了。 Webjx.Com 示例二——腦袋長在脖子下 我是這個網頁的標題 這是我的第一個網頁。 Webjx.Com瀏覽器的適應能力實在是令人佩服,即使你將腦袋放在身子里它也認得出來。看看標題欄,標題完全正常顯示。 好了,在實際應用的時候請不要犯上面這種低級錯誤。這會造成嚴重的後果:搜索引擎可能不收錄你的網站;使用手機或者其他移動設備瀏覽你網站的朋友可能遇到未知錯誤。下面就趕快讓我們來進入XHTML的核心內容吧。 本文來自:網頁教學網( www.webjx.com )原文鏈接: http://www.webjx.com/html-xhtml/webxhtml-2463.html
2、html網頁設計:一個簡單的登錄界面代碼!
是這樣的效果嗎?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>3</title>
<script>
function r()
{
var username=document.getElementById("username");
var pass=document.getElementById("password");
if(username.value=="")
{
alert("請輸入用戶名");
username.focus();
return;
}
if(pass.value=="")
{
alert("請輸入密碼");
return;
}
return true;
}
</script>
</head>
<body>
<form>
<table width="350" bgcolor="#ccffcc" style="border-color" border="1">
<tr align=center>
<td>用戶名</td><td><input type="text" name="username" id="username"></td>
</tr>
<tr align=center><td>密 碼</td><td><input type="password" name="password" id="password"></td></tr>
<tr align=center><td>驗證碼</td><td><input type="text" name="yanzheng"></td></tr>
<tr align=center><td colspan="2"><input type="button" value="登 錄" onclick="r();"/> <input type="reset" value="重 置"/></td></tr>
</table>
</form>
</body>
</html>
3、html求製作一個簡單網頁代碼,只需要一些文字加張圖片
完整的代碼如下:
<html>
<head>
<title>簡單網頁製作練習</title>
</head>
<body>
<p>1.文字內容,直接輸入文字即可。。。。。如果想設置其相關屬性可以使用font標簽
<font size="18" color="red" >紅色18號文字</font> </p>
<p> 2.添加圖片 <img src="圖片名稱.屬性" id=「圖片簡介」>
<img src="1.jpg" id=" 加入圖片練習"> </p>
</body>
</html>
樓主,如果不明白可以HI聯系我。。。。
4、網頁設計中的邊框代碼如何做?
用到CSS樣式和HTML標簽元素,為了對html不同標簽加邊框虛線,我們選擇幾個常用標簽對齊設置邊框虛線效果.
1、html常用標簽:p標簽 spanul li table tr td;
2、實例用到CSS屬性單詞:border width height;
3、實現虛線的CSS重點介紹
border為邊框屬性,如果要實現對象邊框效果,要設置邊框寬度、邊框顏色、邊框樣式(實線還是虛線).
border:1px dashed #F00 這個就是設置邊框樣式寬度為1px 虛線,虛線為紅色.
5、網頁製作中插入圖片的代碼是什麼
1、在代碼中經常用到的插入圖片代碼是img屬性,格式就是<img src="" alt=""> src後面是添加圖片的地址,後面的alt是對圖片的描述。
2、在插入圖片前,要將html文件和圖片文件放在一個文件夾內,這里的img文件夾就是專門存放圖片的地方。
3、然後回到代碼欄,在src中輸入鏈接地址img/pic_01.jpg,要將圖片的具體地址和名稱全部寫全才可以在網頁中看到,否則就會顯示連接失敗錯誤而無法觀看到圖片。
4、將文件保存後,在瀏覽器中我么就可以看到此刻的圖片被添加進來了,位於網頁的左上角位置。
5、如果想要移動圖片的所在位置,就需要先對其包裝一下,用一個盒子將其包裹,然後調整盒子的位置就相當於移動的是圖片的位置了。
6、如圖,之前設置的盒子距離頂部100px.然後距離左側100px,這樣就將盒子擠到了現在所在的位置,如圖所示。
6、html求製作一個簡單網頁代碼,只需要一些文字加幾張圖片
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body>
<img src="這里填你的圖片名字,例如1.jpg,圖片跟html放在同一個文件夾下面就行">
<img src="2.jpg">
<img src="3.jpg">
<p>這里輸入你想要輸入的文字</p>
</body>
</html>
7、製作網頁的所有代碼和代碼意思
這個最全 http://ke.baidu.com/view/692.htm [編輯本段]HTML規范 一、 HTML 頭: 1、針對日文環境: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=EUC-JP"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>yourtitle</title> </head> 2、針對中文環境: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01Transitional//EN"> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB2312"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>yourtitle</title> </head> 我們建議的編碼格式是utf-8,它支持多語種,並且可以避免出現亂碼的情況。 二、html中javascript的書寫: <head>….. <script type="text/javascript"> <!—…..--> </script> </head> 當然我們不希望你是這樣內嵌教本,而是從一個外部文件進行引用,並且只把它放在文檔的頭部。 <script src="path/to/script.js" language="javascript" type="text/javascript"></script> 三、html中元素的書寫: 1、 元素屬性值必須包含在雙引號中; <font color=」#000000」 size=」3」 face=」Arial」> 2、 form 中必須加action屬性,並且不能為空。 <form action=」/r/add.cgi」 method=」post」> 如果不需要使用action屬性,也必須定義: <form action=」no」 > 3、 img的alt屬性不可以缺少; <img src="/q/img/btn_style.gif" border="0" alt="Select」> 4、 head與</head>之間必須有title; <head> …… <title>your title </title> …… </head> 5、 tr、td必須定義在table之間; 6、 button按鈕必須定義在form之間,否則netscape不支持; <form action=」……」 method=」post」> <input type=」button」 name=」but」 value=」back」> </form> 7、 在javascript中的字元串中出現的「/」前要用轉義符「\」: <script type=」text/javascript」> <!— function check(str) { var str=」\/r\/add.cgi」; …… } --> </script> 8、 onclick 屬性必須和 onkeypress 成對寫( onmousedown + onkeydown、onmouseup + onkeyup) mm 9、 用URL傳值時直接寫&是不可以的,可用&替換: 四、縮近規則: 中,等必須保持嚴格的縮近規則,以"Tab"鍵為准: 五、為了檢驗您的HTML代碼是否合法,您可以到W3的HTML Validator工具中進行檢驗,支持URI輸入,上傳文件和直接輸入代碼三種方式進行檢驗 http://validator.w3.org/ [編輯本段]HTML元素參考手冊 (HTML Elements Referencea) 表示超鏈接的起始或目的位置。 acronym 表示取首字母的縮寫詞。 address 表示特定信息,如地址、簽名、作者、文檔信息。 applet 在頁面上放置可執行內容。 area 定義一個客戶端圖像映射中一個超級鏈接區域的形狀、坐標和關聯 URL。 b 指定文本應以粗體顯示。(不建議使用) base 指定一個顯式 URL 用於解析對於外部源的鏈接和引用,如圖像和樣式表。 basefont 設置顯示文本時作為默認字體的基礎字體值。(不建議使用) bdo 允許作者為選定文本片斷禁用雙向法則。 bgsound 使頁面能夠帶有背景聲音或配音。 big 指定所含文本要以比當前字體稍大的字體顯示。 blockquote 表示文本中的一段引用語。 body 指明文檔主體的開始和結束。 br 插入一個換行符。 button 指定一個容器,其中所含的 HTML 會被顯示為一個按鈕。 caption 表格的標題,對表格的簡單描述。 center 將指定文本和圖像居中顯示。(不建議使用) cite 用斜體顯示標明引文。(不建議使用) code 表示代碼範例。 col 說明基於列的表格預設屬性。 colgroup 說明表格中一列或一組列的預設屬性。 comment 表示不可見的注釋。防止所包含的文本或者HTML源代碼被瀏覽器解析和顯示。 dd 在定義列表中表示定義。定義通常在定義列表中縮進顯示。 del 表示文本已經從文檔中刪除。 dfn 表示術語的定義。(不建議使用) dir 表示目錄列表。(不建議使用) div 表示一塊可顯示 HTML 的區域 dl 表示定義列表。 dt 在定義列表中表示定義術語。 em 強調文本,通常以斜體顯示。 embed 允許嵌入任何類型的文檔。 fieldset 在欄位集包含的文本和其它元素外面畫一個方框。 font 用於說明所包含文本的新字體、大小和顏色。 form 說明所包含的控制項是某個表單的組成部分。 frame 在FRAMESET 元素內表示單個框架。 frameset 表示一個框架集,用於組織多個框架和嵌套框架集。 head 提供了關於文檔的無序信息集合。 h1-h6 這實際上是6個標簽,他們以標題樣式顯示文本,h1最大,h6最小。 hr 水平線。 html 表明文檔包含 HTML 元素。 i 指定文本應以斜體顯示。(不建議使用) iframe 創建內嵌漂浮框架。 img 在文檔中嵌入圖像或視頻片斷。 input 創建各種表單輸入控制項。 input type=button 創建按鈕控制項。 input type=checkbox 創建復選框控制項。 input type=file 創建文件上載控制項,該控制項帶有一個文本框和一個瀏覽按鈕。 input type=hidden 傳輸關於客戶/伺服器交互的狀態信息。 input type=image 創建一個圖像控制項,該控制項被點擊後將導致表單立即被提交。 input type=password 創建與 INPUT type=text 控制項類似的單行文本輸入控制項,不過並不顯示用戶輸入的內容。 input type=radio 創建單選鈕控制項。 input type=reset 創建一個按鈕,點擊該按鈕後,將重置表單控制項回其初始值。 input type=submit 創建一個按鈕,點擊該按鈕後,即提交表單。 input type=text 創建一個單行的文本輸入控制項。 ins 表示插入到文檔中的文本。 isindex 使瀏覽器顯示一個對話框,提示用戶輸入單行文本。(不建議使用) kbd 以定寬字體顯示文本。(不建議使用) label 為頁面上的其它元素指定標簽。 legend 在fieldSet 對象繪制的方框內插入一個標題。 li 表示列表中的一個項目。 link 允許當前文檔和外部文檔建立連接。 listing 以固定寬度的字體顯示文本。 map 包含客戶端圖像映射的坐標數據。 marqueee 創建一個滾動的文本字幕。(不建議使用) menu 創建一個無序列表。 meta 向伺服器和客戶端傳達關於文檔的隱藏信息。 nobr 不換行顯示文本。 noframes 包含對於那些不支持 FRAMESET 元素的瀏覽器使用的 HTML。 noscript 指定在不支持腳本的瀏覽器中顯示的 HTML。 object 在HTML 頁面中插入對象。 ol 編制排序列表。 optgroup 允許作者對 select 元素中的選項進行邏輯分組。 option 表示SELECT 元素中的一個選項。 p 表示一段。 param 設置APPLET、EMBED 或 OBJECT 元素的屬性初始值。 pre 以固定寬度字體顯示文本。 q 分離文本中的引語。 s 帶刪除線方式顯示文本。(不建議使用) samp 表示代碼範例。 script 指定由腳本引擎解釋的頁面中的腳本。 select 表示一個列表框或者一個下拉框。 small 指定內含文本要以比當前字體稍小的字體顯示。 span 指定內嵌文本容器。 strike 帶刪除線顯示文本。(不建議使用) strong 以粗體顯示文本。 style 指定頁面的樣式表。 sub 說明內含文本要以下標的形式顯示,比當前字體稍小。 sup 說明內含文本要以上標的形式顯示,比當前字體稍小。 table 說明所含內容組織成含有行和列的表格形式。 tbody 指明哪些行作為表格的主體。 td 指定表格中的單元格。 textarea 多行文本輸入控制項。 tfoot 指明哪些行作為表尾。 th 指定標題列。標題列將在單元格中居中並以粗體顯示。 thead 指定哪些行作為表頭。 title 文檔的標題。 tr 指定表格中的一行。 tt 以固定寬度字體顯示文本。(不建議使用) u 帶下劃線顯示文本。(不建議使用) ul 表示不排序的項目列表。 var 定義程序變數,通常以斜體顯示。 wbr 向一塊 NOBR 文本中插入軟換行。