번호없는(unordered) 정보 : Basic List

번호가 없는 리스트 형태로 기본 타입과 블릿을 추가하는 타입으로 전환 및 커스트마이징 가능합니다.

기본 리스트 (class="section-ul")

알서포트 소식

  • 알서포트는 알집을 만드는 회사가 아닙니다.
  • 알서포트는 알약을 만드는 회사가 아닙니다.
  • 알서포트는 알송을 만드는 회사가 아닙니다.
  • 알서포트는 알씨을 만드는 회사가 아닙니다.
  • 알서포트는 알뷰를 만드는 회사가 아닙니다.
더보기

아이콘 리스트 (class="section-ul icon")

알서포트 소식

  • 알서포트는 알집을 만드는 회사가 아닙니다.
  • 알서포트는 알약을 만드는 회사가 아닙니다.
  • 알서포트는 알송을 만드는 회사가 아닙니다.
  • 알서포트는 알씨을 만드는 회사가 아닙니다.
  • 알서포트는 알뷰를 만드는 회사가 아닙니다.
더보기

<ul>와 <li> 엘레멘트에서 공히 애트리뷰트로는 type이 있고 가능 한 값은 아래와 같습니다.
물론 <ul>에 type이 지정되는 경우 그 하위 <li>에는 모두 같은 type이 적용됩니다.
<li type=disc> 값이 "disc" 일 때: 꽉 찬 원으로
<li type=circle> 값이 "circle" 일 때: 원의 테두리로
<li type=square> 값이 "square" 일 때: 네모 꼴의 테두리로

HTML
		

			
알서포트 소식

			
    
			  
  • 알서포트는 알집을 만드는 회사가 아닙니다.
    • 
			  
  • 알서포트는 알약을 만드는 회사가 아닙니다.
    • 
			  
  • 알서포트는 알송을 만드는 회사가 아닙니다.
    • 
			  
  • 알서포트는 알씨을 만드는 회사가 아닙니다.
    • 
			  
  • 알서포트는 알뷰를 만드는 회사가 아닙니다.
    • 
			

			더보기
		

		
		

			
알서포트 소식

			
    
			  
  • 알서포트는 알집을 만드는 회사가 아닙니다.
    • 
			  
  • 알서포트는 알약을 만드는 회사가 아닙니다.
    • 
			  
  • 알서포트는 알송을 만드는 회사가 아닙니다.
    • 
			  
  • 알서포트는 알씨을 만드는 회사가 아닙니다.
    • 
			  
  • 알서포트는 알뷰를 만드는 회사가 아닙니다.
    • 
			

			더보기
CSS
	/* default list */
	.section-ul { 
		position: relative; border: 1px solid #ddd; background: #fff; font-size: 12px; 
		font-family: Tahoma, Geneva, sans-serif; line-height: normal; *zoom:1; 
	}
	.section-ul .more {
	  position: absolute; top: 10px; right: 8px; width: 40px; height: 14px; display: block; 
	  overflow: hidden; padding: 0; font-size: 12px; line-height: 12px; text-decoration: none;
	}
	.section-ul h2 { margin: 0; padding: 10px 0 8px 13px; border-bottom: 1px solid #ddd; font-size: 12px; color: #333; }
	.section-ul ul { margin: 13px 20px; padding: 0; }
	.section-ul li { position: relative; margin: 0 0 10px 0; }
	.section-ul li:after { display: block; clear: both; content: ""; }
	.section-ul li .bu { float: left; margin: 0 4px 0 0; color:#999; display: none; }
	
	/* icon list */
	.section-ul.icon ul { margin-left: 5px; padding: 0; list-style: none; }
	.section-ul.icon li { position: relative; margin: 5px; line-height: 20px; vertical-align: middle; }
	.section-ul.icon li .bu { 
	  display: inline-block; padding-left: 17px; margin-right: 10px; color: #3e3c3d; font-size: 12px; font-weight: bold; 
	  text-decoration: none; height: 16px; background: url('https://rsupport.com/static/img/common/icons.gif') no-repeat 0 5px;
	}
History