个人中心
文章发布
退出
作者热门文章
- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
24
4
我希望这段代码能使内容在垂直和水平方向上居中。它会这样做，但只要我将窗口变小(移动尺寸)，文本的(h1 和 p)对齐方式就会向左更改。
我是否遗漏了一些非常基本的东西？我可以说 text-center 然后它工作，但我不想自己添加任何 CSS 样式。
angular.module('app', ['ngMdIcons', 'ngMaterial']);<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/0.10.0/angular-material.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=RobotoDraft:300,400,500,700,400italic">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://login.persona.org/include.js"></script>
<script src="https://code.angularjs.org/1.4.0/angular.js"></script>
<script src="https://code.angularjs.org/1.4.0/angular-route.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.10.0/angular-material.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-material-icons/0.5.0/angular-material-icons.min.js"></script>
</head>
<body layout="column" ng-app="app">
<div layout="row" flex layout-align="center center">
<div layout="column" layout-align="center">
<h1>Welcome to Dreamland!</h1>
<md-button class="md-hue-2 md-raised md-primary" >
<h1 class="md-display-1">Login</h1>
</md-button>
<p class="md-caption">This web site uses your membership with the given email address.</p>
</div>
</div>
</body>
</html>最佳答案
试试这个
<div layout="column" layout-align="center center">
<h1>Welcome to Dreamland!</h1>
<md-button class="md-hue-2 md-raised md-primary btn">
<h1 class="md-display-1">Login</h1>
</md-button>
<p class="md-caption">This web site uses your membership with the given email address.</p>
</div>
CSS:
.btn{
width: 350px;
}
关于html - Angular Material layout-align center 不影响小模式下的文本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30948115/
24
4
0
这个问题在这里已经有了答案: Flexbox: Align between bottom and center? [duplicate] (2 个答案) 关闭 6 年前。 我正在尝试使用 flexb
用于居中元素的标签是 或 ? 我知道 或 标签不再使用，但哪一个是正确的？ 我很迷惑。 Visual Studio 代码说 错了，但只有适用于 Microsoft Edge。 编辑:Microsof
我使用的是标准匹配用户界面和两台 iPad iOS6。问题是当我在第一台设备中创建新的匹配项时，第二台设备应该在我查看匹配用户界面时看到现有的匹配项，但事实并非如此。我确定我的代码是正确的。这是方法:
在我的项目的两个不同的类(都扩展 JFrame)中，我尝试这样做: header = new JLabel("Header"); header.setHorizontalAlignme
我已经在我的网站中实现了以下 jQuery 视差效果(取自 http://www.brandaiddesignco.com/insights/parallax-scrolling-made-easy/
每当我在我的 css 中居中文本时，它也会使图像居中。这是为什么？文本位于一个 div(“左”)内，图像位于第二个 div(“右”)内。这是 HTML - BANKS 还有
我现在有这段代码: 1 enE jk 5.6 mtE hp 6.4 hpE eb HML reE pm 514 hpE e
我只是制作一个页面或类似的东西。我想让我的按钮居中，但它不起作用。 我尝试用不同的方法将它居中，但它不起作用。看看代码。它有但它并没有将它置于整个页面的中心但只是喜欢......我不知道。照片:htt
我想知道如何将此页面中的字形居中，它们是使用@font-face 的图标字体，但即使在我将 text-align:center 应用于包含每个字形的 anchor 之后，它们也不是居中。 它们显示为左
考虑以下 HTML 片段， Hyperlink 如上所示，由于“...”标签，所有内容都将居中对齐。但是，我不希望带有“id=three”的 HTML 元素的中心对齐
我有以下 html: Site Map Privacy Policy Terms & Condi
我在将我正在处理的布局中的按钮上的文本居中时遇到问题。请查看下面的屏幕截图(在 eclipse 的“图形布局”选项卡中截取): 我不确定是什么原因造成的。我试着玩弄按钮的各个布局属性，但这没有任何效果
我正在尝试使用 Bootstrap 组装页脚。由于某些原因，尽管确保应用了 text-align: center;，但页脚链接看起来略微偏离中心。有没有办法确保所有文本元素确实正确对齐？ HTML
我在使用 flexbox 工具 align-items:center; 时遇到了问题，它在中间并不完美，但文本、图标等的像素太高了……有人知道如何解决这个问题？ screenshot how it l
关闭。这个问题需要debugging details .它目前不接受答案。 编辑问题以包含 desired behavior, a specific problem or error, and t
GameKit 是否允许您以编程方式邀请特定的 Game Center friend 参加比赛，即不提供 GC ViewController？以下 handleInviteFromGameCenter
我有一个布局问题。 假设我有一个 RelativeLayout 出现在我的屏幕底部。在此，我想添加 2 个 TextView ，一个在中心，一个在顶部中心，一个在底部中心。 |------------
我有一个启动画面的 Activity layout.xml，它基本上显示了我想要的内容。但是如果我在更大或更小的屏幕设备上打开应用程序，它就不再居中了。 有没有办法在元素周围放置一个包装器并将其在屏幕
尝试了几十种方法后，我自己也想不出解决方案 #banner .slide { position: static; top: 0px; left: 0px; z-inde
您将如何修复以下传递过多参数的错误代码？ void helper1(int p1, int p3, int p5, int p7, int p9, int p10) { // ... } void
我是一名优秀的程序员,十分优秀！