Html常用标签
<titile>设置网页标题(浏览器上方标签栏)</titile>
<hr />定义一条水平线
<br />换行
<h1>定义标题 h1~h6逐级(字号和重要性)递减</h1>
<p align="设置对齐方式">段落文本</p>
align属性:
默认 left左对齐
center居中对齐
right右对齐
<img src="图片地址" alt="不能显示时的替换文本" title="鼠标悬停信息"/>
width 图像宽度 像素
height 图像高度 像素 一般宽或者高只设置一个,另一个会等比例变化
border 图像边框宽度 数字
vspace 顶底部空白 垂直边距 像素
hspace 左右侧空白 水平边距
绝对路径 指带盘符的路径
相对路径 ../指上一文件夹 /指下一文件夹
<em>特殊显示文本</em>倾斜标记
<div>区块布局</div>
<span>行内标记 特殊显示 文本</span>
<ul>无序列表
<li>名</li>
...
</ul>
<ol>有序列表</ol>
<dl>解释列表
<dt>解释标题</dt>
<dd>解释文本</dd>
</dl>
表单
<form action="服务器地址" method="get保密性差 数据量限制/post保密性好 无数据量限制" name=”表单名”>
<input type="text文本 password密码 button按钮 radio单选按钮 checkbox多选框 reset重置按钮 file文件上传 submit提交按钮" name="输入类型名" value="显示值" 见P143 />
<textarea>定义多行文本框</textarea>
<select>
定义下拉列表,需要有列表项
<optgroup>可分多个组进行选择
<option>选项</option>
</optgroup>
</select>
</form>
<a href="跳转目标" target="_self原窗口打开" _blank 新窗口打开>超链接</a>
链接伪类 一般应用于鼠标链接的悬浮样式,一般放置于css样式的属性当中。
a: link{ }表示为未访问的样式属性
a: visited访问后 一般应用相同样式
a: hover 鼠标经过悬停样式
锚点链接 即跳转目标 href 变为#id名 再定义一个元素id与其相同 点击此超链接 即会跳转到指定地方
块元素 <div>,<h1>~<h6>,<p>,<ul>,<ol>,<li>
行内元素<span>,<em>,<del><a>,<strong>
行内元素只可以定义左右外边距
元素转换属性 display
inline 此元素显示为行内元素
block 此元素显示为块元素
inline-block 此元素显示为行内块元素,可设置宽高,不独占一行
none 隐藏元素,不显示
行内元素具有块元素特性,可以设置宽高
块元素具有行内元素的特性,不独占一行
常用特殊字符,放置于标签的内容之内,防止与标签内的定义发生冲突,使用时要注意末尾的分号
空格
< <
> >
CSS样式属性
CSS样式 放于head标签中
外链式:
<link rel="stylesheet" type="text/css" href="引用外部文件的相对地址" />
内嵌式:
<style type="text/css">css表单样式</style>
标记选择器 将页面内同一种标记制定统一样式 标记名为标签 如body p
类选择器 定义一类名的样式 类名第一个字符不能用数字 并且严格区分大小写
id选择器 用#id名来指定样式
通配符选择器 * 匹配页面中所有元素
标签指定选择器 标签名 . 类(Class)名
后代选择器 外标记 内标记 中间用空格分隔
并集选择器 多个名组成一起定义样式
选择器中属性的值与定义的属性值单位之间不允许出现空格
text-属性 设置文本属性
css的继承性 不可被继承的属性{
边框属性 border
边距属性 padding内边距 margin外边距
背景 background
定位
宽 高 width height }
border-style边框样式
一值 四边
二值 上下/左右
三值 上/左右/下
四值 上/右/下/左
none无
solid单实线
double双实线
dashed虚线
dotted点线
权重 id>class>标记选择器
在CSS选择器中加!important 具有最大优先级
常用font-weight:normal正常或者是bold加粗来定义文本
background:url();背景图像地址
background-position:控制背景图像位置
background-attachment:scroll图像随页面滚动
background-color:transparent;背景透明
background-repeat:背景图像平铺
默认 repeat 水平竖直方向
no-repeat 不平铺
repeat-x 沿水平方向
repeat-y 沿竖直方向
fixed 固定背景图像
某个块元素的背景往往在css样式中进行定义background:url() no-repeat;
text-align只适用于块元素
text-indent:2em;首行缩进2单位
.classname:hover{
#鼠标悬浮属性设置悬浮变换背景
background:url();
}
float:left ;right ;none不浮动
clear:left ;right;both全部 清除浮动 避免浮动对元素的影响
overflow:hidden;对父元素应用 清除浮动 详情见P185
postion: P189定位模式
console.log(“在控制台输出信息”)
定义函数function name( ) { }