Python web 学习（一）

前端网页

静态网页 - 只能够浏览无法和用户进行交互

动态网页 - 能够实时更新并且能够与用户互动

HTML CSS JS 网页编写三剑客

HTML-毛坯房

CSS-装修

JS-智能家具

JQ属于JS的一个库

HTML:

超文本标记语言，标记语言是有一套标记标签组成，学习HTML，其实就是学习标记标签。

1、块级标签：<p>/<h1>/<table>/<ol>/<ul>/<form>/<div>

2、内联标签：<a>/<input>/<img>/<sub>/<sup>/<textarea>/<span>

3、块级元素的特点：

　　总在新行上开始

　　高度，行高一级外边距和内边距都可控制

　　宽度缺省，则是它容器的100%

　　他可以容纳内联元素和其他块元素

4、inline元素特点：

　　和其他元素在一行上

　　高，行高以及外边距和内边距不可改变

　　宽度就是其文字或图片宽度，不可改变

　　内联元素只能容纳文本或者其他内联元素

HTML文本内容：

<!DOCTYPE html>                                 <!--文档类型-->
<html lang="en">                                <!--根标签-->
<head>                                          <!--网页头部-->
    <meta charset="UTF-8">                      <!--国际编码-->
    <title>这是我们的第一节课</title>           <!--网页标题-->
    <style>
        table{
            border:1px solid red;
        }
        td{
            border:1px solid black;
        }
    </style>

</head>
<body>                                          <!--网页的主体，可视化区域-->
<a href="#aaa">点我跳回百度去</a>
<!--段落标签-->
<p>我是一个段落标签</p>
<p>我是一个段落标签</p>
<!--标题标签-->
<h1>我是一级标签</h1>
<h2>我是二级标签</h2>
<h3>我是三级标签</h3>
<h4>我是四级标签</h4>
<h5>我是五级标签</h5>
<h6>我是六级标签</h6>
<!--加粗，斜体，删除线-->
我是普通的一句话 <br>
<strong>我是普通的一句话</strong> <br>
<b>我是普通的一句话</b> <br>
我是正直的一句话 <br>
<i><b>我是弯的一句话</b></i> <br>

<b>春季大促销，不要<s style="font-size: 30px">998</s>，只要688</b> <br>

<!--列表标签-->
有序列表
<ol>
    <li>第一名</li>
    <li>第二名</li>
    <li>第三名</li>
</ol>
无序列表
<ul>
    <li>111</li>
    <li>222</li>
    <li>333</li>
</ul>
<br>
自定义列表
<dl>
    <dt>肉
        <dd>锅包肉</dd>
        <dd>鱼香肉丝</dd>
        <dd>大盘鸡</dd>
    </dt>
    <dt>菜</dt>
        <dd>麻辣烫</dd>
        <dd>火锅</dd>
        <dd>烤鱼</dd>
</dl>
<br>

<img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1484851367,2985998441&fm=26&gp=0.jpg" alt="哎呀，图片犯错了">
<br>

<a href="https://www.baidu.com/" target="_blank" title="不要点我">放我去百度</a>      <!--_blank:新窗口跳转;_self:本地窗口跳转-->

<p id="aaa">我是跳转过来的位置</p>

<a href="#">我要回顶部</a>
<br>

&lt;                         <!--    < 小于符号    -->
&gt;                         <!--    > 大于符号    -->
&equals;                     <!--    = 等于符号    -->
<p>我是&nbsp;一句话</p>      <!--      空格符号    -->
<p>我是&emsp;一句话</p>      <!--      字符宽度符号    -->
<br>

<!--表格-->
<table>                                                  <!--   colspan 列合并-->
    <thead>                                              <!--   rowspan 行合并-->
    <tr>
        <td colspan="3" style="text-align: center">周一菜单</td>
        <!--<td>周二菜单</td>-->
        <!--<td>周三菜单</td>-->
    </tr>
    <tr>
        <td rowspan="2">鸡</td>
        <td>鸭</td>
        <td>鱼</td>
    </tr>
    <tr>
        <td>小鸡</td>
        <td>小鸭</td>
        <!--<td>小鱼</td>-->
    </tr>
    </tbody>
</table>
<br>

<!--表单-->
<form action="https://www.baidu.com/s" method="get" target="_blank">
    关键词<input type="text" name="word">
    <input type="password">
    <input type="submit" value="提交">
</form>
<br>

</body>
</html>

原文地址：https://www.cnblogs.com/txPython/p/11837756.html