编程
关注
分享
扫一扫
qq_39412143
这个作者很懒，什么都没留下…
展开
-
JavaScript-认识语句和符号
avaScript语句是发给浏览器的命令。这些命令的作用是告诉浏览器要做的事情。每一句JavaScript代码格式: 语句;先来看看下面代码<script type="text/javascript"> alert("hello!");</script>例子中的alert(“hello!”);就是一个JavaScript语句。一行的结束就被认定为语句的结束，通常在结尾加上一个分号";"来表示语句的结束。看看下面这段代码,有三条语句，每句结束后都有";"，按顺序执原创 2022-03-09 04:45:01 · 284 阅读 · 0 评论 -
为什么JavaScript非常值得我们学习吗？
一、你知道，为什么JavaScript非常值得我们学习吗？所有主流浏览器都支持JavaScript。目前，全世界大部分网页都使用JavaScript。它可以让网页呈现各种动态效果。做为一个Web开发师，如果你想提供漂亮的网页、令用户满意的上网体验，JavaScript是必不可少的工具。二、易学性1.学习环境无外不在，只要有文本编辑器，就能编写JavaScript程序。2.我们可以用简单命令，完成一些基本操作。...原创 2022-03-09 04:44:18 · 1108 阅读 · 0 评论 -
jQuery对象与DOM对象
对于才开始接触jQuery库的初学者，我们需要清楚认识一点：jQuery对象与DOM对象是不一样的可能一时半会分不清楚哪些是jQuery对象，哪些是DOM对象，下面重点介绍一下jQuery对象，以及两者相互间的转换。通过一个简单的例子，简单区分下jQuery对象与DOM对象：<p id=”imooc”></p>我们要获取页面上这个id为imooc的p元素，然后给这个文本节点增加一段文字：“您好！通过学习jQuery才是最佳的途径”，并且让文字颜色变成红色。普通处理，通原创 2021-04-25 10:31:46 · 139 阅读 · 0 评论 -
jQueryHelloWorld体验
当页面加载完成后，在页面中以居中的方式显示“您好！通过学习 jQuery 才是最佳的途径”字样。<!DOCTYPE html><html><head> <meta charset="utf-8"/> <title>第一个简单的jQuery程序</title> <style type="text/css"> div{ padding:8px 0px;原创 2021-04-25 10:28:26 · 92 阅读 · 0 评论 -
jquery环境搭建
这里需要注意 jQuery 分 2 个系列版本 1.x 与 2.x，主要的区别在于 2.x 不再兼容 IE6、7、8浏览器，这样做的目的是为了兼容移动端开发。由于减少了一些代码，使得该版本比 jQuery 1.x 更小、更快。如果开发者比较在意老版本 IE 用户，只能使用 jQuery 1.9 及之前的版本了。我们这本课程为了兼容性问题，使用的是 1.9 版本。jQuery 每一个系列版本分为：压缩版(compressed) 与 开发版(development)，我们在开发过程中使用开发版（开发版本便于代原创 2021-04-25 10:26:49 · 279 阅读 · 0 评论 -
office2007中文版下载和功能介绍
Microsoft Office 2007是大家都非常喜欢使用的office办公软件，包含了大家经常会用到的word2007、Excel2007、PowerPoint2007、Outlook2007等办公组件。office2007拥有全新设计用户界面、稳定安全的文件格式、无缝高效的沟通协作。Office2007可帮助您节省时间并保持有序管理。office2007强大的联系人管理功能可帮助您在一个地...转载 2019-06-24 22:03:13 · 1654 阅读 · 0 评论 -
CSS3中设置动画播放次数
animation-iteration-count属性主要用来定义动画的播放次数。语法规则：animation-iteration-count: infinite | [, infinite | ]*1、其值通常为整数，但也可以使用带有小数的数字，其默认值为1，这意味着动画将从开始到结束只播放一次。2、如果取值为infinite，动画将会无限次的播放。举例：通过animation-i...转载 2019-06-24 22:05:02 · 5001 阅读 · 0 评论 -
CSS3中设置动画播放方向
animation-direction属性主要用来设置动画播放方向，其语法规则如下：animation-direction:normal | alternate [, normal | alternate]*其主要有两个值：normal、alternate1、normal是默认值，如果设置为normal时，动画的每次循环都是向前播放；2、另一个值是alternate，他的作用是，动画播放在...原创 2019-06-24 22:05:53 · 2251 阅读 · 0 评论 -
CSS3中设置动画的播放状态
animation-play-state属性主要用来控制元素动画的播放状态。参数：其主要有两个值：running和paused。其中running是其默认值，主要作用就是类似于音乐播放器一样，可以通过paused将正在播放的动画停下来，也可以通过running将暂停的动画重新播放，这里的重新播放不一定是从元素动画的开始播放，而是从暂停的那个位置开始播放。另外如果暂停了动画的播放，元素的样式将...转载 2019-06-24 22:09:05 · 498 阅读 · 0 评论 -
CSS3中设置动画时间外属性
animation-fill-mode属性定义在动画开始之前和结束之后发生的操作。主要具有四个属性值：none、forwards、backwords和both。其四个属性值对应效果如下：属性值效果none默认值，表示动画将按预期进行和结束，在动画完成其最后一帧时，动画会反转到初始帧处forwards表示动画在结束后继续应用最后的关键帧的位置backwards会在向元素应用动画样式时...转载 2019-06-24 22:09:32 · 372 阅读 · 0 评论 -
CSS3 多列布局——Columns
为了能在Web页面中方便实现类似报纸、杂志那种多列排版的布局，W3C特意给CSS3增加了一个多列布局模块（CSS Multi Column Layout Module）。它主要应用在文本的多列布局方面，这种布局在报纸和杂志上都使用了几十年了，但要在Web页面上实现这样的效果还是有相当大的难度，庆幸的是，CSS3的多列布局可以轻松实现。接下来咱们一起学习多列布局相关的知识。语法：columns：...原创 2019-06-29 15:14:39 · 276 阅读 · 0 评论 -
CSS3中的动画--过渡延迟时间 transition-delay
transition-delay属性和transition-duration属性极其类似，不同的是transition-duration是用来设置过渡动画的持续时间，而transition-delay主要用来指定一个动画开始执行的时间，也就是说当改变元素属性值后多长时间开始执行。有时我们想改变两个或者多个css属性的transition效果时，只要把几个transition的声明串在一起，用逗号...原创 2019-06-11 12:11:28 · 7345 阅读 · 0 评论 -
CSS3中的动画--过渡函数 transition-timing-function
transition-timing-function属性指的是过渡的“缓动函数”。主要用来指定浏览器的过渡速度，以及过渡期间的操作进展情况，其中要包括以下几种函数：(单击图片可放大)案例展示：在hover状态下，让容器从一个正方形慢慢过渡到一个圆形，而整个过渡是先加速再减速，也就是运用ease-in-out函数。HTML代码:<div></div>CSS代码...原创 2019-06-11 10:40:20 · 1767 阅读 · 0 评论 -
CSS3中的动画--过渡所需时间 transition-duration
transition-duration属性主要用来设置一个属性过渡到另一个属性所需的时间，也就是从旧属性过渡到新属性花费的时间长度，俗称持续时间。案例演示：在鼠标悬停（hover）状态下，让容器从直角慢慢过渡到圆角，并让整个动画持续0.5s。HTML:<div></div>CSS:div { width: 300px; height: 200px; ...原创 2019-06-11 10:39:00 · 3326 阅读 · 0 评论 -
CSS3中的动画--过渡属性 transition-property
早期在Web中要实现动画效果，都是依赖于JavaScript或Flash来完成。但在CSS3中新增加了一个新的模块transition，它可以通过一些简单的CSS事件来触发元素的外观变化，让效果显得更加细腻。简单点说，就是通过鼠标的单击、获得焦点，被点击或对元素任何改变中触发，并平滑地以动画效果改变CSS的属性值。在CSS中创建简单的过渡效果可以从以下几个步骤来实现：第一，在默认样式中声明元素...原创 2019-06-11 10:37:02 · 6112 阅读 · 0 评论 -
CSS3中的变形--原点 transform-origin
任何一个元素都有一个中心点，默认情况之下，其中心点是居于元素X轴和Y轴的50%处。如下图所示：在没有重置transform-origin改变元素原点位置的情况下，CSS变形进行的旋转、位移、缩放，扭曲等操作都是以元素自己中心位置进行变形。但很多时候，我们可以通过transform-origin来对元素进行原点位置改变，使元素原点不在元素的中心位置，以达到需要的原点位置。transform-o...原创 2019-06-11 10:35:30 · 383 阅读 · 0 评论 -
CSS3中的变形--矩阵 matrix()
matrix() 是一个含六个值的(a,b,c,d,e,f)变换矩阵，用来指定一个2D变换，相当于直接应用一个[a b c d e f]变换矩阵。就是基于水平方向（X轴）和垂直方向（Y轴）重新定位元素,此属性值使用涉及到数学中的矩阵，我在这里只是简单的说一下CSS3中的transform有这么一个属性值，如果需要深入了解，需要对数学矩阵有一定的知识。示例演示：通过matrix()函数来模拟tra...原创 2019-06-11 10:33:40 · 479 阅读 · 0 评论 -
CSS3选择器 :checked选择器
在表单元素中，单选按钮和复选按钮都具有选中和未选中状态。（大家都知道，要覆写这两个按钮默认样式比较困难）。在CSS3中，我们可以通过状态选择器“:checked”配合其他标签实现自定义样式。而“:checked”表示的是选中状态。示例演示：通过“:checked”状态来自定义复选框效果。HTML代码<form action="#"> <div class="wrapp...原创 2019-06-04 12:03:45 · 1331 阅读 · 0 评论 -
CSS3 多列布局——column-width
column-width的使用和CSS中的width属性一样，不过不同的是，column-width属性在定义元素列宽的时候，既可以单独使用，也可以和多列属性中其他属性配合使用。其基本语法如下所示 ；column-width: auto | 取值说明属性值说明auto如果column-width设置值为auto或者没有显式的设置值时，元素多列的列宽将由其他属性来决定，比如前面的示例就是...转载 2019-06-29 15:15:07 · 428 阅读 · 0 评论 -
CSS3 多列布局——column-count
column-count属性主要用来给元素指定想要的列数和允许的最大列数。其语法规则：column-count：auto | 取值说明：属性值属性值说明auto此值为column-count的默认值，表示元素只有一列，其主要依靠浏览器计算自动设置。此值为正整数值，主要用来定义元素的列数，取值为大于0的整数，负值无效。例如：将列分成四列显示，代码如下：column-count:4...原创 2019-06-29 15:15:47 · 4019 阅读 · 0 评论 -
CSS3 列间距column-gap
column-gap主要用来设置列与列之间的间距，其语法规则如下：column-gap: normal || 取值说明属性值属性值说明normal默认值，默值为1em（如果你的字号是px，其默认值为你的font-size值）。此值用来设置列与列之间的距离，其可以使用px,em单位的任何整数值，但不能是负值。例如：将内容分三列显列，列与列之间的间距为2em，实现代码为：colum...原创 2019-06-29 15:16:18 · 2118 阅读 · 0 评论 -
Responsive设计——meta标签
最后还有一个不可或缺的东东，那就是meta标签，可以说，在响应式设计中如果没有这个meta标签，你就是蹩脚的，响应式设计就是空谈。个meta标签被称为可视区域meta标签，其使用方法如下。<meta name=”viewport” content=”” />在content属性中主要包括以下属性值，用来处理可视区域。在实际项目中，为了让Responsive设计在智能设备中能...原创 2019-08-16 20:23:44 · 162 阅读 · 0 评论 -
Responsive布局技巧
通过上面的介绍，大家对响应式设计有了一定的了解，但在实际制作中还是有一些布局技巧的：在Responsive布局中，可以毫无保留的丢弃：第一， 尽量少用无关紧要的div；第二，不要使用内联元素（inline）；第三，尽量少用JS或flash；第四，丢弃没用的绝对定位和浮动样式；第五，摒弃任何冗余结构和不使用100%设置。有舍才有得，丢弃了一些对Responsive有影响的东东，那么有哪...原创 2019-08-16 20:22:33 · 400 阅读 · 0 评论 -
Responsive设计（二）
（接上一节内容）4.屏幕分辨率屏幕分辨简单点说就是用户显示器的分辨率，深一点说，屏幕分辨率指的是用户使用的设备浏览您的Web页面时的显示屏幕的分辨率，比如说智能手机浏览器、移动电脑浏览器、平板电脑浏览器和桌面浏览器的分辨率。Responsive设计利用Media Queries属性针对浏览器使用的分辨率来适配对应的CSS样式。因此屏幕分辨率在Responsive设计中是一个很重要的东西，因为只...原创 2019-08-16 20:22:01 · 355 阅读 · 0 评论 -
Responsive设计（一）
什么是响应式设计呢？维基百科是这样对响应式作的描述：“Responsive设计简单的称为RWD，是精心提供各种设备都能浏览网页的一种设计方法，RWD能让你的网页在不同的设备中展现不同的设计风格。”从这一点描述来说，RWD不是流体布局，也不是网格布局，而是一种独特的网页设计方法。响应式设计要考虑元素布局的秩序，而且还需要做到“有求必应”，那就需要满足以下三个条件：网站必须建立灵活的网格基础；引用到...原创 2019-08-16 20:20:58 · 228 阅读 · 0 评论 -
Media Queries使用方法
了解完这些概念性的东西，同学们最想知道的是Media Queries要如何使用？下面我们一起来探讨其使用方法：Media Queries能在不同的条件下使用不同的样式，使页面在不同在终端设备下达到不同的渲染效果。前面简单的介绍了Media Queries如何引用到项目中，但Media Queries有其自己的使用规则。具体来说,Media Queries的使用方法如下。@media 媒体类型a...原创 2019-08-16 20:20:27 · 975 阅读 · 0 评论 -
media queries——媒体类型（二）
在实际中媒体类型有近十种之多，实际之中常用的也就那么几种，不过媒体类型的引用方法也有多种，常见的有：link标签、@import和CSS3新增的@media几种：link方法link方法引入媒体类型其实就是在标签引用样式的时候，通过link标签中的media属性来指定不同的媒体类型。如下所示。<link rel="stylesheet" type="text/css" href="st...原创 2019-08-16 20:19:16 · 162 阅读 · 0 评论 -
Media Queries——媒体类型（一）
随着科学技术不断的向前发展，网页的浏览终端越来越多样化，用户可以通过：宽屏电视、台式电脑、笔记本电脑、平板电脑和智能手机来访问你的网站。尽管你无法保证一个网站在不同屏幕尺寸和不同设备上看起来完全一模一样，但至少要让你的Web页面能适配用户的终端，让他更好的呈现在你的用户面前。在本节中，将会学到如何使用CSS3中的Media Queries模块来让一个页面适应不同的终端（或屏幕尺寸），从而让你的页面...原创 2019-08-16 20:18:22 · 265 阅读 · 0 评论 -
autocad2010 32位/64位免费中文版
AutoCAD2010软件，为用户提供最完美的解决方案。借助自由曲面设计工具，用户可以将自己的设计在任何可以想象到的任何形状的物体上实现。cad201具有良好的用户界面，通过交互菜单或命令行方式可进行各种操作。其多文档设计环境，非计算机专业人员也能很快学会使用，在实践过程中更好地掌握它的各种应用和开发技巧，从而不断提高工作效率。、autocad2010功能介绍1.提供众多绘图辅助工具，可帮助用...原创 2019-08-16 20:16:50 · 6086 阅读 · 1 评论 -
CSS3 伸缩布局（二）
Flexbox规范版本众多，浏览器对此语法支持度也各有不同，接下来的内容以最新语法版本为例向大家展示：5.Flex项目移到左边flex项目称动到左边或右边也取决于主轴的方向。如果flex-direction设置为row，设置justify-content控制方向；如果设置为column，设置align-items控制方向。.flexcontainer{ display: -webkit-fl...原创 2019-08-09 10:25:46 · 100 阅读 · 0 评论 -
CSS3 伸缩布局（一）
CSS3引入了一种新的布局模式——Flexbox布局，即伸缩布局盒模型（Flexible Box），用来提供一个更加有效的方式制定、调整和分布一个容器里项目布局，即使它们的大小是未知或者动态的，这里简称为Flex。Flexbox布局常用于设计比较复杂的页面，可以轻松的实现屏幕和浏览器窗口大小发生变化时保持元素的相对位置和大小不变，同时减少了依赖于浮动布局实现元素位置的定义以及重置元素的大小。F...原创 2019-08-09 10:25:13 · 147 阅读 · 0 评论 -
CSS3 盒子模型
CSS中有一种基础设计模式叫盒模型，盒模型定义了Web页面中的元素中如何来解析。CSS中每一个元素都是一个盒模型，包括html和body标签元素。在盒模型中主要包括width、height、border、background、padding和margin这些属性，而且他们之间的层次关系可以相互影响。从图中可以看出padding属性和content属性层叠background-image属性，层叠...原创 2019-08-09 10:18:53 · 156 阅读 · 0 评论 -
CSS3 跨列设置column-span
column-span主要用来定义一个分列元素中的子元素能跨列多少。column-width、column-count等属性能让一元素分成多列，不管里面元素如何排放顺序，他们都是从左向右的放置内容，但有时我们需要基中一段内容或一个标题不进行分列，也就是横跨所有列，此时column-span就可以轻松实现，此属性的语法如下。column-span: none | all例如：将第一个标题跨越...原创 2019-08-09 10:17:44 · 517 阅读 · 0 评论 -
Html和CSS的关系
学习web前端开发基础技术需要掌握：HTML、CSS、JavaScript语言。下面我们就来了解下这三门技术都是用来实现什么的：HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。JavaScrip...转载 2019-08-09 10:15:49 · 168 阅读 · 0 评论 -
CSS3 列表边框column-rule
column-rule主要是用来定义列与列之间的边框宽度、边框样式和边框颜色。简单点说，就有点类似于常用的border属性。但column-rule是不占用任何空间位置的，在列与列之间改变其宽度不会改变任何列的位置。语法规则：column-rule:||取值说明：属性值属性值说明column-rule-width类似于border-width属性，主要用来定义列边框的宽度，其默认值为...转载 2019-06-29 15:17:12 · 402 阅读 · 0 评论 -
CSS3选择器 :disabled选择器
“:disabled”选择器刚好与“:enabled”选择器相反，用来选择不可用表单元素。要正常使用“:disabled”选择器，需要在表单元素的HTML中设置“disabled”属性。示例演示通过“:disabled”选择器，给不可用输入框设置明显的样式。HTML代码：<form action="#"> <div> <input type="te...原创 2019-06-04 12:03:06 · 1042 阅读 · 0 评论 -
CSS3选择器 :enabled选择器
在Web的表单中，有些表单元素有可用（“:enabled”）和不可用（“:disabled”）状态，比如输入框，密码框，复选框等。在默认情况之下，这些表单元素都处在可用状态。那么我们可以通过伪选择器“:enabled”对这些表单元素设置样式。示例演示通过“:enabled”选择器，修改文本输入框的边框为2像素的红色边框，并设置它的背景为灰色。HTML代码:<form action="...原创 2019-06-04 12:02:23 · 350 阅读 · 0 评论 -
CSS3 结构性伪类选择器—target
:target选择器称为目标选择器，用来匹配文档(页面)的url的某个标志符的目标元素。我们先来上个例子，然后再做分析。示例展示点击链接显示隐藏的段落。HTML代码：<h2><a href="#brand">Brand</a></h2><div class="menuSection" id="brand"> conten...转载 2019-05-14 20:21:34 · 277 阅读 · 0 评论 -
CSS3 结构性伪类选择器—target
target选择器称为目标选择器，用来匹配文档(页面)的url的某个标志符的目标元素。我们先来上个例子，然后再做分析。示例展示点击链接显示隐藏的段落。HTML代码：Brand content for BrandCSS代码：.menuSection{display: none;}:target{/这里的:target就是指id="brand"的div对象/displa...转载 2019-05-14 20:20:03 · 167 阅读 · 0 评论 -
CSS3 结构性伪类选择器—empty
:empty选择器表示的就是空。用来选择没有任何内容的元素，这里没有内容指的是一点内容都没有，哪怕是一个空格。示例显示：比如说，你的文档中有三个段落p元素，你想把没有任何内容的P元素隐藏起来。我们就可以使用“:empty”选择器来控制。HTML代码：我是一个段落 CSS代码：p{background: orange;min-height: 30px;}p:empty ...原创 2019-03-17 10:22:53 · 257 阅读 · 0 评论