通俗的解释:HTML是一个没有穿衣服的人

CSS是穿上了华丽衣服的人

JS是使这个人动起来

HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记)。相当于定义统一的一套规则,大家都来遵守他,这样就可以让浏览器根据标记语言的规则去解释它。

例一:模拟web服务器,供浏览器客户端访问

 
#!/usr/bin/env python
# -*- coding:utf-8 -*-
import socket def handle_request(client):
buf = client.recv(1024)
client.send("HTTP/1.1 200 OK\r\n\r\n") client.send('12345') def main():
sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
sock.bind(('localhost', 8003))
sock.listen(5) while True:
connection, address = sock.accept()
handle_request(connection)
connection.close() if __name__ == '__main__':
main()
 

运行此服务端后,浏览器访问如下:

例二:模拟拟web服务器,供浏览器客户端访问,此时web服务器加上了html等效果

服务端sock(注意这里我加了h1这个html标签,并且设置成了红色字体,端口我换了一个,有冲突,但加上一个重复利用端口参数加上就可以了。)

 
#!/usr/bin/env python
# -*- coding:utf-8 -*-
import socket def handle_request(client):
buf = client.recv(1024)
client.send("HTTP/1.1 200 OK\r\n\r\n") client.send("<h1 style='color:red;'>12345</h1>") def main():
sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
sock.bind(('localhost', 8004))
sock.listen(5) while True:
connection, address = sock.accept()
handle_request(connection)
connection.close() if __name__ == '__main__':
main()
 

运行此服务端后,浏览器访问如下:

例三::不知不觉就写出了一个简介的WEB框架了

服务端sock,这里我读入s.log文件里的内容

 
#!/usr/bin/env python
# -*- coding:utf-8 -*-
import socket def handle_request(client):
buf = client.recv(1024)
client.send("HTTP/1.1 200 OK\r\n\r\n")
a = open('s.log')
data = a.read()
a.close()
client.send(data) def main():
sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
sock.bind(('localhost', 8005))
sock.listen(5) while True:
connection, address = sock.accept()
handle_request(connection)
connection.close() if __name__ == '__main__':
main()
 

s.log文件如下,下面是html内容,为了规范,一般将下面内容存成一个.html后缀的文件

 <h1 style='color:red;'>12345</h1>

运行此服务端后,浏览器访问如下:也能看到有效果出来,说明应用s.log文件里的内容成功。

HTML

新建一个html文件默认内容如下:

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body> </body>
</html>
 

注:HTML的注释使用<!-- 内容 -->来表示,多行同样的适用。

  CSS的注释使用/* 内容 */来表示,多行同样的适用。

  JavaScript注释使用//内容表示单行注释,多行注释使用/*内容*/来注释。

  jQuery是JavaScript的一个代码库(类库),可使用的注释与它一样,用//内容/*内容*/来注释。

HTML head(头)

直接上栗子吧!这样更容易解释与理解。

例一:设置了5秒钟刷新一次页面,并写了一个h1标签显示效果

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
  <!--5秒钟刷新一次页面-->
<meta http-equiv="Refresh" Content="5">
<title></title>
</head>
<body> <h1>ssssss</h1>
</body>
</html>
 

浏览器运行并打开F12网站调度键效果如下:会不断的5s刷新页面

例二:刷新页面并跳转

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--5秒钟刷新一次页面-->
<!--<meta http-equiv="Refresh" Content="5">-->
<!--5秒刷新页面并跳转,跳转后就不刷新了-->
<meta http-equiv="Refresh" Content="5;Url=http://www.taobao.com">
<title></title>
</head>
<body> <h1> ssssssssssssssssssssssss</h1>
</body>
</html>
 

浏览器运行效果如下:5s钟后刷新页面会跳转到www.taobao.com去了

例三:title的使用

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--5秒钟刷新一次页面-->
<!--<meta http-equiv="Refresh" Content="5">-->
<!--5秒刷新页面并跳转-->
<!--<meta http-equiv="Refresh" Content="5;Url=http://www.taobao.com">-->
<title>我的网页头部信息</title>
</head>
<body> <h1> ssssssssssssssssssssssss</h1>
</body>
</html>
 

浏览器运行效果如下:

例四:title下的link来加上icon网页头部图片favicon.icon

制作好的图片需要放在供html文件访问到的位置,这里我放在与html文件相同目录下

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--5秒钟刷新一次页面-->
<!--<meta http-equiv="Refresh" Content="5">-->
<!--5秒刷新页面并跳转-->
<!--<meta http-equiv="Refresh" Content="5;Url=http://www.taobao.com">-->
<title>我的网页头部信息</title>
<!--添加的网页小图标-->
<link rel="shortcut icon" href="favicon.icon" > </head>
<body> <h1> ssssssssssssssssssssssss</h1>
</body>
</html>
 

浏览器运行效果如下:

HTML body

内联标签(自己有多少占多少)

块级标签(占整行)

为了方便实验,我新建了一个h2.html文件。

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <h1 style=""> sssssss</h1>
<a style="">我的页面</a> </body>
</html>
 

其中body下的<a>标签是内联标签,<h1>标签是块级标签

浏览器运行效果如下:

需要注意的是:red与 green后面都有一个分号,这样的话在分号后面还可以设置参数,比如字体字体颜色等

修改成如下<a style="color:antiquewhite;">我的页面</a>

例二:HTML中特殊字符处理

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> &lt;h1&gt; </body>
</html>
 

这里&lt;代表<小于,&gt;代表>大于

浏览器运行如下:

附HTML特殊字符编码对照表:http://www.jb51.net/onlineread/htmlchar.htm

常用标签

  p和br

  p表示段落,默认段落之间是有间隔的

  br是换行

例一:p的使用

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <p>雄姿英雄姿英发</p>
<p>雄姿英雄姿英发</p>
<p>雄姿英雄姿英发</p> </body>
</html>
 

浏览器运行如下:可以看到,段落中间就间隔

例二:br的使用

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <p>雄姿英雄姿英发</p>
<p>雄姿英雄姿资资资资资<br/>资资资资资英发</p>
<p>雄姿英雄姿英发</p> </body>
</html>
 

浏览器运行如下:可以看到,从br代码处分隔了,分隔后没有间隔

例三:各种跳转,锚

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <a target="_blank" href="http://www.taobao.com">新开页面跳转到一个URL地址</a>
<a href="#a2">点击跳转到a2书签</a> <div id="a1" style="height:700px;">1</div> <div id="a2" style="height:500px;">2</div> </body>
</html>
 

 href表示跳转,并且是本页面跳转,加上target="_blank"后表示新开一个页面跳转,href="#a2"表示点击后则会跳转到id为a2标签上面去,#很关键。

浏览器运行如下:

例四:基础下拉菜单

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <select name="group">
<option value="1">上海</option>
<option value="2">北京</option>
<option value="3" selected="selected">广州</option>
</select> </body>
</html>
 

浏览器运行如下:可以看到上面的代码中,selected设置的为广州就表示默认不选择的话就是广州

例五:下拉框(二)

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <select multiple="multiple" size="2">
<option value="1">上海</option>
<option value="2">北京</option>
<option value="3" selected="selected">广州</option>
</select> </body>
</html>
 

浏览器运行如下:Multiple代表可以按着shift多选,size代表下拉框显示多长

例六:下拉框(三)

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <select>
<optgroup label="河北省">
<option>石家庄</option>
<option>邯郸</option>
</optgroup>
<optgroup label="山西省">
<option>太原</option>
<option>平遥</option>
</optgroup>
</select> </body>
</html>
 

浏览器运行如下:label不能选,只是显示一下。

上面已经说到1,各种符号;2,p和br;3,a标签;4,H标签;5,select标签;

接下来就要学习input了

input系列

例一:input 的checkbox(多选框),checked="checked"表示默认勾选上了

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <input type="checkbox" />
<input type="checkbox" />
<input type="checkbox" checked="checked" /> </body>
</html>
 

浏览器运行如下:

例二:input的 radio;Radio一般用于只能选一个的时候,比如性别

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <input type="radio" />
<input type="radio" />
<input type="radio" /> </body>
</html>
 

浏览器运行如下:可以看到默认可以多选

默认的是可以多选的,只要加上一个参数name参数设置为相同就只能单选了

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <input type="radio" />
<input type="radio" />
<input type="radio" />
<hr />
<input type="radio" name="gender"/>
<input type="radio" name="gender"/>
<input type="radio" name="gender"/> </body>
</html>
 

浏览器运行如下:只能单选

例三:input系统文本框

<input /> 不写任何参数默认就是一个文本框

type=”text”表示文本框,type=”password”表示密码文本框

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <input type="text" />
<input type="password" />
<input /> </body>
</html>
 

浏览器运行如下:

例四:input系列button按钮及file文件上传

type=”file”表示上传文件按钮type="text" value="123"表示文本框默认有值123。type=”button”与type=”submit”都表示按钮此处看着没有差别,其实是有差别的,如果submit按钮处于from表单里面,则会将这个from表单提交给后台

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <input type="button" value="提交"/>
<input type="submit" value="提交"/> <input type="file" /> <input type="text" value="123" /> </body>
</html>
 

浏览器运行如下:

以上input系列就完了,值得一提的是,有一个textarea标签与input系列的type=”text”类似,只是textarea标签可以输入多行的框,而text只能单行

例一:使用textarea多行输入框

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <input type="text" value="123" /> <textarea>123 </textarea> </body>
</html>
 

浏览器运行如下:

例二:如果学了css还可以自己指定文本框的大小

下面的style="height:50px;width:50px;"就是指定文件框的大小为50像素

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <input type="text" value="123" /> <textarea style="height:50px;width:50px;">123 </textarea> </body>
</html>
 

浏览器运行如下:

form表单

可以有多个表单存在

例一:表单中使用input系列的submit提交

以下写了两个按钮,但只有submit按钮有效果,button按钮不行。

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body>
<!--第一个表单-->
<form>
<p>用户名:<input type="text" /></p>
<p>密码:<input type="password" /></p>
<input type="submit" value="提交"/>
<input type="button" value="按钮"/>
</form> <!--第二个表单-->
<form>
<p>用户名:<input type="text" /></p>
<p>密码:<input type="text" /></p> </form> </body>
</html>
 

浏览器运行如下:

例二:模拟使用submit按钮提交一个表单,表单开头的method="get"可以不写,默认就是get

注意性别那一栏的value 这里必须要指定一个值用于区别,否则提交给服务器的表单这个性别值为on,服务器区别不出来

 模拟提交表单及性别单选

浏览器运行如下:(此时不能点提交向服务器提交表单,因为我的服务器地址设置的是<form action="http://127.0.0.1:8000/login/" method="get">,这个地址并不能使用)

例三:兴趣爱好可以多选,投票也可以多选

使用input系列的checkbox多选框可以通过设置不同的name及value来区分

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <form action="http://127.0.0.1:8000/login/" method="get">
<p>
用户名:<input type="text" />
</p>
<p>
密码:<input type="password" />
</p>
<p>
部门:<select name="depart">
<option value="1">CEO</option>
<option value="2">DBA</option>
</select>
性别:<input type="radio" name="gender" value="1" />男<br/>
<input type="radio" name="gender" value="2" />女<br/>
<input type="radio" name="gender" value="3" />中<br/> <textarea name="mulit"></textarea> 兴趣爱好: <input type="checkbox" name="favor" value="v1" />
<input type="checkbox" name="favor" value="v2" />
<input type="checkbox" name="favor" value="v3" />
<input type="checkbox" name="favor" value="v4" /> 投票: <input type="checkbox" name="vote" value="v11" />
<input type="checkbox" name="vote" value="v22" />
<input type="checkbox" name="vote" value="v33" />
<input type="checkbox" name="vote" value="v44" />
</p>
<input type="submit" value="提交"/> </form> </body>
</html>
 

浏览器打运行如下:我这里选择了兴趣第一个与每二个框,投票的第二个与第三个框,使用submit按钮提交个表单服务器就能看到提交的值key=favor value=[v1,v2],key=vote value=[v22,v33],这儿同样不能提交

例四:模拟使用submit按钮提交表单(提交到搜狗搜索)

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <form action="https://www.sogou.com/web?">
<p>关键字:<input type="text" name="query"/></p>
<input type="submit" />
</form> </body>
</html>
 

浏览器打运行如下:使用搜狗搜索一般https://www.sogou.com/web?query=我的世界   这样子,我在上面代码中将自己的key定义成了query。这样输入的值就是value了,也就是query=等号后面的值

例五:几种列表格式

label for=”name2” 跟之前说过的锚有点儿相似,这里的效果是点姓名,或婚否这几个中文字会跳到相应的输入框中。

<ul><li>结合使用表示前面的编号为黑点<ol><li>结合使用表示前面的编号为有序的数字

<dl><dt><dd>中<dt>代表相当于省<dd>想当于省下面的市这样的层级关系

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <label for="name2">
姓名:
<input id="name2" type="text">
<label> <label for="marriy2">
婚否:
<input id="marriy2" type="checkbox">
<label> <ul>
<li>sssssssssssssssssssss</li>
<li>sssssssssssssssssssss</li>
<li>sssssssssssssssssssss</li>
<li>sssssssssssssssssssss</li>
</ul> <ol>
<li>sssssssssssssssssssss</li>
<li>sssssssssssssssssssss</li>
<li>sssssssssssssssssssss</li>
<li>sssssssssssssssssssss</li>
</ol> <dl>
<dt>湖南省</dt>
<dd>长沙市</dd>
<dd>株洲市</dd>
<dt>广东省</dt>
<dd>广州市</dd>
<dd>深圳市</dd>
</dl> </body>
</html>
 

浏览器打运行如下:

例六:合并单元格

colspan="2"表示向右合并,占两格。rowspan="2"表示向下合并,占两格。最后面一行的<td>1</td>我删除掉了,不然的话会出现空白行。

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body>
<!--合并单元格-->
<table border="1">
<tr>
<td colspan="2">1</td> <td>3</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td rowspan="2">1</td>
<td>2</td>
<td>3</td>
</tr>
<tr> <td>2</td>
<td>3</td>
</tr>
</table> </body>
</html>
 

浏览器打运行如下:

例七:加深标题单元格

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body>
<!--合并单元格2-->
<table border="1">
<thead>
<tr>
<th>标题1</th>
<th>标题2</th>
<th>标题3</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="2">1</td> <td>3</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td rowspan="2">1</td>
<td>2</td>
<td>3</td>
</tr>
<tr> <td>2</td>
<td>3</td>
</tr>
</tbody> </table> </body>
</html>
 

浏览器打运行如下:

例八:

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <fieldset>
<legend>登陆</legend>
<p>用户名:</p>
<p>密码:</p>
</fieldset> </body>
</html>
 

浏览器运行如下:这种一般不常用。一般自己写的。

例九:div标签及块级与内联标签之间的转换

div不作任何处理,只是作为一个容器,分割页面。div 是块级标签,可以通过display转换为内联标签,他们是可以互相转换的。

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <div style="">div是块级标签</div> <div style="display:inline">块级变内联标签</div>
<a style="display:block">内联标签变块级标签</a> <div>div相当于一个大容器,而小容器则是span标签<span style="display:block">span转换成块级标签后</span></div> </body>
</html>
 

浏览器运行效果如下:

CSS

选择器

有三种方法设置CSS,其中它们的优先级

    最高是自己文件的style=”color:red;”这种

    第二是class=”re”这种

最后才是调用CSS文件

例一:style=”color:red;” 的使用

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <div style="color:red;">
kkkkk
</div> </body>
</html>
 

浏览器运行效果如下:

例二: class=”re”的使用

可以看到,在<head>里面加上了一个<style>指定了一个class为re

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
.re{
color:red;
}
</style> </head>
<body> <span class="re">rerere</span> </body>
</html>
 

浏览器运行效果如下:

例三:调用CSS文件

注意创建CSS文件的时候选择的就是stylesheet这种类型

common.css文件内容如下:

.re{
color:red;
}

h2.html文件如下:

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> <!--调用 common.css文件-->
<link rel="stylesheet" href="common.css" /> </head>
<body> <span class="re">css</span>
<span class="re">css</span>
<span class="re">css</span> </body>
</html>
 

浏览器运行效果如下:也能看到样式应用上了

例四:调用css文件的几种类型

common.css文件内容如下

 
.re{
color:red;
}
#name{
background-color:antiquewhite;
}
span{
font-size:100px;
}
 

上面的.re代表所有class="re"所有这样调用的生效,#name代表所有id是name的就生效,span代表所有的span标签都生效

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> <!--调用 common.css文件-->
<link rel="stylesheet" href="common.css" /> </head>
<body> <span style="color:#dddddd;" class="re">asdf</span>
<span class="re">asdf</span>
<span id="name" class="re">asdf</span> </body>
</html>
 

浏览器运行效果如下:

Background(背景颜色),图片,border(边框)

Common.css文件如下:

 
.re{
color:red;
}
#name{
background-color:antiquewhite;
}
span{
font-size:100px;
}
 

需要一张图片,路径如下:

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> <!--调用 common.css文件-->
<link rel="stylesheet" href="common.css" /> </head>
<body> <!--背景颜色条-->
<div style="">&nbsp;</div>
<!--背景图片-->
<div style="background-image:url('image/4.gif'); height: 80px;"></div>
<!--加上no-repeat避免图片重复-->
<div style="background-image:url('image/4.gif'); height: 80px;background-repeat:no-repeat"></div>
<!--加上边框,solid代表实线,border代表大小,red代表颜色-->
<div style="border:1px solid red; height: 10px;"></div>
<br></br>
<div style="border:1px dotted red; height: 10px;"></div>
<br></br>
<div style="border:1px dashed red; height: 10px;"></div>
<!-- border-left表示左边3px大小的线-->
<div style="border-left:3px solid green;">asdfasdf</div>
<div style="border-right:3px solid green;">asdfasdf</div>
<div style="border-top:3px solid green;">asdfasdf</div>
<div style="border-bottom:3px solid green;">asdfasdf</div> <!--设置style="display:none"后会消失,去掉即展现出来-->
<!--如果display设置为block则将标签由内联标签转换成块级标签,设置为inline则将块级标签设置为内联标签-->
<span id="name" class="re" style="display:none">ssss</span> </body>
</html>
 

浏览器运行效果如下:

Cursor(鼠标)

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> </head>
<body> <div>
<h2>cursor</h2>
<a href="http://www.autohome.com.cn">autohome</a>
<input type="text">
<span>老衲</span> <ul>
<li>css提供的cursor值</li>
<p>
<!--鼠标移动到这些字上面会有不同的状态-->
<span style="cursor:pointer;">pointer</span> ||
<span style="cursor:help;">help</span> ||
<span style="cursor:wait;">wait</span> ||
<span style="cursor:move;">move</span> ||
<span style="cursor:crosshair;">crosshair</span>
</p>
<li>伪造超链接</li>
<p><span style="cursor:pointer;color:blue;">pointer</span></p>
<li>自定义(一般不用)</li>
<p>
<span style="cursor:url(image/favicon.icon),auto;">mine</span>
</p>
</ul>
<br>
</div> </body>
</html>
 

浏览器运行效果如下:

浮动

因为是块级标签会占整行,所以这里设置一个float:left;来往左漂,左对齐。

 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title> <style>
.w-left{
width: 20%;
background-color:red;
height:500px;
float: left;
}
.w-right{
width: 80%;
background-color:green;
height:500px;
float: left;
}
</style> </head>
<body> <div>
<div class="w-left"></div>
<div class="w-right"></div>
</div> </body>
</html>
 

浏览器运行效果如下:

HTML编程的更多相关文章

  1. 从直播编程到直播教育:LiveEdu.tv开启多元化的在线学习直播时代

    2015年9月,一个叫Livecoding.tv的网站在互联网上引起了编程界的注意.缘于Pingwest品玩的一位编辑在上网时无意中发现了这个网站,并写了一篇文章<一个比直播睡觉更奇怪的网站:直 ...

  2. JavaScript之父Brendan Eich,Clojure 创建者Rich Hickey,Python创建者Van Rossum等编程大牛对程序员的职业建议

    软件开发是现时很火的职业.据美国劳动局发布的一项统计数据显示,从2014年至2024年,美国就业市场对开发人员的需求量将增长17%,而这个增长率比起所有职业的平均需求量高出了7%.很多人年轻人会选择编 ...

  3. 读书笔记:JavaScript DOM 编程艺术(第二版)

    读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...

  4. [ 高并发]Java高并发编程系列第二篇--线程同步

    高并发,听起来高大上的一个词汇,在身处于互联网潮的社会大趋势下,高并发赋予了更多的传奇色彩.首先,我们可以看到很多招聘中,会提到有高并发项目者优先.高并发,意味着,你的前雇主,有很大的业务层面的需求, ...

  5. C#异步编程(一)

    异步编程简介 前言 本人学习.Net两年有余,是第一次写博客,虽然写的很认真,当毕竟是第一次,肯定会有很多不足之处, 希望大家照顾照顾新人,有错误之处可以指出来,我会虚心接受的. 何谓异步 与同步相对 ...

  6. UE4新手之编程指南

    虚幻引擎4为程序员提供了两套工具集,可共同使用来加速开发的工作流程. 新的游戏类.Slate和Canvas用户接口元素以及编辑器功能可以使用C++语言来编写,并且在使用Visual Studio 或 ...

  7. C#与C++的发展历程第三 - C#5.0异步编程巅峰

    系列文章目录 1. C#与C++的发展历程第一 - 由C#3.0起 2. C#与C++的发展历程第二 - C#4.0再接再厉 3. C#与C++的发展历程第三 - C#5.0异步编程的巅峰 C#5.0 ...

  8. 猫哥网络编程系列:HTTP PEM 万能调试法

    注:本文内容较长且细节较多,建议先收藏再阅读,原文将在 Github 上维护与更新. 在 HTTP 接口开发与调试过程中,我们经常遇到以下类似的问题: 为什么本地环境接口可以调用成功,但放到手机上就跑 ...

  9. 关于如何提高Web服务端并发效率的异步编程技术

    最近我研究技术的一个重点是java的多线程开发,在我早期学习java的时候,很多书上把java的多线程开发标榜为简单易用,这个简单易用是以C语言作为参照的,不过我也没有使用过C语言开发过多线程,我只知 ...

  10. 异步编程 In .NET

    概述 在之前写的一篇关于async和await的前世今生的文章之后,大家似乎在async和await提高网站处理能力方面还有一些疑问,博客园本身也做了不少的尝试.今天我们再来回答一下这个问题,同时我们 ...

随机推荐

  1. HDOJ2222 Keywords Search-AC自动机

    Problem Description In the modern time, Search engine came into the life of everybody like Google, B ...

  2. vsftpd 修改默认目录

    默认配置下: 匿名用户登录 vsftpd 服务后的根目录是 /var/ftp/:系统用户登录 vsftpd 服务后的根目录是系统用户的家目录. 若要修改登录 vsftpd 服务后的根目录,只要修改 / ...

  3. 【MySQL】MySQL无基础学习和入门大纲

    一.安装 1.yum安装 2.分发包安装 3.配置文件 4.初始化数据库 二.启动 1.service mysqld start默认配置启动 2.mysqld_safe方式加载配置文件启动 3.mys ...

  4. 0601 Spring2.0 发布会及产品发展方向

    ProductBacklog:继续向下细化; 1.界面美化,统一界面风格,以简洁美观为主: 2.丰富版面的内容,吸引用户: 3.尝试增加新的版面: Sprint 计划会议:确定此次冲刺要完成的目标 1 ...

  5. Python自动化 【第五篇】:Python基础-常用模块

    目录 模块介绍 time和datetime模块 random os sys shutil json和pickle shelve xml处理 yaml处理 configparser hashlib re ...

  6. C# 连接 Oracle 的几种方式

    一:通过System.Data.OracleClient(需要安装Oracle客户端并配置tnsnames.ora)1. 添加命名空间System.Data.OracleClient引用2. usin ...

  7. Bootstrap导航点击菜单跳转与点击缩放菜单折叠按钮缓冲效果插件jquery.singlePageNav.min.js

    引入步骤: <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></scrip ...

  8. C#DataGridView中的常用技巧

    0(最基本的技巧). 获取某列中的某行(某单元格)中的内容  this.currentposition = this.dataGridView1.BindingContext  [this.dataG ...

  9. Devexpress VCL Build v2014 vol 15.2.3 发布

    2016年第一个版本,继续修补. New Major Features in 15.2 What's New in VCL Products 15.2 Breaking Changes To lear ...

  10. static 变量

    被static 修饰的变量全部称为静态变量.所有的静态变量全部存储在静态存储区.按静态变量定义的位置不同,又分为全局静态变量和局部静态变量. 1)全局静态变量 在全局变量的说明前加上static,就是 ...