V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Can I use?
http://caniuse.com/
Less
http://lesscss.org
Cool Libraries
Bootstrap from Twitter
Jetstrap
bao3
V2EX  ›  CSS

求助: Safari 的 CSS 护眼模式

  •  
  •   bao3 · 2021-07-04 23:34:01 +08:00 · 658 次点击
    这是一个创建于 1248 天前的主题,其中的信息可能已经有所发展或是发生改变。

    我不知道怎么形容,Safari 的夜间模式但是很多网页底色是白色,让我晚上关灯之后觉得特别刺眼。后来发现 Safari 的设置-- 高级 -- 样式表,是支持 CSS 的。于是我就自己手写个小文件,我不会写代码,所以自己查 css 自己拼凑了一下。

    发在这里,是求大神完善一下。。。还多我确实不会实现。切勿嘲笑,抠脚大汉硬拗的

    PS:刚才发帖的时候才发现,Safari 可以直接从 mac store 安装扩展,可以通过 user script 改底色,不过我这个拼凑的 css 可以摆脱 扩展使用,我还挺喜欢。

    * {
        text-shadow: none !important; 
    /* 下面是文字颜色 */
        color: #667B83 !important;
    /* 下面是边框颜色 */  
        border-color: #596E75 !important;
    
    /* 接下来就是背景颜色了 */
        background-color: #022B35 !important;
    
    }
    a {
        /* 这里是超链接的高亮颜色 */
        color: #93A1A1 !important;
        text-shadow: none !important; 
        font-weight: bold;
        cursor: context-menu;
        text-decoration:none;
        outline:0;
    }
    ::selection {
        /*background-color: #EEE8D6; */
        background-color: #FFA;
        color: #000000;
    }
    img {
    	/*图片加滤镜*/
        filter:brightness(50%) opacity(50%) ;
    }
    input {
    	-webkit-appearance:none;
    	display:block;
    	text-decoration:none;
    	border: 1px solid #ccc;
    	border-radius: 4px;
    	outline-color: invert ;
    	outline-style: none ;
    	outline-width: 0px ;
    	
    }
    
    input[type="text"]:focus{
      border:1px solid #ff7496;
      border-radius: 4px;
      border-color: #66afe9;
        outline: 0;
        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
    }
    input::-webkit-input-placeholder{
      color: #6a6f77;
    }
    button:hover {
        box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
    }
    button {
    	display: outline-block;
    	* display:outline;
    	position: relative;
    	outline:0;
    }
    
    table.gridtable {
        font-family: verdana,arial,sans-serif;
        font-size:11px;
        color:#333333;
        border-width: 1px;
        border-color: #666666;
        border-collapse: collapse;
    }
    
    
    
    

    v2ex 效果 NAS 群晖 github 效果

    目前尚无回复
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1522 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 17:18 · PVG 01:18 · LAX 09:18 · JFK 12:18
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.