ICode9

精准搜索请尝试: 精确搜索
  • 微信小程序之下拉菜单场景2021-09-23 16:05:02

    效果图: js文件 Page({ data:{ li:['默认排序','离我最近','价格最低','价格最高'], shownavindex:0 }, // 下拉事件 listmenu: function(e) { if (this.data.openif) { this.setData({

  • 前端基础02——CSS详解2021-09-23 16:04:55

    CSS Cascading Style Sheet:层叠级联样式表 CSS:表现(美化网页) 字体,颜色,边距,高度,宽度,背景图片,网页定位,网页浮动... 发展史: CSS1.0 CSS2.0 DIV(块) + CSS,HTML与CSS结构分离的思想,网页变得简单,SEO CSS2.1 浮动,定位 CSS3.0 圆角,阴影,动画... 浏览器兼容性~ 快速入门 <!DOCTYPE html>

  • flex使用场景2021-09-23 11:04:38

    1.绝对居中: .box {     display: flex;     width: 100%;     height: 500px;     background: #cccccc;     justify-content: center;//主轴居中     align-items: center; //交叉轴居中   }   .box div {     width: 50px;   

  • 关于简易的增删改查2021-09-22 21:06:00

    效果展示: 主要三个文件:html+css+js   html文件: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="

  • Web前端-HTML&CSS笔记之072021-09-22 06:33:08

    Web前端-HTML&CSS笔记之07 0907 布局(layout) 文档流(normal flow) 网页是一个多层的结构,一层叠一层。 通过css可以分别为每一层来设置样式 作为用户来讲只能看到最顶上一层 这些层中,最底下的一层成为文档流,文档流是网页的基础。 我们所创建的元素默认都是在文档流中进行排列

  • 2021-09-212021-09-21 23:30:03

    反转九九乘法表和正序乘法表 for(var i = 9; i>0; i--){ for(var j=1; j<=i; j++){ num = i*j; document.write(i+"*"+j+"="+num+"&nbsp;&nbsp"); } document.write("<br/>"); } for(var i=1;i<=9;i++)

  • CSS盒子模型之盒子水平方向学习笔记2021-09-21 13:06:40

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=d

  • HTML&CSS笔记2021-09-21 02:03:35

    1 、B/S 软件的结构 JavaSE C/S Client Server B/S Browser Server 2、前端的开发流程 3、网页的组成部分 页面由三部分内容组成! 分别是内容(结构)、表现、行为。 内容(结构),是我们在页面中可以看到的数据。我们称之为内容。一般内容 我们使用 HTML 技术来展示。 表现,指的是这些内

  • css绘制基本图形2021-09-20 17:01:05

    说明 css可以绘制各种图形,基本图形包括三角形、圆形、梯形、椭圆形、矩形等,但还有一些复杂图形是由这些基本图形组合而成 基本形状 三角形 .triangle { width: 0; height: 0; border: 50px solid blue; /* 通过改变边框颜色,可以改变三角形的方向 */ bor

  • 二级导航栏2021-09-20 11:02:23

    css 样式 为了工作和平时项目的需要,在自己工作空余时间自己写的一个 css 样式 同时也是为了巩固 css 和 sass 的知识 目的是为了:适应每一个项目自己重置样式,创造属于自己的 style 虽然目前已有很多流行和成熟的 css 框架,如 bootstrap,Semantic UI,Pure…都有各的优点 但还是

  • reset.css 和 normalize.css2021-09-19 10:05:50

    reset.css @charset "utf-8";html{background-color:#fff;color:#000;font-size:12px}body,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,figure,form,fieldset,legend,input,textarea,button,p,blockquote,th,td,pre,xmp{margin:0;padding:0}body,input,textarea,button,select,

  • 编写一个关于Java Bean类url,包括:name(名称)、site(官网)和property(性质)等属性。在控制器方法中生成一组Url,并在页面中返回。2021-09-19 10:02:53

    一、题目 编写一个关于Java Bean类url,包括:name(名称)、site(官网)和property(性质)等属性。在控制器方法中生成一组Url,并在页面中返回。 要求: 1、奇偶行的背景颜色不同; 2、背景色定义在一个css文件中,并通过link标签引入。 示例: 二、实体类 public class Url { private String

  • CSS动画2021-09-18 19:00:20

    效果图 CSS代码 * { margin: 0; padding: 0; box-sizing: border-box; } body { display: flex; justify-content: center; align-items: center; background-color: #111; min-height: 100vh; } .loader { position: relative; width: 200px; height

  • 设置TABLE表格边框为单实线2021-09-18 11:03:36

    .hcp-table { width: 100%; margin-top: 30px; border-spacing: 0; text-align: center; border-top: 1px solid #e8e8e8; border-left: 1px solid #e8e8e8; } .hcp-table th { padding: 10px; background: #63a2e8; border-right: 1px solid #e8e8e8; border-bott

  • # 1. 正则表达以及失去焦点验证的JS书写2021-09-18 10:58:17

    1. 正则表达以及失去焦点验证的JS书写 <script> function leave(a) { var reg = /^[ \u4e00-\u9fa5a-zA-Z0-9_-]{5,16}$/;//[ title: [/^[a-zA-Z0-9_-]{5,16}$/, '用户名是5-16不含空的字母'], if (reg.test(a.value) != true) { var use

  • 鼠标放入图片被遮盖2021-09-18 09:59:18

    HTML <body> <div class="box"> <img src="./3.jpg" alt=""> <div class="box2"></div> </div> </body> css 下侧滑入 <style> .box{

  • 使用边框和背景2021-09-17 18:34:56

    使用边框和背景 应用边框样式 先从控制边框样式的属性开始。这些属性使用相当普遍,有了它们,要学习margin和padding属性就在视觉上方便多了。简单边框有三个关键属性:border-width、border-style和border-color。下表描述了这三个属性。 基本边框属性 属 性 说 明 值 border

  • CSS 怀表式翻转2021-09-17 14:58:23

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=

  • display: inline-flex的妙用以及和display: flex 的区别是什么?2021-09-17 14:01:51

    有时候我们使用了display: flex属性后,子元素横向排列,你可能会发现如下图现象: 父级元素不设置宽度,背景宽度默认100%,如果这时想让父级元素随着子元素宽度自适应,怎么处理? 接下来,上代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style> .wrap {

  • div拖拽改变其宽度2021-09-17 14:00:40

    CSS: body { margin:0; padding:0; overflow-y:auto; } #leftDiv { width:300px; height:500px; border:1px red solid; border-right:none; float:left; } #splitDiv { float:left; width:1px; height:500px; border-left:1px blue solid; } #rightDiv { margi

  • 苹果手机滚动条样式无效2021-09-17 11:04:29

    网上查了一些资料,提到的很少,应该是苹果手机 ios系统升级到 13.0版本后   -webkit-overflow-scrolling: touch;  会导致滚动条自定义样式无效   -webkit-overflow-scrolling: auto; 或者不写这个,如果还是无效,添加下面的红色样式部分,添加一处就可以,如果有其他的解决方式欢迎留言

  • animation实现一个搜索扩散动效2021-09-16 18:34:39

    上gif 简单分析一下 1.旋转的线,我们设置他的旋转位置从他的左下开始转动就ok了,再把最中的的圆层级设置高一点,就可以遮挡住线的一部分,看起来就是旋转的线在绕着中心的圆旋转。 2.闪现的点,控制百分比来实现展示顺序,比如我设置的3s要执行完一次闪烁。 上代码 html结构如下 <div

  • 响应式布局@media screen and ( max-width: 像素值 ) {}2021-09-16 11:33:46

    设计思路很简单,首先先定义在标准浏览器下的固定宽度(假如标准浏览器的分辨率为1024px,那么我们设置宽为980px),然后用Media Query来监测浏览器的尺寸变化,当浏览器的分辨率小于1024px的时候,则通过Media Query预设的样式表来将页面的宽度设置为百分比显示,这样子页面的结构元素就会根据浏

  • style 变量赋值样式2021-09-15 18:04:30

    <template> <div style="background:#ff0ff0"> <div class="cicle1" :style="{'border' : c1_color + ' 1px solid ', 'background-color' : bg }"> <div class="cicle2

  • 正达管理后台首页2021-09-15 18:03:23

    PC端管理后台页面制作,代码如下: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta n

专注分享技术,共同学习,共同进步。侵权联系[admin#icode9.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有