小编cim*_*non的帖子

一开始以下划线开头的文件是什么意思?

我刚刚看了一些其他人开发的项目.

我觉得还可以.

程序员已经创建了一些以下划线开头的文件,例如_variables.scss,我在两个项目中都看到了这些文件.

我不知道为什么,我也搜索了它,我无法找到答案,如果有一个特殊的原因,人们以这种方式命名文件.

谢谢!

sass

12
推荐指数
1
解决办法
3654
查看次数

如何在圆形图像容器中保持非方形图像的尺寸

我正在用户的个人资料中创建一个圆形头像,并打算在圆形头像容器中设置用户的图像.

如果图像是正方形,则不会出现问题

在此输入图像描述

然而,例如对于该非方形图像,我不能约束不是正方形图像的图像

在此输入图像描述

我会得到这个结果

在此输入图像描述

这是我正在使用的CSS代码

.avatar_container {
  display: inline-block;
  width: 25%;
  max-width: 110px;
  overflow: hidden;
}
.avatar_container img {
  border-radius: 50%;
}
Run Code Online (Sandbox Code Playgroud)

我该怎么做才能始终保持圆形化身?并且其中的图像不会被扭曲?应该隐藏溢出

css

11
推荐指数
3
解决办法
7542
查看次数

语法错误:要导入的文件未找到或不可读:基础/公共/比率

我安装了基础,当我编辑并保存app.scss文件时,它会在我项目的sass文件夹中创建一个"app.css"和一个"config.rb"文件.当我打开"app.css"文件时,我得到了这个

Syntax error: File to import not found or unreadable: foundation/common/ratios.
Run Code Online (Sandbox Code Playgroud)

然后根据我得到这个:

File to import not found or unreadable: foundation/common/ratios.
          Load paths:
            /Applications/MAMP/htdocs/WebApp02/sass
            /Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/blueprint/stylesheets
            /Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets
            Compass::SpriteImporter
    on line 1 of /Applications/MAMP/htdocs/WebApp02/sass/_settings.scss
    from line 2 of /Applications/MAMP/htdocs/WebApp02/sass/app.scss
Run Code Online (Sandbox Code Playgroud)

然后是我的宝石的一堆路径.

在我想知道是否有人可以解释为什么会发生这种情况之前,它从未在我的sass文件夹中创建app.css和config.rb文件.指南针仍然符合"样式表"文件夹中的app.css,但我想解决这个问题,以防止任何未来的错误发生.

config.rb文件看起来像这样

require 'zurb-foundation'
Require any additional compass plugins here.


Set this to the root of your project when deployed:
http_path = "/"
css_dir = "stylesheets"
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "javascripts"

You can select your preferred output style here …
Run Code Online (Sandbox Code Playgroud)

terminal sass zurb-foundation compass-sass

11
推荐指数
1
解决办法
2万
查看次数

是否可以在按钮上使用:after伪元素?

我有一个按钮,在悬停时我想要一个after元素来显示.但我看不到它.是否可以在按钮上有一个:after元素?

HTML:

<button class="button button-primary">My button</button>
Run Code Online (Sandbox Code Playgroud)

CSS:

.button {
  cursor: pointer;
  height: 30px;
}

.button-primary {
  border: none;
}
.button-primary:hover:after {
  display: block;
  position: relative;
  top: 3px;
  right: 3px;
  width: 100px;
  height: 5px;
}
Run Code Online (Sandbox Code Playgroud)

html css pseudo-element

11
推荐指数
1
解决办法
4万
查看次数

如何从行中最后一个元素的每个元素中删除边距?

如何从<li>最后一列中删除保证金?<li>当我<li>在每列中有9 和3 时,我要求最后一栏中的每一个.我不要求只是删除margin从去年最后一个项目<li><ul>,我已经知道:last-child { margin-right: 0 }

如果屏幕较小或用户调整浏览器大小,则3 + 3 + 3可以变为4 + 52 + 2 + 2 + 2 + 1

所以在任何条件下<li>(最后一列中都有一个或多个).我想删除margin-right.

所有的李都在一个ul内

<ul>
   <li>item 1</li>
   <li>item 2</li>
   <li>item 3</li>
   <li>item 4</li>
   <li>item 5</li>
   <li>item 6</li>
   <li>item 7</li>
   <li>item 8</li>
   <li>item 9</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

我在这里添加了jsfiddle:http://jsfiddle.net/GnUjA/1/

css css3

10
推荐指数
2
解决办法
4159
查看次数

具有可变数量子表格的消化函数(Snap/Heist)

我正在努力将一个站点从PHP移植到Snap w/Heist.我已经将一些更简单的形式移植到成功使用Digestive Functors,但现在我必须做一些需要使用子表单的棘手的形式.

此应用程序管理为零售商店生产传单,因此需要完成的任务之一是添加广告尺寸并在打印的传单上定义其物理尺寸.尺寸将根据页面类型(可由传单所有者配置)及其方向(只能由管理员控制)而有所不同.

PHP版本中的表单是什么样的

这种形式保证至少有3个单元格,最有可能有9个单元格(如上图所示的PHP版本),但理论上可以有无限数量.

这是我到目前为止维度子表单的内容:

data AdDimensions = AdDimensions
    { sizeId :: Int64
    , layoutId :: Int64
    , dimensions :: Maybe String
    }

adDimensionsForm :: Monad m => AdDimensions -> Form Text m AdDimensions
adDimensionsForm d = AdDimensions
    <$> "size_id" .: stringRead "Must be a number" (Just $ sizeId d)
    <*> "layout_id" .: stringRead "Must be a number" (Just $ layoutId d)
    <*> "dimensions" .: opionalString (dimensions d)
Run Code Online (Sandbox Code Playgroud)

表单定义感觉不太正确(也许我在这里完全错误的想法?). AdDimensions.dimensions应该是a Maybe String,因为在运行查询时从数据库返回时它将为null,以获取新广告大小的size_id/layout_id的所有可能组合的列表,但是从类似查询中它不会为null将在创建编辑表单时运行.字段本身是必需的(在数据库中ad_dimensions.dimensions设置not null). …

haskell haskell-snap-framework heist digestive-functors

10
推荐指数
2
解决办法
655
查看次数

我可以在Windows 8.x本地测试Safari 7.0吗?

我正在Windows 8.x计算机上本地开发我的Web应用程序.现在我正在更新灵活的盒子布局模块支持的网页设计.

可以轻松测试Chrome和IE的设计.但有没有办法在本地测试Safari 6.1+支持?

似乎Apple不再为Windows开发Safari浏览器,而Safari 5.1是Windows的最新版本.Safari 5.1不支持最新的flexbox语法.

有没有一种简单的方法可以在Windows 8.x上进行本地测试,或者我是否可以在iOS设备上进行本地测试或将新设计置于现场,以便我可以在各种测试站点上进行测试?

css safari windows-8

10
推荐指数
1
解决办法
5166
查看次数

如何避免SCSS中的样式重复?

我希望有一个.scss文件包含所有其余.scss文件的一些varibles .但如果我这样做,它的.scss样式在我的所有.scss文件中都是重复的:

global.scss - 我的全局变量和样式文件

$white: #FFF;
$black: #000;
$bg_red: red;

.mt30 {
    margin-top: 30px;
}
Run Code Online (Sandbox Code Playgroud)

header.scss - 我想在此文件中使用全局变量和样式.

@include "global"

.foo {
    width: 100px;
    height: 50px;
    backgrounnd-color: $bg_red;
}
Run Code Online (Sandbox Code Playgroud)

main.scss - 我也想在这个文件中使用全局变量和样式.

@include "global"

.boo {
    width: 100px;
    height: 50px;
    backgrounnd-color: $white;
}
Run Code Online (Sandbox Code Playgroud)

但每个最终.css文件都有来自global.scss的样式.所以.mt30我的页面上有几种样式.怎么避免呢?

sass

10
推荐指数
2
解决办法
4211
查看次数

:last-of-type不起作用

示例GIF

我有一个带有缩写HTML内容的HTML文档:

<div class="list">
    <form name="signupForm">
      <label class="item item-input">
        <input>
      </label>
      <label class="item item-input">
        <input>
      </label>
      <label class="item item-input">
        <input>
      </label>
      <label class="item item-input">
        <input>
      </label>
      <label class="item item-button">
        <input class="button button-block button-positive">
      </label>
      <label class="item item-button">
        <input class="button button-block button-signup">
      </label>
    </form>
</div>
Run Code Online (Sandbox Code Playgroud)

我期望的行为是CSS选择器.item.item-input:last-of-type将获取父元素的第4个label元素和最后一个.item.item-input元素form.

我究竟做错了什么?

html css css3

10
推荐指数
1
解决办法
4923
查看次数

CSS使用ui-router滑动视图

我试图实现滑入/退出视图的相同效果,如下所示:

http://dfsq.github.io/ngView-animation-effects/app/#/page/1

我创建了一个plunker:http://plnkr.co/edit/ST49iozWWtYRYRdcGGQL?p = preview

但是当我从上面的链接复制CSS时,我的整个ui视图完全消失了,并认为它可以归结为position: relative我的container

CSS:

*,
*:after,
*:before {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  min-height: 100%;
  position: relative;
}
html body {
  font-size: 140%;
  line-height: 1.5;
  margin: 0;
  padding: 0 0;
  margin-bottom: 60px;
}

.container {
  max-width: 430px;
  margin: 0 auto;
  position: relative;
  display: block;
  float: none;
  overflow: hidden;
}

.l-one-whole {
  width: 100%;
}

form {
  background: #f0f0f0;
  height: 350px;
  padding: 10px;
  font-size: 1.4em;
} …
Run Code Online (Sandbox Code Playgroud)

css css3 angularjs angular-ui-router

10
推荐指数
3
解决办法
4218
查看次数