WWW_WEB_入門實踐—網頁設計HTML_CSS_VC#語言描述的網頁
網頁內容與表現形式
一般新聞或科技報導—文本與圖形
網頁描述語言—語言規則格式與例子。元素、標籤、屬性、標題、段落、樣式、引用、註解、連結、下劃線、字體、色彩、字號、……。紙介質或網頁版面涉及到的元素及其屬性。
使用WWW特有語言
HTML語言—基礎描述語言
後臺計算機語言描述—代碼
HTML
<html>
<bodystyle="background-color: #ffff00">
<p>
WWW_WEB_入門實踐—網頁設計HTML語言<br />
蜘蛛網計算機語言<br />
工程師基礎<br />
</p>
</body>
</html>
瀏覽器解釋輸出的前臺描述—表現形式
HTML-CSS
後臺計算機語言描述—代碼
<html>
<styletype="text/css">
body{background-color:yellow}
</style>
<body>
<p>
WWW_WEB_入門實踐—網頁設計HTML語言<br />
蜘蛛網計算機語言<br />
工程師基礎<br />
</p>
</body>
</html>
瀏覽器解釋輸出的前臺描述—表現形式
HTML-CSS-JavaScript
後臺計算機語言描述—代碼
<html>
<styletype="text/css">
body{background-color: yellow}
h2{background-color: #00ff00}
p{background-color: rgb(50,0,100);font-family:隸書;color:red;font-size:30px}
</style>
<body>
<h2 id="HButtonJavaScript">我的第一段HTML語言描述的網頁</h2>
<buttontype="button"
onclick='document.getElementById("HButtonJavaScript").innerHTML
="HTML語言描述的網頁-改變網頁內容,來自JavaScript語言描述的事件"'>
點擊按鈕-人機互動
</button>
<br />
<addressstyle="font-family:華文新魏;color:red;font-size:20px">
作者：工程師基礎</br>
發布者：訂閱號-蜘蛛網計算機語言
</address> <hr />
<p id="PButtonJavaScript">
WWW_WEB_入門實踐—網頁設計HTML語言<br />
蜘蛛網計算機語言<br />
工程師基礎<br />
</p>
<br />
<buttontype="button"onclick='document.getElementById("PButtonJavaScript").innerHTML
="Javascript語言可以改變網頁內容。<br />動態網頁與瀏覽者交互-WWW_WEB_入門實踐—網頁設計HTML_Javascript語言。<br />蜘蛛網計算機語言：工程師基礎"'>點擊按鈕-觀察改變
</button>
<br />
<p1id="Pchange">JavaScript能夠改變 HTML 內容。</p1><br/>
<buttontype="button"onclick='document.getElementById("Pchange").innerHTML
= "button 按鈕事件可以改變用戶要求的響應，JavaScript描述實現!"'>點我再試一下</button>
</body>
</html>
瀏覽器解釋輸出的前臺描述—表現形式
HTML-CSS-VC#
後臺計算機語言描述—代碼
網頁描述語言由HTML-CSS-VC#組成，程序編輯平臺由記事本轉變為VS.net。微軟提供的一體化平臺—編輯、調試、發布等。當然就複雜了！不過，有了HTML-CSS-JavaScript的粗淺認知與體驗，尤其是有了HTML-CSS的基本常識概念與實踐，閱讀起來就方便了好多。
先看一下編輯工具的模樣：
新建一個項目—用於網頁製作。
編譯系統—平臺已經替我們做了許多許多事情---也就是必要的通用代碼和頁面布局、樣式等。用戶可以根據自己的需求改變代碼。
平臺及其一部分代碼是：
<%@ PageTitle="主頁" Language="C#"MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="Default.aspx.cs"Inherits="WebHTML_CSS_VCsharp_1_._Default" %>
<asp:ContentID="HeaderContent" runat="server"ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:ContentID="BodyContent" runat="server"ContentPlaceHolderID="MainContent">
<h2>
歡迎使用 ASP.NET!
</h2>
<p>
若要了解關於 ASP.NET 的詳細信息，請訪問 <a href="http://www.asp.net/cn" title="ASP.NET 網站">www.asp.net/cn</a>。 </p>
<p>
您還可以找到 <ahref="http://go.microsoft.com/fwlink/?LinkID=152368"
title="MSDN ASP.NET 文檔">MSDN上有關 ASP.NET 的文檔</a>。 </p>
</asp:Content>
瀏覽器解釋輸出的前臺描述—表現形式
改造為用戶的模樣。
只關注用戶需要的內容進行添加即可
瀏覽器解釋輸出的前臺描述—表現形式—看看用戶添加了什麼？
平臺及其一部分代碼是：
<asp:ContentID="HeaderContent" runat="server"ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:ContentID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<styletype="text/css">
body{background-color: yellow}
h2{background-color: #00ff00}
p {background-color:rgb(50,0,100);font-family:隸書;color:red;font-size:30px}
</style>
<h2>
蜘蛛網計算機語言--歡迎使用 ASP.NET製作和發布基於HTML-CSS-VC#的網頁製作!
</h2>
<p>
若要了解關於 ASP.NET 的詳細信息，請訪問 <a href="http://www.asp.net/cn" title="ASP.NET 網站">www.asp.net/cn</a>。 </p>
<p>
若要了解關於 蜘蛛網計算機語言的詳細信息，請訪問 微信公眾號--訂閱號：《蜘蛛網計算機語言》。 </p>
<p>
您還可以找到 <ahref="http://go.microsoft.com/fwlink/?LinkID=152368"
title="MSDN ASP.NET 文檔">MSDN上有關 ASP.NET 的文檔</a>。 </p>
<p> 在微信訂閱號《蜘蛛網計算機語言》上，您還可以找到其它計算機語言基礎及其應用的文檔</a>。</p>
</asp:Content>
//////////////////////////////
<%@ PageTitle="關於蜘蛛網計算機語言的" Language="C#"MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="About.aspx.cs"Inherits="WebHTML_CSS_VCsharp_1_.About" %>
<asp:ContentID="HeaderContent" runat="server"ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:ContentID="BodyContent" runat="server"ContentPlaceHolderID="MainContent">
<h2>
關於《蜘蛛網計算機語言的》
</h2>
<p>
WWW_WEB_入門實踐—網頁設計HTML_CSS_VC#語言描述的網頁
網頁內容與表現形式
一般新聞或科技報導—文本與圖形
網頁描述語言—語言規則格式與例子。元素、標籤、屬性、標題、段落、樣式、引用、註解、連結、下劃線、字體、色彩、字號、……。紙介質或網頁版面涉及到的元素及其屬性。
使用WWW特有語言
</p>
</asp:Content>
閱讀代碼也是不錯的學習方法。
前面的CSS代碼還沒有放置在CSS文件中。
學習理解多文件網頁系統。
請注意：
網頁設計模式—信息表達與表現形式—信息量與理解效率。
網頁描述需求與實現