前言最近在项目中用到 :first-child 很容易的就想到了,嗯嗯。这不就是选择第一个元素吗?好像很好用,平时使用中也没有遇到什么问题,理所当然的就以为它只会选中父元素下的第一个元素,对孙元素和曾孙元素没有影响。事实证明,我的理所当然是错的。E:first-child的第一个误区(只会选中我规定的区域中的一个,不会遍历其下有多少个孙或曾孙元素)body p:first-child
{
back            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-03-19 14:26:36
                            
                                295阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            (1). 父对子:①. 指父元素触发hover事件,并且控制父元素中的子元素做出响应
<div class="d1">
  <p class="p1">hello</p>
</div>
.d1:hover .p1{
  color:#fff
}(2). 子对父:①. 指子元素触发hover事件时,其父元素做出相关相应
<div class            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-10-10 11:22:11
                            
                                772阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            (1). 父对子:①. 指父元素触发hover事件,并且控制父元素中的子元素做出响应
<div class="d1">
  <p class="p1">hello</p>
</div>
.d1:hover .p1{
  color:#fff
}(2). 子对父:①. 指子元素触发hover事件时,其父元素做出相关相应
<div class            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-09-20 20:55:34
                            
                                1213阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            ~[data-has-dropdowns]:hover ~ .data_site_mark {    height: 100vh;  }+ 只能控制兄弟元素 最接近目标            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-02-14 09:15:47
                            
                                1187阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            在css中,元素不能往前选择,即不能选择父元素或前兄弟元素;这都受制于DOM渲染规则;这其实也好理解,html是从外层往里层的渲染机制;如果可以往上渲染就会出现渲染紊乱与性能等之类的问题;改变DOM与视界的位置,从而达到改变展示效果兄弟选择符只能选择后面的元素,但所表达的“后面”是指代码层面的后面,我们可以通过改变视界的效果来实现”前兄弟选择符“的效果;即把元素放到后面,通过更改样式或文档流让视界            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-10-19 10:51:50
                            
                                55阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            一、元素定位定位属性position定位方式,取值为static(默认值,标准文档流)、relative(相对定位)、absolute(绝对定位)、fixed(固定定位)偏移属性,与包含块之间的偏移top、bottom、left、right,取值为正向里移,负值外移z-index元素的堆叠属性,值大的覆盖值小的,默认值0  包含块:是指离该元素最近的按relative、absolute、fixed            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-12-31 14:09:26
                            
                                334阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            若实现效果如下,css伪类可以把握的死死的↓↓↓ 举个栗子:<div class="contents">
    <div>1</div>
    <div>2</div>
    <div>3</div>
</div>
<style>
.contents{
  display: flex;            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-06-23 23:00:47
                            
                                46阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            层可以随着页面滚动而滚动,说明肯定是脱离了标准流的,CSS样式表 position:absolute;因为是上下移动,所以   就是要改变层的CSS样式中的top属性定位),在jquery中有一个scrollTop属性,用于获取页面滚动的高度。所以在每次页面滚动   的时候,将浮动层的高度设置为 (初始值)+ scrollTop即可。  但是scrollTop在ie和其            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2023-12-28 14:45:14
                            
                                102阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            div class="detail_list_icons">  div class="detail_list_icon">      img class="detail_list_iman">            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-12-30 11:33:49
                            
                                1179阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            一、概述一个元素最终只有一个css属性对其生效,除了多处指定属性这种情况,还有一种就是元素会继承祖元素的属性,这是一个不简单,也不复杂的问题。二、继承一个元素如果本身没有被指定css属性,那么它就会继承父元素的属性,继承是链式的,元素会向上查找,直到遇到指定样式的祖元素,并且继承它的属性:<style>
    body{
      font-family: cursive;            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-03-17 17:11:40
                            
                                1504阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            兄弟选择器<!DOCTYPE html>
<html>
    <head>
    <meta charset="utf-8" />
    <title>兄弟选择符 (E~F)</title>
    <style>
    p~p{color:#f00;}
    </style>
    <            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-05-19 20:39:35
                            
                                439阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            若实现效果如下,css伪类可以把握的死死的↓↓↓ 举个栗子:方法一::not(selector) 选择器匹配非指定元素/选择器的每个元素。:first-child 选择器用于选取属于其父元素的首个子元素的指定选择器。方法二:使用nth-of-type()或者nth-child()。(n是从0开始的,那么n+2自然就是从第2个元素开始了,同理如果选中单数元素那么就是2n+1,如果是想选中双数元素,那            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-01-04 21:46:42
                            
                                67阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            # 如何使用jQuery修改父级元素的CSS样式
## 引言
在开发过程中,经常会遇到需要修改父级元素的CSS样式的情况。使用jQuery可以轻松实现这个功能。本文将介绍如何使用jQuery来修改父级元素的CSS样式,并提供详细的步骤和代码示例。
## 流程图
```mermaid
flowchart TD
    subgraph 开始
        开始 --> 检查元素
    end            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-12-24 03:47:42
                            
                                153阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            # 实现“jQuery css根据子元素找到父元素”
## 简介
在开发中,有时候我们需要通过子元素来找到它的父元素,然后对父元素进行一些操作,比如修改父元素的样式。在jQuery中,我们可以通过一些方法来实现这个功能。本文将向你介绍如何使用jQuery来根据子元素找到父元素,并展示每个步骤需要做什么。
## 步骤
下面是实现“jQuery css根据子元素找到父元素”的步骤概述:
|            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-10-28 09:51:49
                            
                                547阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            width: 100%; height: 100%; display: block; width: 100%; height: 100%; display: block;            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-04-19 15:59:14
                            
                                1549阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            # 如何使用jQuery更改父级元素的CSS样式
## 整体流程
为了帮助新手更好地理解如何使用jQuery更改父级元素的CSS样式,我们需要将整个过程拆解成几个步骤,并结合代码进行详细说明。以下是整体流程表格:
| 步骤 | 描述 |
| --- | --- |
| 1 | 选定需要修改CSS的子元素 |
| 2 | 找到该子元素的父级元素 |
| 3 | 使用jQuery选择器选中父元素            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2024-06-20 04:43:45
                            
                                68阅读