乐趣区

关于c:Linux网络开发必学教程26Web-前端开发基础

jiezi

对于 Http 应用程序

  • 基于 Http 的应用程序实质上是一种非凡的 C/S 模型利用
  • Http 应用程序的底座是 TCP 协定（即：socket 可实现利用）
  • 常见的 Http 客户端为浏览器，服务端为 Web 服务器
  • 简略了解：Http 应用程序 ←→ TCP 应用程序 + 文本处理应用程序

值得思考的问题

浏览器为什么能成为“万能客户端”？

什么是 HTML？

  • HTML 指的是超文本标记语言：Hyter Text Markup Language
  • HTML 不是一种编程语言，而是一种标记语言

  • 标记语言是一套标记标签（markuo tag）

    • HTML 应用标记标签来形容网页
    • HTML 文档蕴含了 HTML 标签及文本标记能容
    • HTML 文档也叫做 Web 页面
  • HTML 文本示例

HTML 中的标签

  • HTML 标签通常被称为 HTML Tag
  • HTML 标签是由尖括号突围的管检测，比方：<html>
  • HTML 标签通常是成对呈现的，比方 <b> 和 </b>
  • 标签对中的第一个标签为开始标签，第二个标签是完结标签
  • 开始标签和完结标签也被称为凋谢标签和闭合标签

HTML 中的“分区”

问题一：如何管制 HTML 页面中的字符大小

  • HTML 题目是通过 <h1> - <h6> 标签来定义的（字符由大到小）
  • HTML 段落是通过标签 <p> 来定义的（段落主动换行）
  • HTML 应用标签 <b> 与 <i> 对输入的文本进行格局
  • HTML 应用 <hr> 标签在 HTML 页面中创立水平线
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>DT4SW</title>
</head>
<body>
    <h1> 字符管制示例 </h1>
    <p><b>hr 标签定义水平线 </b></p>
    <hr/>
    <h2> 这是段落 1。</h2>
    <hr/>
    <h4> 这是段落 2。</h4>
    <hr/>
    <h6> 这是段落 3，<br/> 换行 <br> 再换一行 </p></h6>
</body>
</html>

问题二：如何再 HTML 页面中嵌入链接

  • HTML 应用标签 <a> 来设置超文本链接
  • 超链接能够是一个字，一个词，或着一组词，也能够是一幅画
  • 在标签 <a> 中应用了 href 属性来形容链接地址
  • 语法
<a href = "url"> 链接文本 </a>
<a href = "url" target="_blank"> 链接文本 </a>
<a href = "path_to_file"> 下载文件 </a> 
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title><DT4SW></title>
</head>
<body>
    <a href="http://www.dt4sw.com"> 狄泰软件学院主页 </a>
    <br>
    <a href="http://www.dt4sw.com" target="_blank"> 狄泰软件学院 </a>
    <br>
    <a href="scite521.zip">scite521</a>
</body>
</html>

问题三：如何在 HTML 页面中编写表格

  • 表格由 <table> 标签定义，表头应用 <th> 标签定义
  • 每个表格均有若干单元格（由 <tr> 标签定义）
  • 每行被宰割为若干单元格（由 <td> 标签定义）
  • 数据单元格能够蕴含文本、图片、列表、段落等

HTML 表格示例

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Table Demo</title>
</head>
<body>
    <h1>Data List</h1>
    <table border="1">
        <tr>
            <th>Header 1</th> <th>Header 2</th> <th>Header 3</th>
        <tr>
        <tr>
            <th>row 1, cell 1</th> <th>row 1, cell 2</th> <th>row 1, cell 3</th>
        <tr>
        <tr>
            <th>row 2, cell 1</th> <th>row 2, cell 2</th> <th>row 2, cell 3</th>
        <tr>
        <tr>
            <th>row 3, cell 1</th> <th>Header 3, cell 2</th>
        <tr>
    </table>
</body>
</html>

综合练习：应用 HTML 编写页面

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Table Demo</title>
</head>
<body>
    <h1>DT4SW Http File Server</h1>
    <hr>
    <h2>Path:/</h2>
    <table border="1" width="100%">
        <tr>
            <th>File Name</th> <th>File Type</th> <th>File Size</th> <th>Modify Time</th>
        </tr>
        <tr>
            <td><a href="test-file-1">test-file-1</a></td> <td>Dir</td> <td></td> <td>Fri Mar 5 00:00:00 2022</td>
        </tr>
        <tr>
            <td><a href="test-file-2.txt">test-file-2.txt</a></td> <td>File/txt</td> <td>4096</td> <td>Fri Mar 5 00:00:00 2022</td>
        </tr>
        <tr>
            <td><a href="test-file-3">test-file-3</a></td> <td>File/bin</td> <td>4096</td> <td>Fri Mar 5 00:00:00 2022</td>
        </tr>
    </table>
</body>
</html>

思考

如何编写 Http 服务端应用程序？如何动静生成浏览器中的展现页面？

退出移动版