扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
css选择一个元素下的2中同级元素,我们首先还是需要获取到这个元素,可以通过给这个元素一个id或者是class来做,选择同级子元素,一般设置的都是相同的css样式,所以,在同级子元素的选取中css是通过一个','来隔开元素名,然后其他的还是一样的书写css样式,请看代码:
网站建设哪家好,找创新互联!专注于网页设计、网站建设、微信开发、小程序制作、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了涟水免费建站欢迎大家使用!
html
head
style
#div1{
width:600px;
height:40px;
font-size:13px;
}
#div1 p,span{ //通过一个‘,’实现对2个同级子元素的选取
display:block;
width:300px;
height:30px;
text-align:center;
margin:0 auto;
}
/head
body
div id='div1'
p我是测试文字/p
span我是测试文字1/span
/div
/body
/html
jquery中css() 方法可以设置或返回被选元素的一个或多个样式属性,下面的例子将返回首个匹配元素的 background-color 值:
$("p").css("background-color");
父级的同级元素的子标签的css样式如下:
//eq(0)表示选择匹配到多个元素中的第一个
$("target").parent().siblings().eq(0).children().eq(0)
你可以让span相对于div来定位啊,这样就不用管input的长度和位置了。当然,input也要通过设置text-indent来给span腾出位置。下面是个简单的实现例子(为了方便,我用了内联的css,你可以改成外联的):
div style="position:relative"input type="text" id="xj_zhanghao" class="xj_text" maxlength="16" style="text-indent:20px" placeholder="账号" onKeyUp="xjzhltishi()" onFocus="qcxjtishi()"/span id="xjzhtishi" style="position:absolute; left:3px; top:3px; width:14px; padding:1px; line-height:1; text-align:center; background-color:red; color:white; font-size:11px; border-radius:2px"99/span/div
b这一类的元素都是a的同级元素并且是a元素之后的就可以a:hover~b{....}
完美解决 ,经测试!
附上我自己的代码:
ul li a img:hover ~h3 {
padding-bottom: 10px;
color: #25AAFF!important;
border-bottom: 2px solid #25AAFF;
}
一般常用的两种是ng-style跟ng-class
1、ng-style
ng-style 指令为 HTML 元素添加 style 属性。
ng-style 属性值必须是对象,表达式返回的也是对象。
对象由 CSS 属性和值组成,即 key=value 对。
例如:
body ng-app="myApp" ng-controller="myCtrl"
h1 ng-style="myObj"菜鸟教程/h1
script
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.myObj = {
"color" : "white",
"background-color" : "coral",
"font-size" : "60px",
"padding" : "50px"
}
});
/script
/body
2、ng-class
ng-class 指令用于给 HTML 元素动态绑定一个或多个 CSS 类。
ng-class 指令的值可以是字符串,对象,或一个数组。
如果是字符串,多个类名使用空格分隔。
如果是对象,需要使用 key-value 对,key 为你想要添加的类名,value 是一个布尔值。只有在 value 为 true 时类才会被添加。
如果是数组,可以由字符串或对象组合组成,数组的元素可以是字符串或对象。
例如:
select ng-model="home"
option value="sky"Sky/option
option value="tomato"Tomato/option
/select
div ng-class="home"
h1Welcome Home!/h1
pI like it!/p
/div
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流