|
HTML(Hyper Text Markup Language)超文本编辑语言
CSS：控制网页内容的显示效果
HTML+CSS=静态网页
JS+Jquery=动态网页
HTML的标签
p：段落标签
 ：空格
h#：标题标签
<!--注释内容-->：注释符
<img/>:图片
src：路径
height，width，border：高宽和边框，单位都是px像素
alt：当图片中由于某些原因显示失败时显示的文本
title：当光标移动到图片上时显示的文本
<hr/>:分割线
<font><font/>:字体标签，size=1~7,7最大
a：超链接，href表示连接地址，target表示打开连接的方式，_blank表示打开一个新网页进行跳转，_self表示在当前网页中进行跳转
<br/>:换行
一个标签可以有多个属性，用空格分开
Marquee：用来显示元素的移动（现在很多不兼容了）
derection属性：设置方向，left，right
behavior属性：设置模式，scroll，altermate，slide
同一页面内跳转：
<a name="上面"href="#下面">跳到下面<a/>
<a name="下面"href="#上面">跳到上面<a/>
无序列表
<ul>
<li><li/>
<ul/>
有序列表
<ol>
<li><li/>
<ol/>
自定义列表
<dl>
<dt><dt/>
<dl>
表格：colspan属性（跨列），rowspan属性（跨行）
<table border="1">
<trrowspan=2><!--行-->
<tdcolspan=3 align=center>单元格内容<td/><!--列-->
<td>单元格内容<td/>
<tr/>
<tr>
<td>单元格内容<td/>
<td>单元格内容<td/>
<tr>
<table>
table属性：cellspacing单元格间距，cellpadding单元格内容间距
td属性：nowrap不自动换行，align左中右对齐，valign上中下对齐，colspan，rowspan，bgcolor
th属性：表示表格的标题，
caption属性：表格标题
表单：form
<form>
.
formelements
.
</form>
<inputtype="" name="" value="" size="宽度">
<form>
First name:<br>
<inputtype="text" name="firstname">
<br>
Lastname:<br>
<inputtype="text" name="lastname">
</form>
type分类：text，password，radio，submit，reset，checkbox，button，image
<textarea>文本域标签：属性rows行，cols列
<select>下拉列表：
<select>
<optgrouplabel="第一组">
<optionvalue ="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgrouplabel="第二组">
<optionvalue="opel">Opel</option>
<optionvalue="audi">Audi</option>
</optgroup>
</select>
<div></div>用于布局的标签
<span></span>用于行内控制字体格式
页面框架标签
<frameset>
<frame>
</frameset>
CSS
实现了网页内容和页面效果的彻底分离，即CSS不影响HTML
三种嵌入CSS方式，优先级依次递减：
a.内联样式表，在标签内设置
b.嵌入样式表，在head内写
c.link
伪元素选择器：
A:active选中超链接时的状态
A:hover光标移动到超链接的状态
A:link正常状态
A:visited访问后的状态
P:firstline段落中第一行文本
P:firstletter段落中第一个文本
CSS中属性
1.字体
Font-family:字体系列
Font-size:xx-small，x-samll，small，medium，large，x-large，xx-large
Font-style：normal，Italic，oblique
text-decoration：上中下划线
font-weight:粗体磅值，normal，bold，bolder，lighter，100-900
2.背景
background-color： transparent表示透明度
background-image：
background-repeat：背景图是否重复以及如何重复，no-repeat表示只出现一遍，repeat-x，repeat-y；
background-attachment：背景图是否跟随内容滚动，fixed，scroll
3.文本
word-spacing:单词间距
letter-spacing：字符间距
text-align:水平对齐方式，left，right，center，justfy
text-indent:第一行文本缩进
line-height:文本所在行的高度
4.位置
position：absolute，relative，static无特殊定位，默认为static
5.边缘
Margin:元素边界与其他元素空隙
Margin-top,Margin-bottom,Margin_left,Margin_right
Padding:元素边界与内部内容之间的空隙
Padding-top,bottom,left,right
width:设置元素边框，thin，medium，thick
border-top-width,border-right-width......
color:颜色border-top-color.....
style:设置元素边框样式，none，dotted点线，dashed虚线，solid实线，double双线，groove凹槽，ridge凸槽，inset凹边，outset凸边；
display:布局，inline，block，none，float
HTML注释符<!--注释内容-->
CSS注释符/*注释内容*/ | 
转播
