html操作

HTML（hyper text markup language）：

超文本标记语言，标准通用标记语言下的一个应用。

超文本就是指页面内可以包含图片、连接、音乐、程序等非文字元素。

超文本标记语言的结构包括“头”部分（head）和“主体”部分。其中“头”部提供关羽网页的信息，“主体”部分提供网页的具体内容。

1、定义：

超级文本标记语言是标准通用标记语言下的一个应用，也是一种规范，一种标准。超文本标记语言通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本中添加标记符，可以告诉浏览器如何显示其中的内容（如文字如何处理，画面如何安排，图片如何显示等）。浏览器按顺序阅读网页文件，然后根据标记符解释和显示标记的内容，对书写出错的标记将不指出其错误，且不停止其解释执行过程，编织者只能通过显示效果来分析出错原因和出错部位。但需要注意的是，对于不同的浏览器，对同一标记符可能会有不完全相同的解释，因为可能会有不同的显示效果。

2、基本组成：

<!DOCTYPE html>  <!--文档类型；后面参数意义是浏览器按什么标准来解释网页。-->

<html lang="en">

<head>

    <!-- html编码类型-->

    <meta charset="UTF-8">

    <!--刷新与跳转-->

    <!--<meta http-equiv="Refresh" content="2">-->

    <!--<meta http-equiv="Refresh" content="3; Url=http://www.163.com">-->

    <!--关键字与描述-->

    <meta name="keywords" content="fuck">

    <meta name="description" content="fuck you everyday">

    <!--标头的图标-->

    <!--<link rel="shortcut icon" href="1.png"/>-->

    <link rel="stylesheet" type="text/css" href="1.png">

    <title>标头</title>

</head>

<!-- 下面部分是浏览器呈现的内容-->

<body>

</body>

基本信息

3、标签、样式、等：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <!--刷新与跳转-->

    <!--<meta http-equiv="Refresh" content="2">-->

    <!--<meta http-equiv="Refresh" content="3; Url=http://www.163.com">-->

    <!--关键字与描述-->

    <meta name="keywords" content="fuck">

    <meta name="description" content="fuck you everyday">

    <!--标头的图标-->

    <!--<link rel="shortcut icon" href="1.png"/>-->

    <link rel="stylesheet" type="text/css" href="1.png">

    <title>标头</title>

</head>

<body>

    <!--特殊符号，大于、空格、小于-->

    <a href="http://www.baidu.com">一人&nbsp;&lt;饮酒&gt;醉</a>

    <p>你好，换行吧<br/> ok,换完了</p>

    <p>p标签用来做段落</p>

    <h1>我是h1</h1>

    <h6>我是h6</h6>

    <span>我是span标签1</span>

    <span>我是span标签2，默认是白板的</span>

    <div>我是div标签，默认我是白板的</div>

    <form action="http://localhost:6969/index" method="get">

        <input type="text" name="user"/>

        <input type="password" name="pwd"/>

        <input type="button" value="button"/>

        <input type="submit" value="submit"/>

    </form>

    <form action="https://www.sogou.com/web">

        <input type="text" name="query" value="我是默认值"/>

        <input type="submit" name="搜索" />

    </form>

    <form>

        <div>

            <p>性别：</p>

            男<input type="radio" name="gender" value="M" checked="checked"/>

            女<input type="radio" name="gender" value="F"/>

            <p>爱好：</p>

            撩妹<input type="checkbox" name="hobby" value="1" checked="checked"/>

            健身<input type="checkbox" name="hobby" value="2" checked="checked"/>

            上网<input type="checkbox" name="hobby" value="3"/>

        </div>

        <p>备注:

            <textarea name="ps">默认值</textarea>

        </p>

        <input type="submit" value="提交"/>

        <input type="reset" value="重置"/>

    </form>

    <form enctype="multipart/form-data">

        <p>上传照片</p>

        <input type="file" name="fname"/>

        <input type="submit" value="提交"/>

    </form>

</body>

</html>

基本设置

#!/usr/bin/env python

# -*- coding:utf-8 -*-

# Author:Tong Cable

import tornado.web

import tornado.ioloop

class MainHandler(tornado.web.RequestHandler):

    def get(self):

        print('')

        u = self.get_argument('user')

        p = self.get_argument('pwd')

        if u == 'cab' and p == '':

            self.write('登陆成功')

        else:

            self.write('登录失败')

    def post(self, *args, **kwargs):

        u = self.get_argument('user')

        p = self.get_argument('pwd')

        print(u,p)

        if u == 'cab' and p == '':

            self.write('恭喜你，登陆成功')

        else:

            self.write('用户名或密码错误')

application = tornado.web.Application([

    (r"/index", MainHandler),

])

if __name__ == '__main__':

    application.listen(6969)

    tornado.ioloop.IOLoop.instance().start()

server

4、select及a标签等：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <div>

        <select>

            <option value="1" >北京</option>

            <option value="2">山东</option>

            <option value="3" selected="selected">上海</option>

            <option value="4">深圳</option>

        </select>

    </div>

    <hr/>

    <div>

        <select size="5" multiple="multiple">

            <option value="1" >北京</option>

            <option value="2">山东</option>

            <option value="3" selected="selected">上海</option>

            <option value="4">台湾</option>

            <option value="5" >西藏</option>

            <option value="6">新疆</option>

            <option value="7" selected="selected">广东</option>

            <option value="8">海南</option>

        </select>

    </div>

    <div>

        <select size="5" multiple="multiple">

            <optgroup label="北京">

                <option value="1" >朝阳</option>

                <option value="2">丰台</option>

                <option value="3" >昌平</option>

                <option value="4">大兴</option>

            </optgroup>

            <optgroup label="山东">

                <option value="5" >德州</option>

                <option value="6">济南</option>

                <option value="7" selected="selected">青岛</option>

                <option value="8">淄博</option>

            </optgroup>

            <optgroup label="黑龙江">

                <option value="5" >哈尔滨</option>

                <option value="6">鸡西</option>

                <option value="7" selected="selected">北安</option>

            </optgroup>

        </select>

    </div>

    <hr/>

    <a href="#i1">第一章</a>

    <a href="#i2">第二章</a>

    <a href="#i3">第三章</a>

    <div id="i1" style="height: 600px;">第一章内容</div>

    <div id="i2" style="height: 500px">第二章内容</div>

    <div id="i3" style="height: 400px;">第三章内容</div>

</body>

</html>

view

5、图片、超链接、表格等：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<a href="http://www.sogou.com/web?query=麻生希">

    <img src="2.jpg" title="麻生希" style="height: 300px; width: 200px;" alt="美女"/>

</a>

<ul>

    <li>上边那是谁啊？</li>

    <li>已经过时了...</li>

    <li>多么老了她都!</li>

</ul>

<ol>

    <li>那是90年代的事情了</li>

    <li>那天偶然间看到的</li>

    <li>还有桃谷</li>

</ol>

<dl>

    <dt>我是小明，今年12岁</dt>

    <dd>老司机们谈论嘛呢</dd>

    <dd>老司机带带我</dd>

    <dd>老司机发车了，赶紧上车</dd>

    <dt>我是老王，今年96岁</dt>

    <dd>小明们，坐好了</dd>

    <dd>走咯。。。</dd>

</dl>

<table border="1">

    <thead>

        <tr>

            <td>主机名</td>

            <td>端口</td>

            <td>操作</td>

        </tr>

    </thead>

    <tbody>

        <tr>

            <td>10.1.2.19</td>

            <td>8080</td>

            <td>

                <a href="first.html">查看</a>

            </td>

        </tr>

        <tr>

            <td>10.233.12.128</td>

            <td>9000</td>

            <td>

                <a href="2.jpg">调试</a>

            </td>

        </tr>

         <tr>

            <td rowspan="2">10.233.12.128</td>

            <td colspan="2" >9000</td>

        </tr>

         <tr>

            <td>9000</td>

            <td>

                <a href="1.png">调试</a>

            </td>

        </tr>

    </tbody>

</table>

<br/>

    <!--通过lable的for与input的id进行关联，获取光标，即点击文字就可获取光标？？-->

    <label for="username">用户名</label>

    <input id="username" type="text" name="user"/>

    <br/>

    <fieldset>

        <legend>登陆</legend>

        <lable for="user">用户名：</lable>

        <input id="user" type="text" name="use"/>

        <br/>

        <label for="pwd">密 &nbsp;码：&nbsp;</label>

        <input id="pwd" type="password" name="passwd"/>

    </fieldset>

</body>

</html>

更多：http://www.cnblogs.com/evilliu/p/5750539.html

html操作的更多相关文章

关于DOM的操作以及性能优化问题-重绘重排
写在前面: 大家都知道DOM的操作很昂贵. 然后贵在什么地方呢? 一.访问DOM元素二.修改DOM引起的重绘重排一.访问DOM 像书上的比喻:把DOM和JavaScript(这里指ECMScri ...
Sql Server系列：分区表操作
1. 分区表简介分区表在逻辑上是一个表,而物理上是多个表.从用户角度来看,分区表和普通表是一样的.使用分区表的主要目的是为改善大型表以及具有多个访问模式的表的可伸缩性和可管理性. 分区表是把数据按设 ...
C# ini文件操作【源码下载】
介绍C#如何对ini文件进行读写操作,C#可以通过调用[kernel32.dll]文件中的 WritePrivateProfileString()和GetPrivateProfileString()函 ...
js学习笔记：操作iframe
iframe可以说是比较老得话题了,而且网上也基本上在说少用iframe,其原因大致为:堵塞页面加载.安全问题.兼容性问题.搜索引擎抓取不到等等,不过相对于这些缺点,iframe的优点更牛,跨域请求. ...
jquery和Js的区别和基础操作
jqery的语法和js的语法一样,算是把js升级了一下,这两种语法可以一起使用,只不过是用jqery更加方便一个页面想要使用jqery的话,先要引入一下jqery包,jqery包从网上下一个就可以, ...
ASP.NET Aries 入门开发教程7：DataGrid的行操作（主键操作区）
前言: 抓紧勤奋,再接再励,预计共10篇来结束这个系列. 上一篇介绍:ASP.NET Aries 入门开发教程6:列表数据表格的格式化处理及行内编辑本篇介绍主键操作区相关内容. 1:什么时候有默认的 ...
如何在高并发环境下设计出无锁的数据库操作（Java版本）
一个在线2k的游戏,每秒钟并发都吓死人.传统的hibernate直接插库基本上是不可行的.我就一步步推导出一个无锁的数据库操作. 1. 并发中如何无锁. 一个很简单的思路,把并发转化成为单线程.Jav ...
【翻译】MongoDB指南/CRUD操作（四）
[原文地址]https://docs.mongodb.com/manual/ CRUD操作(四) 1 查询方案(Query Plans) MongoDB 查询优化程序处理查询并且针对给定可利用的索引选 ...
【翻译】MongoDB指南/CRUD操作（三）
[原文地址]https://docs.mongodb.com/manual/ CRUD操作(三) 主要内容: 原子性和事务(Atomicity and Transactions),读隔离.一致性和新近 ...
【翻译】MongoDB指南/CRUD操作（二）
[原文地址]https://docs.mongodb.com/manual/ MongoDB CRUD操作(二) 主要内容: 更新文档,删除文档,批量写操作,SQL与MongoDB映射图,读隔离(读关 ...

随机推荐

JavaScript学习总结(三)——闭包、IIFE、原型、函数与对象
一.闭包(Closure) 1.1.闭包相关的问题请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...
C语言中内存管理规范
一.内存申请 1.建议使用calloc申请内存,尽量不要使用malloc. calloc在动态分配完内存后,自动初始化该内存空间为零,而malloc不初始化,里边数据是随机的垃圾数据. 2.申请内存大 ...
机器学习classification_report方法及precision精确率和recall召回率说明
classification_report简介 sklearn中的classification_report函数用于显示主要分类指标的文本报告．在报告中显示每个类的精确度,召回率,F1值等信息. 主要 ...
【模板 && 拓扑】 Dijkstra 单源最短路径算法
话不多说上代码链式前向星233 #include<bits/stdc++.h> using namespace std; ,_max=0x3fffffff; //链式前向星 struct ...
TCP三次握手是什么？为什么要进行三次握手？两次，四次握手可以吗？
1.第一次握手,发送SYN报文,传达信息:“你好,我想建立连接”: 第二次握手,回传SYN+ACK报文,传达信息:“好的,可以建立链接”: 第三次握手,回传ACK报文,传到信息:“好的,我知道了 ...
【redis中键的生存时间（expire）】
1.redis中可以使用expire命令设置一个键的生存时间,到时间后redis会自动删除它 expire 设置生存时间(单位/秒) pexpire 设置生存时间( ...
java自学-运算符
上一篇介绍了java的变量和数据类型,要对数据处理,还需要用到java运算符,这里只总结下常用的,运算符主要分为以下几类:1 算数运算符算数运算符包括: + 加法运算 - 减法运算 * 乘法运算 / ...
IDEA 的 properties 文件的属性字段如何链接到调用的文件
想要达到的效果: ctrl + 鼠标点击:弹出如下所有使用的文件问题: 有些 IDEA 使用 ctrl + 鼠标点击不能看到使用的文件. 解决办法: ctrl + 鼠标点击,然后选择设置按钮然后 ...
whistle替代Fiddler调试远程服务器代码使用教程
前沿之前在window下开发的同学大部分都是使用Fiddler代理工具做远程调试,自从换了Mac后也想找个代替工具调试,查询了下大概都比较推荐两款:Charles 和 Whistle .不过Char ...
关于JS中闭包的问题
一直以来,我都以为我已经懂了JavaScript中闭包的概念,直到有一次小伙伴突然问我这个概念的时候,我才发现我根本不知道该怎来么跟他来讲述这个概念. 那时候我就知道我是自我欺骗,打肿脸充胖子了. 所 ...

html操作

html操作的更多相关文章

随机推荐

热门专题