zoukankan      html  css  js  c++  java
  • 随笔

      最近真的是太忙了,回头一看,竟然有2个多月没更新博客了。回顾换了工作后的两个月以来,真的是觉得忙忙忙,累累累,但是收获还是很多,见过了很多没见过的东西。刚来的时候,一个同事帮我定位bug,几分钟搞定,而我之前花了一个多小时甚至更多,光是看他定位bug的操作,就能长知识,佩服他的思维逻辑,一步推一步,怪不得这么迅速。

      先记录几个还记得。

      1.calc(100% - 20px)------用来设置宽度,比100%少20px

        当在less中时要这么写:calc(~"100% - 20px")

        100%和-和20px间要留出空格

      2.开发者工具的Evnet Listeners可以找到元素上的事件

      3.注册事件加命名空间更严谨,不会被别人的相同事件覆盖

      4.@media这个样式总是记不住怎么用

    @media (min- 768px){ //>=768的设备 }
    @media (min- 992px){ //>=992的设备 }
    @media (min- 1200){ //>=1200的设备 }
    //注意下顺序,如果你把@media (min- 768px)写在了下面那么很悲剧,
    @media (min- 1200){ //>=1200的设备 }
    @media (min- 992px){ //>=992的设备 }
    @media (min- 768px){ //>=768的设备 }
    因为如果是1440,由于1440>768那么你的1200就会失效。
    //所以我们用min-width时,小的放上面大的在下面,同理如果是用max-width那么就是大的在上面,小的在下面
    @media (max- 1199){ //<=1199的设备 }
    @media (max- 991px){ //<=991的设备 }
    @media (max- 767px){ //<=768的设备 }

      5.学会了gulp编译less

      在less中引入less:@import 'main.less';

      6.这两个要搭配使用,某些浏览器默认的对齐方式不同,不设置可能会导致样式问题

    display: inline-block;
    vertical-align: middle;

      7.在less中写hover,active

    .icon{
        &:hover{}
        &:active{}     
    }

      点击的样式可以卸载:active中

      划过的样式可以写在:hover中

      8.滚动条样式设置

        ::-webkit-scrollbar滚动条的外围

        ::-webkit-scrollbar-thumb滚动条本身

      .messages-list::-webkit-scrollbar{
            width: 2px;
            background-color: #F0F0F0;
            border-radius: 100px;
            -webkit-border-radius:100px;
        }
        .messages-list::-webkit-scrollbar-thumb{
            border-radius: 100px;
            -webkit-border-radius:100px;
            background-color: #999;
        }
  • 相关阅读:
    JavaScript数据类型和变量学习小记
    如何在windows下安装Python的PIL库
    maoguy的第一条博客
    Ⅲ. 通过git管理github上托管的代码
    Ⅱ. Git的本地操作--下(不会使github远程仓库发生任何改变)
    Ⅰ. Git的本地操作--上(不会使github远程仓库发生任何改变)
    Linux下Vi/Vim编辑器使用案例(基于Ubuntu)
    Selenium+python上传本地文件或者图片
    Selenium+python操作id为动态变化的frame(iframe)
    Quick-cocos2d-x v3.3 SocketTCP链接(转)
  • 原文地址:https://www.cnblogs.com/yueliangcl/p/7491209.html
Copyright © 2011-2022 走看看