ICode9

精准搜索请尝试: 精确搜索
  • 移动页面布局方案2021-12-30 02:32:59

    @目录1. 移动端布局主流方案1.) 单独制作移动端页面(主流)2.) 响应式页面兼容移动端(其次)2. 移动端技术解决方案1.) 移动端浏览器兼容问题2.) 移动端公共样式 normalize3. 移动端大量使用 CSS3盒子模型box-sizing4. 移动端特殊样式 1. 移动端布局主流方案 1.) 单独制作移动端页面(主

  • 移动端知识点2021-12-29 22:30:00

    <!DOCTYPE html> <html lang="en"> <!--还有添加的知识点 本来我们的分辨率是可以对上物理像素的1:1 因为**屏幕技术的出现啊(忘记了)它让像素点在屏幕上压缩使得原本的区域像素点得到了翻倍 n*n 各个手机不一样造成了我们的n倍显示1px我们现在是如比我们的开发像素使365px 手机

  • Flex之justify-content 和 flex-direction2021-12-23 20:03:15

    基础知识: 采用Flex布局的元素,被称为Flex容器(flex container),简称"容器"。其所有子元素自动成为容器成员,成为Flex项目(Flex item),简称"项目" Flex-direction调整主轴方向(默认为水平方向)包括row、column、row-reverse、column-reverse     要点1: justify-content: space-between;

  • css 文本超出就隐藏并且显示省略号2021-12-23 13:05:21

    一、单行文本溢出显示省略号 overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; //溢出不换行 二、多行文本溢出显示省略号 overflow: hidden; text-overflow: ellipsis; display:-webkit-box; //作为弹性伸缩盒子模型显示。

  • js实现文字折叠展开、收起效果2021-12-22 14:00:13

    <div @click="open('open','jianjie_text')" v-if="isShow" id="open" style="color:#6EC4F2;font-size:14px;cursor: pointer;">展开</div> <p style="margin:8px 0;font-size:14px;line-h

  • css 设置连续数字、连续英文字母强制换行和多行显示省略号的方法2021-12-21 11:03:27

    1、设置连续数字和连续英文字母换行 white-space: normal; word-break: break-all; word-wrap: break-word; 2、设置显示省略号方法    一行显示省略号的方法,如下: overflow: hidden; text-overflow:ellipsis; white-space: nowrap;   多行显示省略号的方法,如下(设置2行后显

  • css——禁止选中文字2021-12-20 16:03:42

    问题:   在CSS中添加样式使dom中的文字无法被选中 解决办法 -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -

  • CSS 文字超出范围用省略号表示2021-12-16 16:31:12

    1. 单行固定宽度,文字超出部分用省略号代替。 .box-text{ /* 下方四项配合使用,超出范围的显示... */ width: 400rpx; overflow: hidden; /*隐藏*/ white-space: nowrap; /*不换行*/ text-overflow: ellipsis; /* 超出部分省略号 */ } 2. 多行固定宽高,文字超出部分,

  • animate动画使用2021-12-14 23:01:04

    文章目录 增加动画效果animate.css1: 在你static/css新增animate.css动画文件02、使用03、程序使用 增加动画效果animate.css 1: 在你static/css新增animate.css动画文件 官网下载地址:https://animate.style/ 下载地址:https://cdnjs.cloudflare.com/ajax/libs/animate.c

  • 有关浏览器(上)2021-12-14 12:32:14

    pc端主要五大浏览器:谷歌(Chrome浏览器)、火狐 (Firefox浏览器)、IE(IE浏览器)、欧朋(opera浏览器)、苹果(Safari浏览器) (做pc端兼容时,只需要考虑IE的版本,其他默认都是最高版本浏览器,不需要考虑版本。) 移动端有五大类:(注意:写的webApp测试都是用内置浏览器测试。不要用uc浏览器测试哦!QQ浏览

  • swiper7-27. 切换页面是浏览器的网址会有所变化,就像锚点一样2021-12-14 07:03:07

    1 <template> 2 <div class="swiper mySwiper"> 3 <div class="swiper-wrapper"> 4 <div data-hash="slide1" class="swiper-slide">Slide 1</div> 5 <div data-hash="

  • swiper7-28. history 历史记录导航,即每张轮播图都有url,可以返回,但是在vue中不行2021-12-14 07:02:56

    1 <template> 2 <div class="swiper mySwiper"> 3 <div class="swiper-wrapper"> 4 <div data-history="1" class="swiper-slide">Slide 1</div> 5 <div data-history=&quo

  • 元素中显示n行文字且超出隐藏显示省略号2021-12-13 16:31:36

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>元素中显示n行文字且超出隐藏显示省略号</title> <style type="text/css"> .div1 { width: 300px; overflow: hidden;

  • css 让页面变灰色2021-12-13 14:02:34

    html { -webkit-filter: grayscale(1); }-webkit-filter(滤镜)有十种效果,分别是:     // grayscale 灰度     // sepia 褐色     //saturate 饱和度     // hue-rotate 色相旋转     // invert 反色     //opacity 透明度     //brightness 亮度     //contra

  • 一句代码把彩色的页面改为黑白色调2021-12-13 10:30:01

    将彩色的HTML页面改为黑白色调 12月13日是国家公祭日 , 今天基本各大网站都会把色调改为黑白色来纪念过去 如果你还不会改色调 接着往下看 一句代码解决 如果有帮到你 请点个赞 谢谢诶 效果图 (这里只是测试给大家看 用的手机端 ) 代码 只需要在最高级的css中加入这句

  • css样式控制网页页面整体变灰色代码2021-12-13 09:32:02

    在页面中,想要把网页整体变成灰色,可以在html样式中添加以下代码,便可轻松搞定。 html{ filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter:progid:DXImageTransfo

  • swiper7- 12. 网格布局2021-12-12 18:03:25

    1 <template> 2 <!-- Swiper --> 3 <div class="swiper mySwiper"> 4 <div class="swiper-wrapper"> 5 <div class="swiper-slide">Slide 1</div> 6 <div class="swipe

  • swiper7- 13.横向滚动中内嵌竖向滚动2021-12-12 18:01:02

    1 <template> 2 <!-- Swiper --> 3 <div class="swiper mySwiper swiper-h"> 4 <div class="swiper-wrapper"> 5 <div class="swiper-slide">Horizontal Slide 1</div> 6 <d

  • swiper7-14. 设置无限滚动2021-12-12 18:00:17

    1 <template> 2 <!-- Swiper --> 3 <div class="swiper mySwiper"> 4 <div class="swiper-wrapper"> 5 <div class="swiper-slide">Slide 1</div> 6 <div class="swipe

  • swiper7-15. 一个容器放三张图片并无限滚动2021-12-12 18:00:06

    1 <template> 2 <!-- Swiper --> 3 <div class="swiper mySwiper"> 4 <div class="swiper-wrapper"> 5 <div class="swiper-slide">Slide 1</div> 6 <div class="swipe

  • swiper7-3.添加指示点(就是小点点)2021-12-12 17:37:43

    1 <template> 2 <div class="swiper mySwiper"> 3 <div class="swiper-wrapper"> 4 <div class="swiper-slide">Slide 1</div> 5 <div class="swiper-slide">Slide 2<

  • swiper-4.添加滚动条2021-12-12 17:36:32

    1 <template> 2 <div class="swiper mySwiper"> 3 <div class="swiper-wrapper"> 4 <div class="swiper-slide">Slide 1</div> 5 <div class="swiper-slide">Slide 2<

  • swiper7-5.设置轮播图片之间的间隔2021-12-12 17:35:01

    1 <template> 2 <div class="swiper mySwiper"> 3 <div class="swiper-wrapper"> 4 <div class="swiper-slide">Slide 1</div> 5 <div class="swiper-slide">Slide 2<

  • swiper7-1.初始化配置2021-12-12 17:34:12

    1 <template> 2 <div class="swiper mySwiper"> 3 <div class="swiper-wrapper"> 4 <div class="swiper-slide">Slide 1</div> 5 <div class="swiper-slide">Slide 2<

  • swiper7-2.添加点击上一张和下一张功能2021-12-12 17:32:40

    1 <template> 2 <div class="swiper mySwiper"> 3 <div class="swiper-wrapper"> 4 <div class="swiper-slide">Slide 1</div> 5 <div class="swiper-slide">Slide 2<

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

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

ICode9版权所有