软件主要分为两种架构
- C/S
- B/S
我们要学的是B/S。
什么是B/S？
- B/S中的B指的是browsers，是浏览器的意思，S值Server指服务器的意思。
- B/S架构的软件一般都是通过访问一个网页的形式来使用的，而将一些运算等操作放到远端的服务器上。
我们要学哪些内容？
- 根据W3C标准，一个网页主要由三部分组成：结构HTML、表现css还有行为JavaScript。
html 用于描述页面结构
css 用于控制页面元素的样式
JavaScript 用于响应用户的操作
一个最基本的HTML页面
<!DOCtYPE html>
<html>
<head>
<meta charset=utf-8>
<title>网页标题</title>
</head>
<body>
<h1>正文</h1>
</body>
</html>
标签
HTML 中的标记就是标签，使用标签来描述网页。
<标签名>内容</标签名>
元素
一个完整的标签称为元素。元素和标签是同义词。
<h1>一级标题</h1>
*上边h1就是元素
<p>我是一个<em>段落</em></p>
- p是一个元素，em是p的子元素。p是em的父元素。
<body>
<p><em>内容</em></p>
</body>
- body也是一个元素
- body是p和em的祖先元素。
- p和em是body的后代元素。
属性
- 属性需要在开始标签或结束标签中。
*属性总是以名称/值对的形式出现。 - 比如：name=‘value’
- 有些属性可以是人任意值，有些必须是指定值。
常见属性
- id -id属性作为标签的唯一标识，在同一个网页中不能出现相同的id属性值。
- class - class属性用来为标签分组，拥有相同class属性的
标签我们认为就是一组，可以出现相同的class属性，可以为一个元素指定多个class。 - title -title属性用来指定标签的标题，指定title以后，鼠标移入到元素上方时，会出现提示文字。
注释
- 注释内容不会在网页中显示
- 格式：
<!--注释内容-->
<!-- 注释内容
-->
- 注释不能嵌套
编码问题
- 常见的字符集：ASKII、ISO8859-1、GBK，GB2312、UTF-8
- 乱码解决：在html5中需要使用meta标签：<meta charset='utf-8'/>
- <meta> 作用： <meta> 标签位于文档的头部，不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。
- meta的用法：
设置页面的字符集:<meta charset="utf-8">
设置网页描述：<meta name="description" content="">
设置网页的关键字：<meta name="keywords" content="">
请求重定向： <meta http-equiv="refresh" content="5;url=地址"/>
常用标签
<html>
作用：<html>标签用于告诉浏览器这个文档中包含的信息是用HTML编写的.
用法: 所有网页的内容都需要写到html标签当中,一个页面只能有一个HTML标签.
HTML 标签中有两个子标签head和body.
<head>
作用:标签用来表示网页的元数据，head中包含了浏览器和搜索引擎使用的其他不可见信
息。
用法:head标签作为html标签的子元素的出现，一个网页中只能有一个head。
<title>
作用:表示网页标题,一般会在网页的标题栏上显示.
title标签中的文字，是页面优化的最重要因素。在搜索引擎的搜索时最先看到的、最醒目的内容。
用法:建议将title标签紧贴head标签编写,这样搜索引擎可以快速检索到标题标签.
网站中的多个页面的title也不应该重复,这样不利于搜索隐藏检索.
<body>
作用:用来设置网页的主体,所有页面中能看到的内容都应该编写到body标签中.
用法:作为HTML的子标签使用.
<h1>~<h6>
作用:h1~h6都是网页中的标题标签，用来表示网页中的一个标题，不同的是，从h1-h6重要性越来越低。
一般标题标签我们只会使用到h3，h3以后的标题标签对于搜索引擎就没有什么意义了。
一个页面中只会使用一个h1标签.
<p>
作用:表示网页中的一个段落
作用:换行标签,使用br标签可以使标签后的内容另起一行.
作用:水平线标签,使用hr标签在页面中打印一条水平线.
<ing/>
作用:图片标签,可向页面中插入一张外部途径.
属性:src: 指向图片路径.
slt : 图片描述
<a>
作用: 超链接标签,通过a标签,可以快速跳转到其他页面.
属性: herf:指向一个连接地址.
target: 设置打开目标页面的位置,可选值:_black 新窗口,_self当前窗口.
实体
小于号<– & lt;
大于号>– & gt;
空格– & nbsp;
和符号&– &
版权© – & copy;
引号”– & quot;
注册商标®– & reg;
商标™– & trade;
css
- 层叠样式表
- css用来为网页创建样式表，对网页进行装饰。
语法:选择器{样式名:样式值;样式名;样式值;} 例如；p{color:red;font-size:12px;}
网友评论