计算机
分为硬件和软件。
硬件:电脑、手机。
软件:C/S开发:C#、C++、C 等。
B/S开发:Java、PHP、Python,等等。
软件测试:测试软件。
网络:维护等。
1.html简介
超文本 标记 语言
后缀名:xxx.html/xxx.htm
写网页的编辑器:DW、txt、Hbuilder、等等。
调试网页的方法:浏览器调试:
谷歌、火狐、IE、欧朋、safari浏览器
2.html基本结构
<html>
<head>
<title></title>
</head>
<body></body>
</html>
插:
< meta charset=“utf-8” />:
设置页面的编码方式:UTF-8/GBK
< meta http-equiv=“refresh” content=“3;url=http://www.baidu.com”/ >
设置页面3秒刷新,并且跳转至某个网站
3.网页
网页分为静态页面和动态页面
(1)静态网页:静态网页也称为普通网页,是相对网页而言的。静态网页不是指 网页中的元素都是静止不动的,而是指网页文件中没有程序代码,只 有 HTML(超文本标记语言)标记,一般后缀为.htm、.html、.shtml 或.xml 等。
(2)动态网页:动态网页是指在网页文件中除了 HTML 标记以外,还包括一些实现 特定功能的程序代码,这些程序代码使得浏览器与服务器之间可以进 行交互,即服务器端可以根据客户端的不同请求动态产生网页内容。动态网页的后缀名通常根据所用的程序设计语言的不同而不同,一般 为.asp、.aspx、cgi、.php、.perl、.jsp 等。
4.Html 标题、段落、换行与字符实体
(1)标题标签:<h1>——<h6>
(2)段落标签:<p>
(3) 强制换行符:<br />
(4)预先格式化标签:
< pre >
基本标签学习 基本标签学习 基本标签学习 基本标签学习
< /pre >
(5)字符格式化标签:
加粗:<b></b> <strong></strong>
倾斜:<i></i> <em></em>
下划线:<u></u> <ins></ins>
删除线:<s></s> <del></del>
上标:3<sup>2</sup>=9
下标:O<sub>2</sub>
(6)字体标签:<font><font>
常用属性:
color(设置字体的颜色)
size(设置字体的大小),参数:1-7
face(设置字体样式)
(7)特殊字符: ©®
(8)水平线标签:<hr>
<hr width="50%" align="left" size="10px" color="red" />
常用属性: width(设置水平线的宽度)
Size(设置水平线的高度、厚度)
Color(设置水平线的颜色)
Align(设置水平线的对齐方式)
Noshade(设置水平线的阴影)
5.html图像、绝对路径和相对路径
路径:
URL:统一资源定位符(简称:“路径”)。
(1)图像标签:(<h6>)
和源属性src。例如:<img src="url "/>
(alt源属性)在浏览器无法载入图像时,替换文本属性告诉读者她们失去的信息。
(title源属性)鼠标经过图片时的提示文字
(2)绝对路径:绝对路径是指文件在硬盘上真正存在的路径。例如:<body backround="E:\book\网页布局\代码\bg.jpg">
相对路径:相对路径,就是相对于自己的目标文件位置。
1**、先理清楚对应的文件位置关系**
2**、遇到同一级直接写对方文件的名字**
…/…/index.html
…/:表示从当前位置向父级退一级
/:表示从当前位置向子集前进一级
6.超链接标签:
<a href="index.html" target="_self">点击看看</a>
常用属性:href(链接网页的路径)
target(设置网页打开的方式《当前页面或者新页面》)
target属性值:
_self:默认方式,即在当前窗口打开链接
_blank:在一个全新的空白窗口中打开链接
7.列表标签:
(1)有序列表:
<ol type="A" start="26">
<li>星期日</li>
<li>星期一</li>
<li>星期二</li>
<li>星期三</li>
<li>星期四</li>
<li>星期五</li>
<li>星期六</li>
</ol>
常用属性:type(设置有序列表排序的类型);参数(1、a、A、i、I)
Start**(设置排序的开始位置,参数只能是数字,表示从第XX位开始排序)
(2)无序列表:
<ul type="square">
<li>星期日</li>
<li>星期一</li>
<li>星期二</li>
<li>星期三</li>
<li>星期四</li>
<li>星期五</li>
<li>星期六</li>
</ul>
常用属性:type(设置无序列表样式)参数(square->实心方块、disc->实心圆《默认值》、circle->空心圆)
(3)自定义列表:
<dl>
<dt>蔬菜</dt>
<dd> ?</dd>
<dd>?</dd>
<dd>青菜</dd>
<dt>水果</dt>
<dd>?</dd>
<dd>?</dd>
<dd>?</dd>
</dl>
8.表格标签:
…
<table>
<caption></caption>
<tr>
<th></th>
<th></th>
<th></th>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
…
标签含义:
table->表示表格
tr->表示行
td->表示单元格
th->单元格标题(表头)
caption->表格标题
表格常用属性:
border:设置表格的边框线
align:设置表格的对齐方式
width:设置表格、单元格的宽度
height:设置表格、单元格的高度
bgcolor:设置背景颜色
cellpadding:设置单元格的内容与单元格边框之间的距离
cellspacing:设置单元格与表格边框之间的距离
列合并案例:
<table border="1px" width="80%" align="center">
<caption>列合并(colspan)</caption>
<tr>
<td colspan="2">1</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td colspan="3">7</td>
</tr>
</table>
行合并案例:
<table border="1px" width="80%" align="center">
<caption>行合并(rowspan)</caption>
<tr>
<td rowspan="2">1</td>
<td>2</td>
<td rowspan="3">3</td>
</tr>
<tr>
<td>4</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
</tr>
</table>
9.HTML框架技术——frameset
(1)先删除页面中的body标签:
<frameset rows="14%,*" border="1px" bordercolor="green" frameborder="0">
<frame src="F_01.html" noresize="noresize" />
<frameset cols="30%,70%">
<frame src="F_02.html" noresize="noresize" />
<frame src="F_03.html" name="shouye" />
</frameset>
<noframes>
<body>您的浏览器不支持框架</body>
</noframes>
</frameset>
常用属性:border:框架边框线
bordercolor:设置边框颜色
noresize:禁止用户调整框架页面布局
frameborder:删除框架的边框线(参数:0/no、1/yes)
(2)内嵌框架:iframe
内嵌框架可以写在body中:
<table width="70%" align="center" border="1px">
<tr>
<td><a href="F_01.html" target="aaa">正在进行</a></td>
<td><a href="F_02.html" target="aaa">商城特惠</a></td>
<td><a href="F_03.html" target="aaa">长期活动</a></td>
</tr>
<tr>
<td colspan="3">
<iframe width="100%" height="300px" name="aaa" frameborder="0"></iframe>
</td>
</tr>
</table>
常用属性:
width:设置内嵌框架的宽度
height:设置内嵌框架的高度
frameborder:删除框架的边框线(参数:0/no、1/yes)
10.表单元素——form表单
(1)写在input标签外的有两种
下拉菜单
文本域
(2)写在input标签内的有十种
A.4种XXX框
文本框type=“text”
密码框type=“password”
单选框type=“radio”
复选框type=“checkbox”
B.3种域
文件域type=“file”
图片域type=“image”
隐藏域type=“hidden”
C.3种按钮
type=“button”(普通按钮)
type=“submit”(登录、注册)
type=“reset”(重置)
(1)三原色 rgb(red green blue)
#000 黑色
#FFF 白色
#999 灰色
#F00 红色
#0F0 绿色
#00F 蓝色
#FF0 黄色
#F0F 紫色
#0FF 青色
(2)十六进制
0 1 2 3 4 5 6 7 8 9 A B C D E F