24、Python之html+CSS

最新推荐文章于 2023-02-10 21:08:41 发布

VIP文章 a_460708485

最新推荐文章于 2023-02-10 21:08:41 发布

阅读量410

点赞数 2

原文链接：http://www.cnblogs.com/win0211/p/8760448.html

版权

一、html

其实html是非常简单的一门前端语言，我们学习html的过程实际上就是去记住html标签的用法，这就跟你去记忆英文单词一样的，首先我们先整体了解一下html语言的结构，一个基本的html结构如下

<!DOCTYPE html>  <!-- 表示使用标准的html规则 -->
<html lang="en"> <!-- 表示英语页面 -->
<head>           <!-- 表示html的头-->
</head>
<body>          <!-- 表示html的身体 -->
</body>
</html>

html主要由head和body组成，head中主要定义了一些与页面自身的信息相关的标签，就跟人的大脑一样我们是看不到head中的内容的（除了title标签）。body中的标签就是为了展示整个页面的内容，而我们在写页面时，基本都是在body中进行coding。在html中，标签分为自闭和标签（<meta charset="UTF-8"/>）和主动闭合标签(<a></a>)。

1、head中的标签

<title>python_html</title> 设置页面的标题

2、body中的标签

---图标   > <

---p标签段落

---br标签换行

---div标签白板

---H系列（h1--h6）字体加大加粗

---span 白板

如果你都尝试的使用了上面的标签，你会发现有的标签独占一行，有的标签只占一小块，我们说在html中所有的标签分为2类：

1、块级标签（div、H系列、p）

2、行内标签（span）

input系列+form标签

input type='text' ---- name属性，value='test'

input type='password' ------ name属性，value='test'

input type = 'button' -------- value='提交' 提交按钮，表单

input type = 'button' ----------value = '登录' 按钮

input type = 'radio' - 单选框 value，checked="checked"，name属性（name相同则互斥）

input type='checkbox' - 复选框 value, checked="checked"，name属性（批量获取数据）
input type='file' - 依赖form表单的一个属性 enctype="multipart/form-data"
input type='rest' - 重置

<textarea >默认值</textarea> - name属性

select标签 - name,内部option value, 提交到后台，size，multiple

- a标签

- 跳转

- 锚 href='#某个标签的ID' 标签的ID不允许重复

- img
src - 图片的地址
alt - 图标资源不存在时候显示
title - 鼠标移动到图片上显示文字

- 列表
ul
li
ol
li
dl
dt
dd

- 表格
table
thead
tr
th
tbody
tr
td
colspan = '' 跨列
rowspan = '' 跨行

- fieldset 文件
下面的代码中，包含上面标签的实例。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<a href="http://www.baidu.com">牛&nbsp;B</a>
<h1>高文祥</h1>
<h2>高文祥</h2>
<h3>高文祥</h3>
<h4>高文祥</h4>
<p>p标签</p>
<h5>高文祥</h5>
<span>span标签</span>
<h6>高文祥</h6>
<div>
    <div style="background-color: #ff6600;height: 48px">ddds</div>
    <div></div>
    <div></div>
</div>
<div>
    <fieldset>
        <legend>登录</legend>
        <label for="username">用户名:</label>
        <br/>
        <input id = "username" type="text" name="user"/>
    </fieldset>
</div>
<div>
    <div>
            <span>

            </span>
    </div>
</div>
<form action="index.html" method="GET" enctype="multipart/form-data">
    <input type="text" name="user"/>
    <input type="password" name="pwd"/>
    <input type="button" value="登录">
    <input type="submit" value="提交">
    <input type="reset" value="重置">

    <div>
        <table border="1">
            <tr>
                <th>主机</th>
                <th>端口</th>
                <th>操作</th>
            </tr>
            <tr>
                <td>192.168.12.1</td>
                <td>8080</td>
                <td>
                    <a href

最低0.47元/天解锁文章

a_460708485

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
24、Python之html+CSS

一、html 其实html是非常简单的一门前端语言，我们学习html的过程实际上就是去记住html标签的用法，这就跟你去记忆英文单词一样的，首先我们先整体了解一下html语言的结构，一个基本的html结构如下<!DOCTYPE html> <html lang="en"> <!-...
复制链接

扫一扫