标签:
<title>你好明天</title>
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <base href="http://images.cnblogs.com/cnblogs_com/suoning/845162/"/> 7 <base target="_blank" /> 8 </head> 9 <body> 10 11 <img src="o_s.png" alt="图片加载失败。。。"/> 12 <a href="http://cnblogs.com/suoning/">nick blogs</a> 13 14 </body> 15 </html> 16 17 # 上面这段代码中,<img>标签的src属性是一个相对路径,因为<head>中通过base标签设置了链接的默认地址, 18 所以img的src实际的地址是“http://images.cnblogs.com/cnblogs_com/suoning/845162/o_s.png”。 19 同样的,<a>中只是指定了href,并未指定target属性,所以也会使用base中设置的target属性的值。
<link rel="icon" href="http://www.jd.com/favicon.ico">
<meta http-equiv="Content-Type" content="text/html ;charset=UTF-8"/>
<meta http-equiv="Refresh" content="2">
<meta http-equiv="Refresh" content="2;URL=https://www.baidu.com">
<meta http-equiv="expires" content="6 Jun 2016"/>
<meta name="keywords" content="搜索关键字"> <meta name="description" content="简要描述"> <meta name="author" content="http://cnblogs.com/suoning"> <meta name="generator" content="用以说明生成工具">
block(块)元素的特点:
inline(内联)元素的特点:
对行内元素,需要注意如下:
<body>
<h1>你好</h1>
<h2>大家好</h2>
美女好<b>美女好</b>
<p>哇!美女啊,<br>去校花网</p>
价格:<strike>998</strike> 18元
<hr>
alex<b><em>alex</em></b><em>alex</em>
H<sub>2</sub>o
<div>坚持</div>
</body>
> >
< <
空格
" 引号
© 版权符号
更多:http://www.cnblogs.com/web-d/archive/2010/04/16/1713298.html
<body>
<a href="#123">跳到尾部</a><br>
<a href="http://baidu.com" target="_blank">喜欢我就点我吧</a>
<p><a href="http://baidu.com">点我吧</a></p>
<p><a href="http://baidu.com" target="_parent">点我</a></p>
<a href="http://baidu.com" target="_top">就点我吧</a>
<div style="background:red;height:1500px">就是你</div>
<div id="123">跳到这里</div>
</body>
发送邮件:
<a href="mailto:xxx@xx.com">邮件联系</a>
发起qq临时会话
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=630571017&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:630571017:51" alt="点击这里给我发消息" title="点击这里给我发消息"/></a>
<p><a href="tencent://message/?uin=2183958037" target="_blank"><img style="border:0px;" src=http://wpa.qq.com/pa?p=1:707321921:13></a></p>
1 # 更多图片地址如下: 2 # http://wpa.qq.com/pa?p=1:707321921:1 3 # http://wpa.qq.com/pa?p=1:707321921:2 4 # http://wpa.qq.com/pa?p=1:707321921:3 5 # http://wpa.qq.com/pa?p=1:707321921:4 6 # http://wpa.qq.com/pa?p=1:707321921:5 7 # http://wpa.qq.com/pa?p=1:707321921:6 8 # http://wpa.qq.com/pa?p=1:707321921:7 9 # http://wpa.qq.com/pa?p=1:707321921:8 10 # http://wpa.qq.com/pa?p=1:707321921:9 11 # http://wpa.qq.com/pa?p=1:707321921:10 12 # http://wpa.qq.com/pa?p=1:707321921:11 13 # http://wpa.qq.com/pa?p=1:707321921:12 14 # http://wpa.qq.com/pa?p=1:707321921:13
<body>
<img src="1-160I00P938.jpg" title="美女中的美女哦" align="top">和美女在一起就是真爱
<img src="1-160I00P938.jpg" title="美女中的美女哦" align="middle">和美女在一起就是真爱
<p><img src="155.jpg" title="美女中的美女哦" alt="图片加载失败。。。"></p>
</body>
<li>主要的属性有:type、value两个
<body>
<ul>
<li type="circle">a</li>
<li type="1">b</li>
<li>c</li>
</ul>
<ol>
<li value="6">d</li>
<li>e</li>
</ol>
<dl>
<dt>标题</dt>
<dd>第一项</dd>
<dd>第二项</dd>
</dl>
</body>
<body>
<table border="1">
<caption>女神表</caption>
<thead>
<tr>
<th>序号</th>
<th>姓名</th>
<th>女神</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>nick</td>
<td>可可西</td>
</tr>
</tbody>
</table>
</body>
HTML表单用于接收不同类型的用户输入,用户提交表单时向服务器传输数据,从而实现用户与web服务器的交互。表单标签,要提交的所有内容都应该在该标签中。
属性:action、method、enctype
<body>
<form action="https://www.baidu.com/s">
<input type="text" name="wd">
<input type="submit" value="百度一下">
</form>
<form action="https://www.sogou.com/web">
<input type="text" name="query">
<input type="submit" value="搜狗搜索">
</form>
</body>
size(指定表单元素的初始宽度,当type为text或password时,表单元素的大小以字符为单位)
maxlength(type为text或password时,表示输入的最大字符数)
readonly 只读
placeolder 框内预置内容(灰色),写上内容时才消失
name(将name的值设置为相同值,才表示一组数据,才能实现单选功能)
value(必须要写,提交到服务器的key值,实际开发过程中value一般是编号)
checked(是否被选中的状态)
name(名字要一样才是一组数据)
value(提交到服务器的值)
checked
友好设计:不只是选中复选框才能选中并打钩,要求点击对应的文字也能选中该复选框。这种情况下要用到<label>标签的for属性(for=“id”即可)
<body>
<form>
<p>姓名<input type="text"></p>
<label for="name">姓名</label>
<input id="name" type="text">
</form>
</body>
<body>
<form>
<fieldset>
<legend>温馨提示</legend>
<div align="middle">不要忘记点赞哦</div>
</fieldset>
</form>
</body>
对于不同的输入类型,value属性的用法也不同
<body>
<form action="" method="post" enctype="multipart/form-data">
<p>用户名<input type="text" name="query"></p>
<p>密码<input type="password" size="100" maxlength="6"></p>
<p><input type="radio" name="sex" value="1">男</p>
<p><input type="radio" name="sex" value="2">女</p>
<input type="checkbox" name="hobby" value="bb">篮球
<br>
<input type="checkbox" name="hobby" value="fb">足球
<br>
<input type="button" value="按钮">
<br>
<input type="file" name="file_name">
<br>
<select name="IT">
<optgroup label="IT">
<option value="c++">c++</option>
<option value="Java">Java</option>
<option value="python">python</option>
</optgroup>
</select>
<br>
<select name="pro">
<optgroup label="江西省">
<option value="1">宜春</option>
<option value="2">萍乡</option>
<option value="3">南昌</option>
</optgroup>
</select>
<br>
备注
<textarea name="textarea"></textarea>
<p>
<label for="in">姓名</label>
<input id="in" type="text">
</p>
<p><input type="submit" value="提交"></p>
<fieldset style="width:200px">
<legend>python</legend>
<input type="text">
</fieldset>
</form>
</body>
详见http://www.cnblogs.com/suoning/p/5614372.html
标签:
原文地址:http://www.cnblogs.com/xinsiwei18/p/5719651.html