css(baek)

2021-10-08 오후 html,css list~ 가로세로 병합

Hesitater 2021. 10. 8. 16:49
728x90

Unordered HTML list:         An ordered HTML list:

 

 

 

 

<ul> Defines an unordered list
<ol> Defines an ordered list
<li> Defines a list item
<dl> Defines a description list
<dt> Defines a term in a description list
<dd> Describes the term in a description list

<ul> 순서가 없는 목록을 정의합니다.
<ol> 순서 목록을 정의합니다.
<li> 목록 항목을 정의합니다.
<dl> 설명 목록을 정의합니다.
<dt> 설명 목록에서 용어를 정의합니다.
<dd> 설명 목록에서 용어를 설명합니다.

 

 

 

 

 

window+.  하면 이모티콘

 

구글에서css style list type 검색

 

list-style-type - CSS: Cascading Style Sheets | MDN (mozilla.org)

 

list-style-type - CSS: Cascading Style Sheets | MDN

The list-style-type CSS property sets the marker (such as a disc, character, or custom counter style) of a list item element.

developer.mozilla.org

 

●34html-list-ordered.html

 

<!-- ol>li*5>lorem1 -->

 

 

○결과값

 

6~10

○결과값

 

 

 

●35html-list-unordered.html

 

 

○결과값

 

 

 

HTML Tables

 

●36html-table.html

 

○결과값

●37html-table-bootstrap.html

부트스트랩에 있는거 링크 copy해서 사용해보기

 

 

○결과값

 

 

 

 

●38html-table-span.html

 

 

○결과값

값이 밀리니 td값을 없애줘야한다.

 

 

 

 

 

 

●39html-table-span.html

 

rowspan 하면 

 

 

 

○결과값1

아래 그림에서 값이 밀린다 그래서 표를 맞춰 주려면 값을 삭제 해야한다. 그래서

td값을 잘 조절해야함

수정된후 한것들

 

 

○총 결과값

작성할때 잘못 삭제할수 도 있으니깐 주의요망

 

 

 

 

●40html-table-span.html

 

가로세로 병합

        <tr>
            <td rowspan="2" colspan="2" class="span">Lorem.</td>
            <!-- <td>Velit.</td> -->
            <td>Explicabo?</td>
            <td>Earum!</td>
            <td>Officia!</td>
        </tr>
        <tr>
            <!-- <td>Lorem.</td> -->
            <!-- <td>Sed?</td> -->
            <td>Numquam!</td>
            <td>Id!</td>
            <td>Consequatur.</td>
        </tr>

 

 

 

○결과값

 

다음주부터 위치선정? 에 대해 배울뜻 

많이 어렵다고하니 그전꺼 복습...?