我正进入(状态
$ rake routes
rake aborted!
ArgumentError: Missing :action key on routes definition, please check your routes.
/usr/local/rvm/gems/ruby-2.1.2/gems/actionpack-4.1.5/lib/action_dispatch/routing/mapper.rb:243:in `default_controller_and_action'
/usr/local/rvm/gems/ruby-2.1.2/gems/actionpack-4.1.5/lib/action_dispatch/routing/mapper.rb:117:in `normalize_options!'
/usr/local/rvm/gems/ruby-2.1.2/gems/actionpack-4.1.5/lib/action_dispatch/routing/mapper.rb:65:in `initialize'
/usr/local/rvm/gems/ruby-2.1.2/gems/actionpack-4.1.5/lib/action_dispatch/routing/mapper.rb:1487:in `new'
/usr/local/r................
Run Code Online (Sandbox Code Playgroud)
这是我的Routes.rb
Rails.application.routes.draw do
get 'script/index'
get 'landing/index'
root 'landing/index'
end
Run Code Online (Sandbox Code Playgroud)
是什么导致了这个问题,我该如何解决它.
我正在遵循 Sara Vieira 的 React 意见指南中的一个示例。在这个例子中,她正在做这样的事情:
export async function getServerSideProps({ req }) {
const ip = req.headers['x-real-ip']
console.log(req.headers)
const { data } = await axios(`http://ip-api.com/json/${ip}`)
return {
props: {
location: data,
},
}
}
Run Code Online (Sandbox Code Playgroud)
我的标题控制台日志是:
{
host: 'localhost:3000',
connection: 'keep-alive',
'cache-control': 'max-age=0',
'upgrade-insecure-requests': '1',
'user-agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko)
Chrome/86.0.4240.111 Safari/537.36',
accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9',
'sec-fetch-site': 'same-origin',
'sec-fetch-mode': 'navigate',
'sec-fetch-dest': 'document',
referer: 'http://localhost:3000/',
'accept-encoding': 'gzip, deflate, br',
'accept-language': 'en-US,en;q=0.9,fr;q=0.8,ru;q=0.7,it;q=0.6'
Run Code Online (Sandbox Code Playgroud)
}
没有任何x-标头通过。我想这是因为我在跑步dev
我是第一次玩svg.晚会可能会很好.
我想在我的svg中做一些愚蠢的动画,但我遇到了一些麻烦
这是我的代码片段:http: //codepen.io/timbo27/pen/kAKJi
<div id="logo">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
<g>
<path class="logo-start" d="M59.1,66.6c0.2,0.2,0.4,0.3,0.4,0.6c0,0.3-0.3,0.7-0.6,0.7c-0.2,0-0.4-0.1-0.5-0.2l-4.9-3.3c-0.3-0.2-0.4-0.3-0.4-0.6
c0-0.3,0.2-0.5,0.4-0.6l4.9-3.3c0.1-0.1,0.3-0.2,0.5-0.2c0.3,0,0.6,0.3,0.6,0.6c0,0.3-0.2,0.5-0.4,0.6l-4.3,2.8L59.1,66.6z"/>
......
<path class="logo-stop" d="M161.4,63.7l-4.3-2.8c-0.2-0.2-0.4-0.3-0.4-0.6c0-0.3,0.3-0.6,0.6-0.6c0.2,0,0.3,0.1,0.5,0.2l4.9,3.3
c0.3,0.2,0.5,0.3,0.4,0.6c0,0.3-0.2,0.5-0.4,0.6l-4.9,3.3c-0.1,0.1-0.3,0.2-0.5,0.2c-0.3,0-0.6-0.3-0.6-0.7c0-0.3,0.2-0.5,0.4-0.6
L161.4,63.7z"/>
</g>
</svg>
</div>
Run Code Online (Sandbox Code Playgroud)
Basicaly我有一个SVG徽标(简单文字)
我给每个路径一个类,并在一些路径上做了一些最小的样式.
我希望能够绝对定位一些路径.
这可能吗?
谢谢
在Android浏览器上使用边界半径中的%值是否存在已知问题?
我注意到我使用时:
.element {
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
Run Code Online (Sandbox Code Playgroud)
边框半径似乎适用于所有移动浏览器,但是当我使用时:
.element {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
Run Code Online (Sandbox Code Playgroud)
边框半径不适用于Android浏览器.
我正在使用 Svelte/Sapper 编写服务器端渲染应用程序,但在使用 Font Awesome 字体时遇到问题。
我使用以下命令来加载字体:
<script>
import Icon from "svelte-awesome";
import { faTimes } from "@fortawesome/free-solid-svg-icons/faTimes";
</script>
<Icon data={faTimes} />
Run Code Online (Sandbox Code Playgroud)
我看到的错误是:“不是有效的 SSR 组件。您可能需要检查构建配置以确保依赖项已编译,而不是作为预编译模块导入”
有针对这个的解决方法吗?
我知道根据宽度调整图像大小:
img{
max-width: 100%;
height: auto;
}
Run Code Online (Sandbox Code Playgroud)
或者
img{
width: 500px;
height: auto;
}
Run Code Online (Sandbox Code Playgroud)
有没有办法通过高度来做到这一点?这似乎不起作用:
img{
height: 500px;
width: auto;
}
Run Code Online (Sandbox Code Playgroud)
我怎样才能做到这一点?
我一直在 NextJS/React 中使用样式化组件,我喜欢它。通常,我将我的样式分解成单独的 js 文件,但由于我对 React、props、hook 和 context 等相对较新,我经常发现需要将我的样式保留在我的组件文件中。我的问题是如何在 VSCode 中折叠以下代码:
const SomeStyledComponent = styled.div`
height: 300px;
width: 300px;
...
`;
Run Code Online (Sandbox Code Playgroud)
让我的编码生活更轻松将大有帮助。
谢谢你
我已经定义了两个函数来渲染一个圆和一个三角形.很直接的东西.
function circle(offset, size){
var color = $("#color option:selected").val();
var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
radius = size * 1;
context.beginPath();
context.arc(offset, 2, radius, 0, 2 * Math.PI, false);
context.fillStyle = color;
context.fill();
}
function triangle(offset, size){
var color = $("#color option:selected").val();
var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
var width = size * 6;
var height = size * 5;
var padding = 0;
// Draw a path
context.beginPath();
context.moveTo(offset + width/2, padding);
context.lineTo(offset + width, …Run Code Online (Sandbox Code Playgroud) 我的媒体查询有一个奇怪的问题.它们似乎在我的移动设备上运行得很好,但是当我调整桌面浏览器的大小时,不会应用更改.这使得使用Web检查器/ firebug无法检查我的移动样式.这是我的媒体查询:
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {}
Run Code Online (Sandbox Code Playgroud) 我希望为我的主页、简历页面、博客页面和其他页面设计一个布局。
到目前为止,在本教程中,我所看到的只是:
import React from "react";
export default ({ children }) => (
<div style={{ margin: `0 auto`, maxWidth: 650, padding: `0 1rem` }}>
{children()}
</div>
);Run Code Online (Sandbox Code Playgroud)
这不允许我指定这适用于哪个页面。它似乎适用于所有子页面
我有一个非常基本的 div 百分比宽度集。我试图将元素集中在<div class="media-top-center">.
这是 HTML 和 CSS 代码;
超文本标记语言
<div class="media-top-wrapper">
<div class="media-top-left">
Posted by <a href="<%= uploader.profilePath %>"><%= uploader.name %></a> from <a href="<%= attribution %>"><%= attribution_name %></a>
</div>
<div class="media-top-center">
<div class="top-center media-card-avatar-round" style="background-image:url('<%= uploader.avatar %>');"></div>
</div>
<div class="media-top-right">
<div class="heart"></div>
<div class="repost"></div>
<div class="flag"></div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS
.media-top-wrapper{
max-width: 100%;
margin: 0 auto;
}
.card-media-top-wrapper{
max-width: 100%;
margin: 0 auto;
}
.media-top-left,
.media-top-right{
width: 36%;
float: left;
box-sizing: border-box;
}
.media-top-center{
width: 28%;
float: left; …Run Code Online (Sandbox Code Playgroud)