我正在尝试为名片编写语义HTML。我想在标记上显示姓名,标题,电子邮件和电话号码。
<div id="bussinesscardcontainer">
<section class="Details">
<span> Name :ABC</span>
<span> Title:XYZ </span>
</section>
<footer class="contact">
<span class="email"> Email:abc@abc.com</span>
<span class="phonenumber">Mobile:123-123-123</span>
</footer>
</div>
Run Code Online (Sandbox Code Playgroud)
我只是想了解我的标记在语义上是否正确。
这种标记最终看起来 很难使用CSS设计名片
我和nth-of-type选择器混淆了.
我试过这个片段
.red:nth-of-type(1){
color:red;
}Run Code Online (Sandbox Code Playgroud)
<div class="home">
<span>blah</span>
<p class="red">first</p>
<p class="red">second</p>
<p class="red">third</p>
<div class="red">fourth</div>
</div>Run Code Online (Sandbox Code Playgroud)
它得到p和div的类红色并改变它的颜色
现在我坚持这个例子
section .foo:nth-of-type(1){
background:red;
}
.parent .foo:nth-of-type(1){
background:red;
}Run Code Online (Sandbox Code Playgroud)
<section>
<p class="foo">Little</p>
<p>Piggy</p>
<div>...</div>
<div class="foo">border...</div>
</section>
<div class="parent">
<i class="foo">1</i>
<i>x</i>
<i class="foo">2</i>
<b class="foo">3</b><b>x</b><b class="foo">4</b>
</div>Run Code Online (Sandbox Code Playgroud)
我期望在foo类的部分中使用p和div来获得红色背景但是它不起作用,当div被span替换时它很好用
但是,代码中父div的其他样式正常工作,样式i和b
我有一条路
<Route path="/account/:accountid/LoginPage"
component={LoginPage}/>
Run Code Online (Sandbox Code Playgroud)
如果网址是 - >,这可以正常工作/account/12332/LoginPage.我想要可选的查询参数.网址结构就像
/account/12322/LoginPage?User=A&User=B
Run Code Online (Sandbox Code Playgroud)
我修改了路径为
<Route path="/account/:accountid/LoginPage(/:User)"
component={LoginPage}/>
Run Code Online (Sandbox Code Playgroud)
在此之后,如果我尝试访问该网址,它不会将我重定向到相应的页面,而是会抛出错误
useBasename.js:56 Uncaught TypeError: history.getCurrentLocation is not a function
at Object.getCurrentLocation (useBasename.js:56)
at Object.getCurrentLocation (useQueries.js:64)
at Object.listen (createTransitionManager.js:246)
at Object.componentWillMount (Router.js:97)
at ReactCompositeComponent.js:347
at measureLifeCyclePerf (ReactCompositeComponent.js:75)
at ReactCompositeComponentWrapper.performInitialMount (ReactCompositeComponent.js:346)
at ReactCompositeComponentWrapper.mountComponent (ReactCompositeComponent.js:257)
at Object.mountComponent (ReactReconciler.js:45)
at ReactCompositeComponentWrapper.performInitialMount (ReactCompositeComponent.js:370)
Run Code Online (Sandbox Code Playgroud) 我怎样才能并排制作 3 个 div。其中 div1 将在最左侧,div3 将在最右侧,而 div2 在中间。
我知道这可以通过 display:flex 和 justify-content:space-between 来完成,但我正在寻找一种没有 flex 的方法。
这是我的方法,但无法成功实现。
我试图让所有 div 的 display:inline-block 和 float:left 和 float:right 到两个极端的 div 和中间一个我尝试了 margin:auto,但看起来它不尊重它
请帮忙
.container {
border: 1px solid;
}
.container div {
height: 50px;
width: 50px;
background: red;
display: inline-block;
}
#div1 {
float: left;
}
#div3 {
float: right;
}
#div2 {
margin: auto;
}Run Code Online (Sandbox Code Playgroud)
<div class="container">
<div id="div1"></div>
<div id="div2">he</div>
<div id="div3"></div>
</div>Run Code Online (Sandbox Code Playgroud)
我正在尝试实现此代码段的继承
function parent(name) {
this.name = name;
}
function child(childname) {
parent.call(this, "cde");
this.childname = childname;
}
var p1 = new parent("abc");
child.prototype = Object.create(parent.prototype);
var p2 = new child("def");
console.log(p1.name);
console.log(p2.name);Run Code Online (Sandbox Code Playgroud)
使用OLOO模式OLOO模式
这是我的尝试
function person(name) {
this.name = name;
}
var p1 = new person("abc");
var p2;
p2 = Object.create(person);
console.log(p2.name);
p2.childname = "def";Run Code Online (Sandbox Code Playgroud)
虽然在这里创建p2对象我不发送名称.如何在创建p2对象时向其发送名称.
有人请说明这是使用OLOO模式实现继承的正确方法
谢谢
就我而言,我的HTML和javascript:
$('.addRow').on('click', function() {
addRow();
});
function addRow() {
var tr = '<tr>' +
'<td></td>' +
'</tr>';
$('tbody').append(tr);
};Run Code Online (Sandbox Code Playgroud)
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table id="example1" class="table table-bordered">
<thead>
<th>No.</th>
<th style="text-align:center"><a href='#' class="addRow"><i class="glyphicon glyphicon-plus"></i></a></th>
</thead>
</table>Run Code Online (Sandbox Code Playgroud)
我想这样做
1.
2.
3.
............
If总是给我最后的结果
检查这个片段
function calc(on, ep, am, ek, b1, b2, b3, b4) {
var sum, mo;
b1 = parseInt(b1);
b2 = parseInt(b2);
b3 = parseInt(b3);
b4 = parseInt(b4);
sum = b1 + b2 + b3 + b4;
mo = sum / 4;
if (mo < 5) {
x = "Not Good";
}
if (mo < 6, 5 && mo > 4, 99) {
x = "Good";
}
if (mo < 8, 5 && mo > 6, 49) {
x = "Really …Run Code Online (Sandbox Code Playgroud)css ×3
javascript ×3
html ×2
css-float ×1
css3 ×1
html5 ×1
inheritance ×1
jquery ×1
react-router ×1
reactjs ×1