【HTML】HTML学习笔记

1、HTML是网页内容的载体,可以包含文字、图片、视频
2、CSS样式是表现,如标题字体、颜色变化,或为标题加入背景图片、边框
3、JavaScript用来实现网页上的特效效果(有动画的)
4、标题:<h1></h1> 1-6字号由大到小
5、段落:<p></p>
6、图片:<img src="图片地址" alt="下载失败时的替换文本" title = "提示文本">
(1)src:标识图像的位置
(2)alt:指定图像的描述性文本,当图像不可见时(下载不成功时),可看到该属性指定的文本
(3)title:提供在图像可见时对图像的描述(鼠标滑过图片时显示的文本)
(4)图像可以是GIF,PNG,JPEG格式的图像文件
7、HTML不区分大小写
8、根标签:<html></html>所有网页标签都在这个标签中。
9、头部元素的容器:<head></head>
(1)<title></title>网页的标题信息,出现在浏览器的标题栏中。
(2)<meta>
(3)<link>
(4)<style></style>
(5)<script></script>
10、注释:<!--文字-->
11、斜体:<em></em>(<i>)
12、粗体:<strong></strong>( <b>)
13、设置单独的样式:<span></span>
前面要在<style></style>标签里加入span{格式}
14、短文本引用:<q></q>显示与众不同的引用双引号
15、长文本引用:<blockquote></blockquote>显示缩进
16、换行:<br/>
17、空格:&nbsp;
18、HTML语言是对空格和换行不敏感的
19、分隔的水平横线:<hr/>
20、显示地址(电子邮件地址、签名、文档的作者身份):<address></address>显示斜体
21、加代码:
(1)只加一行:<code></code>
(2)加多行:<pre></pre>会保留代码段里的换行/空格
22、显示没有前后顺序的列表:<ul> </ul> 每一个选项在这个标签里加<li></li>
其中每项li前都自带一个圆点
23、显示有前后顺序的列表:<ol> <ol> 每一个选项在这个标签里加<li></li>
每项<li>前有序号
24、<div></div>(相当于把一块内容用框框起来)页面上相互关联的一组元素。如网页中的独立的栏目版块,就是一个典型的逻辑部分。
<div id="版块名称"></div>给板块唯一命名
25、创建表格:
(1)<table></table>:整个表格以<table>标记开始、</table>标记结束。
(2)<tbody></tbody>:如果不加<thead><tbody><tfooter> , table表格加载完后才显示。加上这些表格结构, tbody包含行的内容下载完优先显示,不必等待表格结束后在显示,同时如果表格很长,用tbody分段,可以一部分一部分地显示。(通俗理解table 可以按结构一块块的显示,不在等整个表格加载完后显示。)
(3)<tr></tr>:表格的一行,有几对tr 表格就有几行。
(4)<td></td>:表格的一个单元格,一行中包含几对<td></td>,说明一行中就有几列。(自动垂直居中)
(5)<th></th>:表格的头部的一个单元格,表格表头。显示加粗居中
(6)表格中列的个数,取决于一行中数据单元格的个数。
(7)为表格添加标题:<caption></caption>
(8)表格摘要:<table summary="表格简介文本">不会在浏览器里面显示出来
(9)超链接:<a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a> title的内容可以和链接显示的文本一样
在新建窗口打开链接:<a href="目标网址" target="_blank">click here!</a>
26、网页中链接邮件地址:
注意:如果mailto后面同时有多个参数的话,第一个参数必须以“?”开头,后面的参数每一个都以“&”分隔。
27、HTML表单(把浏览者输入的数据传送到服务器端,例如登录):<form method="传送方式" action="服务器文件"></form>
.(1)action :浏览者输入的数据被传送到的地方,比如一个PHP页面
(2)method :get/post
(3)<form> <input type="text/password" name="名称" value="文本" /></form>
1)type:
   当type="text"时,输入框为文本输入框;
   当type="password"时, 输入框为密码输入框。
2)name:为文本框命名,以备后台程序ASP 、PHP使用。
3)value:为文本输入框设置默认值。(一般起到提示作用)
(4)文本域支持多行文本输入:<textarea rows="行数" cols="列数">文本</textarea>(就是文本框的长宽)
(5)单选框复选框:<input type="radio/checkbox" value="值" name="名称" checked="checked"/>
1)type:
   当 type="radio" 时,控件为单选框
   当 type="checkbox" 时,控件为复选框
2)value:提交数据到服务器的值(后台程序PHP使用)
3)name:为控件命名,以备后台程序 ASP、PHP 使用
4)checked:当设置 checked="checked" 时,该选项被默认选中
5)同一组的单选按钮,name 取值一定要一致
(6)下拉列表框:<select> <option value="向服务器提交的值">显示的值</option> </select>
selected="selected":设置这个属性,则该选项就被默认选中。
(7)下拉列表框多选:在<select>标签中设置multiple="multiple"属性。Ctrl+单机可以实现多选
(8)提交按钮:<input type="submit" value="提交">value显示按钮上的文字
(9)重置按钮:<input type="reset" value="重置">
(10)label:<label for="控件id名称">当用户单击选中该label标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。

没有更多推荐了,返回首页