python基础6-web之html
1.设置字符编码
<meta http-equiv="content-type" content="text/html;charset=utf-8">
2.刷新和跳转
<meta http-equiv="Refresh" Content="30">
<meta http-equiv="Refresh" Content="5;Url=http://www.baidu.com" />
3.关键词
<meta name="keywords" content="星际2，星际，星际老男孩，专访，JOY">
4.描述
cnblogs
5.兼容 X-UA-Compatible
微软IE6是通过XP,2003等操作系统发布出来，作为占统治地位的桌面操作系统，也使得IE占据了统治地位，许多网站开发的时候，就按照IE6的标准去开发
也就是微软自己的标准，到了IE7，采用了微软内部标准及部分W3C标准，导致许多网站升级到IE7，就比较麻烦，很多代码需要调整，才能正常运行，到IE8
基本把微软抛弃，全面支持W3C标准，就出现以前IE支持的，在IE8无法正常访问，所以就是在IE8引入了文档兼容性概念。
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7 " />
6.标签常用
title 网页头部信息
Link
1）.css
<link rel="stylesheet" type="text/css" href="css/common.css"
2）.icon
<link rel="shortcut icon" href="image/favicon.ico">
本地测试
pycharm测试
注释 <!-- 注释内容 -->
meta标签 编码，跳转，刷新，关键字，描述，IE兼容
<meta http-equiv="X-UA-Compatible" content="IE=IE9;IE=IE8 " />
网页特殊符号html代码大全
http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html
body标签
图标， > <
p 段落
br 换行
=======小结
所有标签分类：
块级标签：dev(白板)，H系列（加大加粗），p(段落和段落间有间距)
行内标签（又名内联标签）：span(白板)
标签间可以嵌套
标签存在的意义：css操作，js操作
ps:chrome审查元素的使用
定位
查看样式
本地启动一个服务，通过socket，如下
import socket def handle_request(client): buf = client.recv(1024) client.send(bytes("HTTP/1.1 200 OK\r\n\r\n",encoding='utf-8')) client.send(bytes("Hello,World !!!",encoding='utf-8')) def main(): sock = socket.socket(socket.AF_INET,socket.SOCK_STREAM) sock.bind(('localhost',8000)) sock.listen(5) while True: connection,address = sock.accept() handle_request(connection) connection.close() if __name__ == '__main__': main()
html常用的标签，
示例代码1如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form action="http://127.0.0.1:8888/index" method="post"> <input type="text" name="user" /> <input type="text" name="email" /> <input type="password" name="pwd" /> <!-- form中action是提交到后台的地址 信息存为一个字典{'user':"xx","email":"xx","pwd":"xx"} --> <input type="button" value="登录1" /> <input type="submit" value="登录2" /> </form> <br /> <form acton="http://www.baidu.com"> <input type="text" name="tn" /> <input type="submit" /> </form> <form enctype="multipart/form-data"> <div> <p>请选择性别：</p> 男<input type="radio" checked="checked" name="gender" value="1" /> 女<input type="radio" name="gender" value="2" /> other<input type="radio" name="gender" value="3" /> <p>爱好：</p> backetball<input type="checkbox" checked="checked" name="favor" value="1" /> football<input type="checkbox" name="favor" value="2" /> swim<input type="checkbox" name="favor" value="3" /> <p>技能：</p> 撩妹<input type="checkbox" name="skill" checked="checked"/> 码代码<input type="checkbox" name="skill" /> <p>上传文件</p> <input type="file" name="fname" /> <select name="city" size="10" multiple="multiple"> <optgroup label="山西"> <option value="1">太原</option> <option value="2">忻州</option> </optgroup> <optgroup label="山东"> <option value="1">淄博</option> <option vlaue="2"></option> </optgroup> </select> </div> <br /> <input type="submit" value="提交"/> <input type="reset" value="重置" /> </form> <br /> <a href="http://www.baidu.com" target="_blank">百度</a> <!-- _blank在新的窗口打开链接--> <br /> <a href="http://www.baidu.com" target="_parent">百度</a> <!-- _parent在原窗口打开链接--> <br /> <a href="http://www.baidu.com" target="_self">百度</a> <!-- _self在原窗口打开链接--> <br /> <a href="http://www.baidu.com" target="_top">百度</a> <!-- _top在原窗口打开链接--> <br /> <p> <a href="#i1">第一章</a> <!--a标签的另一种方式锚，href=#+id ,应用：例如跳转到第几楼的评论 --> <a href="#i2">第二章</a> <a href="#i3">第三章</a> <a href="#i4">第四章</a> </p> <p> <span>问题描述</span> <textarea name="描述">默认值</textarea><!--<textarea>默认值</textarea> -name属性 --> </p> <div id="i1" style="height: 950px;">第一章的内容</div> <div id="i2" style="height: 950px;">第二章的内容</div> <div id="i3" style="height: 950px;">第三章的内容</div> <div id="i4" style="height: 950px;">第四章的内容</div> </body> </html>
示例代码2如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>img</title> </head> <body> <img src="早上好.jpg" title="逻辑图" style="height:800px;width:900px;" alt="CLM逻辑"/> </body> </html>
示例代码3如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>List</title> </head> <body> <ul> <li>新闻1</li> <li>新闻2</li> <li>新闻3</li> </ul> <ol> <li>新闻1</li> <li>新闻2</li> <li>新闻3</li> </ol> <dl> <dt>title1</dt> <dd>documnet1</dd> <dd>document2</dd> <dd>document3</dd> <dt>title2</dt> <dd>documnet1</dd> <dd>document2</dd> <dd>document3</dd> </dl> </body> </html>
示例代码4如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>table</title> </head> <body> <table border="1"> <thead> <tr> <th>host</th> <th>port</th> <th> operation <a href="http://www.baidu.com" >百度</a> </th> </tr> </thead> <tbody> <tr> <td colspan="2">1</td> <!-- colspan合并单元格，同行内合并多列--> <td>3</td> </tr> <tr> <td rowspan="2">4</td> <!-- rowspan合并单元格，同列内合并多行--> <td>5</td> <td>6</td> </tr> <tr> <td>8</td> <td>9</td> </tr> </tbody> </table> </body> </html>
示例代码5如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>label</title> </head> <body> <label for="username">用户名</label> <!-- label和input结合，点击label内文字“用户名“，可以使关联的标签获取光标，（输入框），通过for关联id --> <input id="username" type="text" name="user" /> <br /> <p>特殊需求如下，用fieldset标签实现，legend只负责框左上角的边框线打开缺口，以便填入其他文字，</p> <fieldset> <legend>登录框</legend> <label for="uname">账号</label> <input id="uname" type="text" name="user1" /> <label for="pwd">密码</label> <input id="pwd" type="password" name="password1" /> </fieldset> </body> </html>
浙公网安备 33010602011771号