html的简单框架:
<html>
<head>
<title>网页题目</titie>
</head>
<body>
</body>
</html>
1.特殊字符:
<:< >:> 空格: 注册符:® 版权符:©
2.标题标签:
<h1>标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
3.水平线标签:<hr/>
段落标签:<p></p>
换行标签:<br/>
上下标标签:<sup></sup><sub></sub>
原样输出:<pre></pre>
粗体:<strong></strong>
斜体:<em></em>
有序列表:
<ol type="">
<li> </li>
<li> </li>
</ol>----(默认是数字排序)
无序列表:
<ul type="">
<li> </li>
<li> </li>
</ul>----(默认是实心圆disc)
超链接标签:
<a href="链接的地址"></a>
target:设置打开的方式,默认是在当前页面打开
-blank:在一个新窗口打开
-self:在当前页面打开
不跳转到其他页面则<a href="#"></a>
打锚点:
如果是在同一个html页面下:
1)打锚点
<a 指定name锚点名称属性="属性值"></a>
2)创建一个连接到锚点的超链接
<a href="#锚点名称">点我</a>
在不同html页面下的使用:
1)在另一个页面上先打锚点<a name="锚点名称"></a>
2)在当前页面下创建一个连接到锚点的超链接
<a href="文件名称或者地址#锚点名称">点我</a>
图像标签:
<img src="图片的路径">
属性:
src:链接到的资源图片
width:图片的宽度 两种方式:一种指定px(像素) 第二种:百分比
title:悬停状态,会显示文字
alt:当图片失效的时候,用来解释说明该图片
height:图片的高度
表格标签:
<table>
<tr>
<td>
</td>
</tr>
</table>
设置对齐方式:
align:left center right
<th>:表示单元格实现居中对齐
合并单元格:
rowspan:跨行
colspan:跨列
表单标签:
<form>
定义一个表单的范围
</form>
输入项:<input type="输入的类型"/>
普通输入项:<input type="text"/>
密码输入项:<input type="password"/>
单选输入项:<input type="radio" name="sex"/>----name值必须相同
复选输入项:<input type="checkbox" name=""/>----name值必须相同
文件输入项:<input type="file"/>
下拉输入项:<select name="必填">
<option>请选择</option>
</select>
按钮: <input type="button" />
指定value属性
type="submit" 提交
type ="reset" 重置
提交方式:get和post
get:不安全,而且有数据大小的限制;
CSS和HTML:
<style type="text/css">
标签选择器
div{
font-size: 24px;
color: #f00;
}
id选择器
注意事项:
一个标签同时被标签选择和id选择器选中,那么id选择器的优先级要高于标签选择器
#div1{
font-size: 36px;
color: #0f0;
}
类选择器
在同一个页面下,多个标签可以指定同名的class属性
.divCls{
font-size: 36px;
color: #f00;
}
伪类选择器
<style type="text/css">
没有访问过的状态
a:link{
}
鼠标访问过的状态:visited:点击了,并且松开的状态
a:visited{
}
鼠标经过的状态:hover
a:hover{
}
鼠标激活状态:active:鼠标点击,但是没有松开的状态
a:active{
}
在 CSS 定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的。
在 CSS 定义中,a:active 必须被置于 a:hover 之后,才是有效的。
文本修饰
text-decoration常用的属性值:
underline:下划线
none:没有下划线
overline:上划线
line-through:中划线
body{
font-family:字体系列(类型)
系统默认是宋体
font-family: "楷体";
font-size:字体尺寸
font-size: 24px;
font-style:字体的样式
常用的属性值:
normal:标准的字体样式
italic:斜体
font-style: italic;*/
font-wight:设置字体的粗细
属性值:
bold:适当加粗
font-weight: bold;*/
CSS字体的简写属性*/
font:italic bold 36px "黑体" ;
}
边框属性:
border-style: solid;
border-left-style: solid;
border-right-style: dashed;
border-top-style: dotted;
border-bottom-style: double;
盒子模型:
padding:内边距
padding-left;padding-right;padding-top;padding-bottom
margin:外边距
margin-left;margin-right;margin-top;margin-bottom