간단 하고 알 기 쉬 운 CSS 전단 코드

6467 단어 HTML

30 초 안에 읽 을 수 있 는 실 용적 인 CSS 코드 세 션 모음
\#이야기 CSS
Clearfix 부동 삭제
요소 가 자체 적 으로 하위 요 소 를 제거 하도록 확보 합 니 다.
메모:이것 은 당신 이 여전히 float 를 사용 하여 구 조 를 구축 할 때 만 유용 합 니 다.유연 한 레이아웃 이나 격자 레이아웃 을 사용 하 는 현대적 인 방법 을 고려 해 보 세 요.
HTML

 
    <div class="clearfix">  
      <div class="floated">float adiv>  
      <div class="floated">float bdiv>  
      <div class="floated">float cdiv>  
    div>  
   CSS 
    
    .clearfix::after  
    {
 
    content  
    :  
    ""  
    ;
 
    display  
    : block  
    ;
 
    clear  
    : both  
    ;
 
    }
 
    .floated  
    {
 
    float  
    : left  
    ;
 
    } 
    
   
        
    
    
    
 
    
    
    
      float a 
     
    
      float b 
     
    
      float c 
     
     
     
 
     
    
    
    
 
    
   
        
    
   1. .clearfix::after           
   2. content: ''            
   3. clear: both        ，                            。 
   
 
         
   99+% 
    
   ✅      
   
 
   
 
   
      
            ，                   （         ）。 
   HTML 
    <div class="constant-width-to-height-ratio">div>  
   
 
   
     CSS 
    
    
     
     .constant-width-to-height-ratio  
     {
 
     background  
     : #333  
     ;
 
     width  
     : 50%  
     ;
 
     padding-top  
     : 50%  
     ;
 
     } 
     
    
   
        
    
   
                           。 
    
   
     (  ) 
    
    
    
 
    
   
        
    
   
     padding-top  
      padding-bottom  
        height  
       
       ，                        ， 50％            50％,          width 
      。           。 
    
    
     
     
 
     
    
            
     
     
     99+% 
     ⚠️ padding-top              。 
     
 
             
               
     HTML 
      
      <p class="custom-text-selection">Select some of this text.  
      p> 
      
     
 
     
     
     CSS 
     
     
      
      .custom-text-selection::selection  
      {
 
      background  
      : red  
      ;
 
      color  
      : white  
      ;
 
      } 
        
     
     
     Select some of this text.  
     
 
     
     
     
 
     
    
         
     
    
      ::selection  
                  ，                    
     
 
     
     
     
 
     
     
     
 
     
    
            
     
    84.6+% 
    
      ⚠️             ，           。 
     
     
      
      https://caniuse.com/#feat=css-selection

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

XSS 사용해보기

이 검증은 자신이 관리하는 가상 머신의 웹 서버에서 수행됩니다. 크로스 사이트 스크립팅 (이하 XSS)을 실제로 시도하고 철저히 이해하는 목적. 이 기사에서는 서버에서 수행하는 처리 내용과 XSS 방법에 대해 설명합...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다

간단 하고 알 기 쉬 운 CSS 전단 코드

1. .clearfix::after

2. content: ''

3. clear: both ， 。

99+%

✅

99+%

84.6+%

좋은 웹페이지 즐겨찾기

3. clear: both ，。