- 博客(17)
- 收藏
- 关注
原创 gulp 安装步骤 及实现雪碧图(例子)
首先 安装node.js工具在 node基础上安装cnpm 再安装gulp先 全局安装gulp cnpm install gulp -g再局部项目安装gulpcnpm install gulp --save-dev你需要安装实现雪碧图需要的插件生成gulpfile.js进行配置cnpm install gulp-spritesmith --save-dev //局部安...
2018-12-28 17:15:11
204
原创 如何解决js与jQuery对象的相互转换问题
1:jQuery --> js首先定义一个JQuery与js对象var jq = $("#btn");因为jQuery是js的方法集合 可以将jQuery当成伪数组 运用数组特点将之转换(1). var js = jq[0];或者使用get方法将之转换(2).var js = jq.get(0);2: js --> jQuery最简单的方法 运用$将js...
2018-12-03 20:38:52
153
原创 JS与jQuery的准备就绪函数的区别
window.onload(function () {});//js 页面加载完毕 才执行 只能执行一次$(document).ready(function () {})//jQuery dom 加载完毕 执行 可执行多次$();$(function () {});/*1:执行时机 不同JS dom 加载完毕jQuery dom 加载完 (提前)* 2: JS不能...
2018-12-03 13:06:47
1766
原创 弹性盒子元素详解与特性
display: flex; flex-direction: row;/*默认属性 row 如果改成垂直显示 子元素高度会等比例压缩*/ flex-wrap: nowrap;/*水平方向换行方式 默认nowrap如果显示不开等比例压缩*/ justify-content: space-around;...
2018-08-01 15:57:27
1473
原创 定位问题
定位:根据项目需要 通过相关方法 让元素显示位置发生偏移定位的方式:static 默认relative 相对定位absolute 绝对定位fixed 固定定位注意:只有元素采用了定位;top left right bottom z-index 才可以使用普通元素是没有这些样式的定位属性基本配合浮动一块使用2.相对定位相对定位的特点:1:如果你仅仅给元素添加了...
2018-07-31 20:54:13
206
原创 渲染问题
根据渲染规则 在具有父子包含关系的元素中 如果父元素没有上边框或者上内边距那么父元素会随子元素在垂直方向发生移动;解决方案:在父元素加 overflow :hidden 属性...
2018-07-31 20:49:32
141
原创 块级元素浮动特点与清除浮动最合适特点
1浮动特点浮动1:多个块级元素想同行显示:每个块级元素都要加浮动而不是第一个不需要加;2:块级元素相同行显示就脱离了快级元素的显示特点不再表现为独占一行,现实特点和行级元素类似占用的实际大小和内容有关3:标准盒子模型中的内容不会被浮动盒子影响显示,会正常显示文本。4:在浮动元素的后面添加非浮动元素并给这个非浮动元素添加clean属性可以实现清除浮动带来的影响5:上面的方法会存在一...
2018-07-31 20:48:10
434
原创 雪碧图
核心代码width: (设置div宽高)height:background-image: url("../../img/icon2.gif");(设置背景图片)举例<html lang="en"><head> <meta charset="UTF-8"> <title>背景相关样式</t
2018-07-27 16:45:48
165
原创 文本阴影文本描边
text-shadow: 10px 10px 3px black; text-shadow: x轴的偏移量 y轴的偏移量 模糊程度 阴影颜色; color: saddlebrown; -webkit-text-stroke: 1px red;/*文本描边*//* 浏览器内核前缀-webkit*/...
2018-07-27 13:20:21
298
原创 背景相关样式
background-color: red;/*背景颜色*/background-image: url("../../img/f3_Android1.png");/*背景图片(优先级高于背景颜色)*/background-repeat: no-repeat;/*背景图片的遍历方式no-repeat:不重复repeat-x:只在X轴方向遍历repeat-y:只在y轴方向遍历*/ba...
2018-07-27 13:12:26
112
原创 文本样式
1./*font-style: italic;!*字体倾斜*!font-weight:lighter;!*字体粗细*!font-size: 40px;!*字体大小*!line-height: 60px;font-family: "Arial","Microsoft Himalaya",serif;!*字体系列*!*/font: italic lighter 40px/1.5 宋体...
2018-07-26 17:50:55
170
原创 css样式优缺点与优先级
1.三种css样式优缺点:行内样式:缺点:内容和样式没有分离;样式没有复用性;仅作用于当前元素:优点:1.写法比较简单,适用范围广,2优先极高内部样式:缺点:样式和内容没有完全分离:多个页面间不能复用;优点:实现了样式复用。复用程度不高不能在多个页面之间复用外部样式缺点:编辑时需要频繁切换优点:html和css完全分离css得到最大程度复用2.样式优先级的比较(...
2018-07-26 17:01:01
3615
原创 css样式之选择器的使用
1.元素选择器样式:<style>p{属性:属性值; }li{ }</style>2.id选择器# ID 名称{ 属性: 属性值;属性:属性值;}3.类选择器 点+类名{ 属性:属性值;}style{.add{ color:red;}}<p class="ad"> 你好</p>4.后代选择器...
2018-07-26 16:54:50
131
原创 form表单小知识
<form action="表单数据提交地址"method="数据提交方法"></form>为了往服务端提交数据,提交的数据清洗移动方便处理:普通输入框需要添加name属性键值对完整。非输入框需要添加name value属性保证键值对完整 name 还有分组作用比如单选框,相同name是一组,单选框同一组选项有互斥效果复选框也需要name属性表明当前多项是一组...
2018-07-25 15:26:09
133
原创 标签补充(冷门标签)了解一下
文本级语义s 有误文本(删除线效果)cite 作品标题的引用dfn 定义专业术语abbr 鼠标滑过带有解释var 定义变量bdo 定义文本的显示方向 rtl ltr(left to right)kbd 键盘输入文本sub 下标文本sup 上标文本u 下划线Q 短引用DateMark 高亮显示Time 添加到记事本...
2018-07-25 11:43:26
144
原创 form表单
为了往服务端提交数据,提交的数据清洗移动方便处理:普通输入框需要添加name属性键值对完整。非输入框需要添加name value属性保证键值对完整 name 还有分组作用比如单选框,相同name是一组,单选框同一组选项有互斥效果复选框也需要name属性表明当前多项是一组通过get请求往服务端提交数据时,提交的数据会追加在URL地址后面以?进行分隔,多个数据之间用&进行分隔g...
2018-07-25 11:42:02
158
原创 程序员Web前端学习Day2-标签学习
1.组合标签<figure> <img src="../../img/f3_Android1.png" alt="图片加载失败"> <figcaption> 安卓系统越来越流畅! </figcaption></figure>2.行级元素imgspanaqi
2018-07-24 22:14:52
121
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人