自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(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 190

原创 如何解决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 141

原创 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 1757

原创 弹性盒子元素详解与特性

display: flex; flex-direction: row;/*默认属性 row 如果改成垂直显示 子元素高度会等比例压缩*/ flex-wrap: nowrap;/*水平方向换行方式 默认nowrap如果显示不开等比例压缩*/ justify-content: space-around;...

2018-08-01 15:57:27 1452

原创 定位问题

定位:根据项目需要 通过相关方法 让元素显示位置发生偏移定位的方式:static 默认relative 相对定位absolute 绝对定位fixed 固定定位注意:只有元素采用了定位;top left right bottom z-index 才可以使用普通元素是没有这些样式的定位属性基本配合浮动一块使用2.相对定位相对定位的特点:1:如果你仅仅给元素添加了...

2018-07-31 20:54:13 195

原创 渲染问题

根据渲染规则 在具有父子包含关系的元素中 如果父元素没有上边框或者上内边距那么父元素会随子元素在垂直方向发生移动;解决方案:在父元素加 overflow :hidden 属性...

2018-07-31 20:49:32 128

原创 块级元素浮动特点与清除浮动最合适特点

1浮动特点浮动1:多个块级元素想同行显示:每个块级元素都要加浮动而不是第一个不需要加;2:块级元素相同行显示就脱离了快级元素的显示特点不再表现为独占一行,现实特点和行级元素类似占用的实际大小和内容有关3:标准盒子模型中的内容不会被浮动盒子影响显示,会正常显示文本。4:在浮动元素的后面添加非浮动元素并给这个非浮动元素添加clean属性可以实现清除浮动带来的影响5:上面的方法会存在一...

2018-07-31 20:48:10 416

原创 雪碧图

核心代码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 158

原创 文本阴影文本描边

text-shadow: 10px 10px 3px black; text-shadow: x轴的偏移量 y轴的偏移量 模糊程度 阴影颜色; color: saddlebrown; -webkit-text-stroke: 1px red;/*文本描边*//* 浏览器内核前缀-webkit*/...

2018-07-27 13:20:21 279

原创 背景相关样式

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 103

原创 文本样式

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 159

原创 css样式优缺点与优先级

1.三种css样式优缺点:行内样式:缺点:内容和样式没有分离;样式没有复用性;仅作用于当前元素:优点:1.写法比较简单,适用范围广,2优先极高内部样式:缺点:样式和内容没有完全分离:多个页面间不能复用;优点:实现了样式复用。复用程度不高不能在多个页面之间复用外部样式缺点:编辑时需要频繁切换优点:html和css完全分离css得到最大程度复用2.样式优先级的比较(...

2018-07-26 17:01:01 3563

原创 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 126

原创 form表单小知识

<form action="表单数据提交地址"method="数据提交方法"></form>为了往服务端提交数据,提交的数据清洗移动方便处理:普通输入框需要添加name属性键值对完整。非输入框需要添加name value属性保证键值对完整 name 还有分组作用比如单选框,相同name是一组,单选框同一组选项有互斥效果复选框也需要name属性表明当前多项是一组...

2018-07-25 15:26:09 130

原创 标签补充(冷门标签)了解一下

文本级语义s 有误文本(删除线效果)cite 作品标题的引用dfn 定义专业术语abbr 鼠标滑过带有解释var 定义变量bdo 定义文本的显示方向 rtl ltr(left to right)kbd 键盘输入文本sub 下标文本sup 上标文本u 下划线Q 短引用DateMark 高亮显示Time 添加到记事本...

2018-07-25 11:43:26 139

原创 form表单

为了往服务端提交数据,提交的数据清洗移动方便处理:普通输入框需要添加name属性键值对完整。非输入框需要添加name value属性保证键值对完整 name 还有分组作用比如单选框,相同name是一组,单选框同一组选项有互斥效果复选框也需要name属性表明当前多项是一组通过get请求往服务端提交数据时,提交的数据会追加在URL地址后面以?进行分隔,多个数据之间用&进行分隔g...

2018-07-25 11:42:02 147

原创 程序员Web前端学习Day2-标签学习

1.组合标签<figure> <img src="../../img/f3_Android1.png" alt="图片加载失败"> <figcaption> 安卓系统越来越流畅! </figcaption></figure>2.行级元素imgspanaqi

2018-07-24 22:14:52 113

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除