第1章：
网页的分类与扩展名、WEB标准
(1)网页分类：静态网页、动态
(2)扩展名：
  Html网页: .html, .htm
  CSS:  .cssdiv border属性
  Javascript: .js
(3)web标准
结构标准: html
表现标准 :css层叠样式表
行为标准：javaScript
第2章：
常见的HTML标记、常用的图片格式
1、HTML标记
<html>< /html>：创建一个HTML文档,也称根标记。

<head>< /head>：设置文档标题和其它在网页中不显示的信息，也成为头部标记。

<title>< /title>：设置文档的标题。
<body>< /body>：用于定义HTML文档所要显示的内容,也称主题标记。
<hr />：用来定义一条水平线。
<h1>< /h1>~<h6>< /h6>：最大的标题到最小的标题。
使用align属性加以下：
left：设置标题文字左对齐；
center：设置标题文字居中对齐；
right：设置标题文字右对齐；
<p></p>：创建一个段落。<p align="">：将段落按左、中、右对齐。
使用align属性加以下：
left：设置标题文字左对齐；
center：设置标题文字居中对齐；
right：设置标题文字右对齐；
<br />：换行,插入换行符。
<meta />：定义页面元信息标记。
<font ></font>：规定文本的字体、字体尺寸、字体颜。
font-family：字体
font-weight：字体粗细
font-variant：变体
font-style：字体风格
font：综合设置字体样式
fac：设置文字的字体
size：设置文字的大小
color：设置文字的颜
CSS文本外观属性：letter-spacing字间距
                  word-spacing单词间距
                  line-height行间距
text-align：left左对齐,height右对齐,center居中对齐
<img  src=”url” />
src：图像的路径
alt：图像不能显示时的替换文本
title：鼠标悬停时显示的内容
width：设置图像的宽度
heighr：设置图像的高度
border：设置图像边框的高度
vspace：设置图像顶部和底部的空白（垂直边距）
hspace：设置图像左侧和右侧的空白（水平边距）
用align属性：
left：将图像对齐到左边
right：将图像对齐到右边
top：将图像的顶端和文本的第一行文字对齐，其他文字居于图像下方
middle：将图像的水平中线和文本的第一行文字对齐，其他文字居于图像下方
bottom：将图像的底部和文本的第一行文字对齐，其他文字居于图像下方
<div ></div>区域容器标记
<span></span> 行内容器标记
<ul  type=>定义项目符号
disc：●
circle：○
square：■
<li></li>列表项，结合<ul> 无序<ol>有序使用
<ul></ul>无序列表
<ol></ol>有序列表
<link  href=”url”    rel=stylesheet  type=”text/css” />引入CSS样式表文件
<a  href=”跳转目标”>
<form>创建一个表单
<input  type=/>
text：单行文本输入框
password：密码输入框
radio：单选按钮
checkbox：复选框
button：普通按钮
submit：提交按钮
reset：重置按钮
image：图像形式的提交按钮
hidden：隐藏域
file：文件域
<textarea  cols=”每行中的字符数”  rows=”显示的行数”></textarea>
<select><option></option></select>下拉菜单
（2）常用的图片格式：JEPG，GIF，PNG
第3章：
CSS样式规则、引入CSS样式、CSS基础选择器、定义CSS样式，CSS字体样式属性、CSS文本外观样式属性、复合选择器的定义
1．Css样式规则
选择器{
属性1：属性1值;
属性2：属性2值;
}
例：P{ Color : red ; Border : }或h2{ font-size : 20px ; color : red ; }
2、引入css样式方式
（1）行内式
<标记名 style=” 属性1：属性1值; 属性2：属性2值”>内容</标记名>
例：<h2 style = “ font-size : 20px ; color : red ; ”></h2>
(2)内嵌式
例：<style type=”text/css”></style>
选择器{
属性1：属性1值;
属性2：属性2值;
}
（3）链入式
<link  href=”cssURL”  rel= “stylesheet”  type=”text/css”/>
3、css基础选择器
（1）标记选择器  p{  }
（2）类选择器  .类名
（3）id选择器  #id
（4）通配符选择器 *{}
4、复合选择器（书本P66）
(1)标签指定式选择器  p.speacial{ }  书本demo3-8
(2)后代选择器  p  strong{  }  书本demo3-9
(3)并集选择器 p,div{    }  书本demo3-10
5、CSS字体属性
  font-family：字体
  font-variant：变体
  font-style：字体风格  italic:斜体
font-weight：字体粗细
font：综合设置字体样式
6、外观属性
color:
text_decoration:文本装饰  underline下划线overline上划线line-through删除线
text-align:水平对齐方式 left左对齐right右对齐center居中对齐
text-indent:首行缩进 2em：2字符
line-height:行间距
第4章CSS盒子模型：
认识盒子、边框属性 内外边距属性、设置背景图像、行内元素及块元素

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。