这是我学习前段期间的一些笔记可能有点乱 主要是一些不常用的标签属性~项目中常用的标签用法以及一些常用的小插件
希望能帮助到刚入门的小白
html：
； ：空格占位符
&ensp：占据的宽度正好是1/2个中文宽度的空格
&emsp：其占据的宽度正好是1个中文宽度的空格
br：换行
clearfix或clear：both：清除浮动
<a target="_blank">使网页在新的窗口中打开
border：边框
加粗标签：strong
改变文字的方向：bdo
使用 blockquote 元素的话，浏览器会插入换行和外边距
光标样式cursor
input：submit提交按钮 text输入框 password密码 radio单选 checkbox多选 file 上传文件value
Input表示Form表单中的一种输入对象，其又随Type类型的不同而分文本输入框，密码输入框，
单选/复选框，提交/重置按钮等
placeholder 提示信息输入文字后消失
css：
当手机页面文字需要小于12px时：-webkit-transform:scale(0.83333);
overflow：如果元素中的内容超出了给定的宽度和高度属性，
visible 默认值。内容不会被修剪，会呈现在元素框之外。
hidden 内容会被修剪，并且其余内容是不可见的。
scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。
inherit 规定应该从父元素继承 overflow 属性的值。
text-overflow:ellipsis：使文本超出部分以省略号代替
text-overflow:ellipsis：如果元素中的文本超出了给定的宽度和高度属性以省略号代替
white-space:nowrap;
overflow: hidden;
text-overflow:ellipsis;如果元素中的文本超出了给定的宽度和高度属性以省略号代替
去下划线：text-decoration:none
text-decoration: overline 上边
text-decoration: line-through 中间
text-decoration: underline 底下
调整图片位置：vertical-align 可接具体数值 middle与文字居中对齐
使文本不换行：white-space: nowrap
设置背景：background：url /*no-repeat 不平铺/*center cneter 使图片居中
background-size:100% 100%;手机页面中使背景铺满
background-position:top left right bottom 设置背景位置
background:transparent 背景透明
如果想显示下面的内容需要将上一层背景设为透明
opacity:.2 透明度
z-index :你定义的CSS中有position属性值为absolute、relative或fixed，
用z-index此取值方可生效。
此属性参数值越大，则被层叠在最上面。
字体大小：font-size /*后跟百分比或具体像素
设置字体大小：font-weight /* normal标准 /* bold 粗体/* bolder 更 粗的/* lighter 更细的/* 100~900 400=normal 700=bold
文本居中：text-align: center;
首行缩进：text-indent
设置边框类型;display
使文字和英文左右对齐：text-align:justify
设置边框样式：border-style 点状 dotted 实线solid 双线double 虚线 dashed
设置边框圆角：border-radius 后接具体像素或百分比 border-top-right-radius可以指定一个角
设置外边距：margin
设置内边距：padding
设置行高：line-height
设置光标样式：cursor
设置文字阴影 水平阴影、垂直阴影、模糊距离，以及阴影的颜色：text-shadow 0px 0px 0px #
允许对长单词进行拆分，并换行到下一行 word-wrap:break-word;
box-shadow：设置容器阴影
去除列表的点：list-style:none
平分成几列：column-count
规定列之间间隔：column-gap:40px;
设置列之间的样式 ：column-rule:3px outset #ff00ff;
绘制轮廓：outline:2px solid red;
outline-offset:15px;
规定元素的定位类型：position /*fixed 绝对定位相对于浏览器窗口/absolute绝对定位相对于static 定位以外的第一个父元素进行定位/relative 相对定位
提高指定CSS样式规则的应用优先权：!important
选择列表：select
*本站禁止HTML标签噢*
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
可插入<optgroup label="Swedish Cars">当做option的标题
select {
/*Chrome和Firefox里面的边框是不一样的，所以复写了一下*/
border: solid 1px #000;
/*很关键：将默认的select选择框样式清除*/
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;
/*在选择框的最右侧中间显示小箭头图片*/
background: url("http://ourjs.github.io/static/2015/arrow.png") no-repeat scroll right center transparent;
/*为下拉小箭头留出一点位置，避免被文字覆盖*/
padding-right: 14px;
}
/*清除ie的默认选择框样式清除，隐藏下拉箭头*/
select::-ms-expand { display: none; }
：link 未访问
：visited 已访问
:hover 悬浮
:active 活动链接
class在css中用点
id用#
更改input按钮样式
input[type="checkbox"] {
-webkit-appearance: none;
}取消原有样式
input[type="checkbox"] {
-webkit-appearance: none;
background: #fff url(i/blue.png);
height: 22px;
vertical-align: middle;
width: 22px;
}添加样式
input[type="checkbox"]:checked {
background-position: -48px 0;
}添加选中样式
csss3：
使图片模糊：
-webkit-filter: blur(10px); /* Chrome, Opera */
-moz-filter: blur(10px);
-ms-filter: blur(10px);
filter: blur(10px);
移动端弹窗
<div class="layer">
<div class="labg"></div>
<div class="laycont">
<img src="style/images/photo_img_3.png">
</div>
</div>
<script type="text/javascript" src="style/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$("#dk").click(function(){
$(".layer").show();
})
$(".layer").click(function(){
$(".layer").hide()
});
</script>
常用的块状元素有：
*本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* ... *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* ....
常用的内联元素有：
*本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* 、 *本站禁止HTML标签噢* .....
常用的内联块状元素有：
*本站禁止HTML标签噢* 、 *本站禁止HTML标签噢*
转换成块：display:block
换成内联：display:inline
转换成内联块状：display:inline-block
内联元素特点：
1、和其他元素都在一行上；
2、元素的高度、宽度及顶部和底部边距不可设置；
3、元素的宽度就是它包含的文字或图片的宽度，不可改变。
块级元素特点：
1、每个块级元素都从新的一行开始，并且其后的元素也另起一行。（真霸道，一个块级元素独占一行）
2、元素的高度、宽度、行高以及顶和底边距都可设置。
3、元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设定一个宽度。
内联块状 元素特点：
1、和其他元素都在一行上；
2、元素的高度、宽度、行高以及顶和底边距都可设置。
