不完全笔记?
注释:项目要写注释,但是发布时候记得删除。要学会用操作者工具。
h1默认字体大小为32px。
display:inline,inline:在一行。
a标签撑大li标签,图片可以尝试干掉平铺repeat,background-repeat:no-repeat;
首行缩进text-indent:2em;
行高line-hight:2em;em指字符位。
精灵图定位用:background-position:x轴 y轴;
以左上角为坐标原点,右边线为x正半轴,下边线为Y正半轴。
div .list 所有有list的子元素都能选出来
div> .list只筛选第一代list
div.list 筛选自身list。
用iframe引入的界面里超链接不加 target="_top" 的话显示结果会非常蠢,具体情况自己试试吧 你会在被引入的页面所在的那一个小小的地方浏览一整个超链接页面
<iframe src="" width="" height=""></iframe>
可以往网页中嵌套网页,记得用overflow: hidden;干掉滚动条,但是如果height设置的不够高,依旧会出现滚动条。
ul>(li>a[href=list.html]>img[src=img/pro/$.jpg]+div.right>span.title+span.money+div>(span.love)+span.num)*9
颇为神奇的打代码方法,让我一度认为自己大一的时候是个傻瓜。
vertical-align: bottom;水平对齐
vertical-align: middle;底部对齐
background-repeat: no-repeat;图片不重复显示
display: inline-block;显示在同一行
text-decoration: none;去除下划线
-选择器
1 基础选择 tag #id .class , *
2层次选择器
空格 所有子代 12345....
大于号 第一代
加号 第一个兄弟节点
波浪线 后门的所有兄弟节点
优先级 正常情况下 选择范围越大,优先级越低 !important
3表单选择器
:type属性 jquery
4属性过滤器[]
[attr] 包含这个属性
[attr=val] 属性值=val
[attr!=val] 属性值不等于val 属性值!=val ----jquery
[attr*=val] 属性值包含val
[attr^=val] 属性值以val开始
[attr$=val] 属性值以val结尾
querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素,请使用 querySelectorAll() 方法替代。
querySelector(".close");获取文档中 class="close" 的第一个元素:
× 表示叉号
line-through删除线
/* 超出两行显示省略号 */
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
webkit-box-orient: vertical;
给元素加事件 ,集合不能加事件,比如onclick的点击事件,结果是可以运行,但是没有任何作用
例子
<div class="title">
<a href="#" class="active" data-idx="0">登录</a>
<a href="#" data-idx="1">注册</a>
</div>
其中的a并不是单纯的一个元素而是一个元素集合,这时候你需要利用for (var i = 0; i < btns.length; i++)来获取其中的元素。
justify-content: center; /* 居中排列 */
justify-content: start; /* 从行首开始排列 */
justify-content: end; /* 从行尾开始排列 */
justify-content: flex-start; /* 从行首起始位置开始排列 */
justify-content: flex-end; /* 从行尾位置开始排列 */
justify-content: left; /* 一个挨一个在对齐容器得左边缘 */
justify-content: right; /* 元素以容器右边缘为基准,一个挨着一个对齐, */
justify-content: space-between; /* 均匀排列每个元素 首个元素放置于起点,末尾元素放置于终点 */
justify-content: space-around; /* 均匀排列每个元素 每个元素周围分配相同的空间 */
justify-content: space-evenly; /* 均匀排列每个元素 每个元素之间的间隔相等 */
justify-content: stretch; /* 均匀排列每个元素
justify-content 用于设置或检索弹性盒子元素在主轴(横轴)方向上的对齐方式。
focus()方法用于为元素赋予焦点,并借助blur()方法删除焦点
!important 提高css属性优先级,直接将优先级提到最高
px em rem vh vw pt rpx upx(长度单位)
浙公网安备 33010602011771号