BLOG

🐳Coding apple HTML/CSS All-in-one : 기초부터 Bootstrap, SASS, 고급 animation 까지 강의를 보고 정리한 글입니다 🐳

💫 간단한 스타일 넣는 법

<p style="font-size : 20px; color : red"> 글자 </p>

거의 모든 태그는 style="" 이라는 속성을 열 수 있다.

💫 자주 사용하는 글자 스타일들

font-size : 20px;
font-family : 'gulim';
color : black;
letter-spacing : -1px;
text-align : center;
font-weight : 600;

💫 이미지 정렬과 폭 조정

display : block;
margin-left : auto;
margin-right : auto;
width : 150px;

이미지 가운데 정렬 : display : block; margin-left : auto, margin-right : auto

💫 텍스트의 일부만 스타일을 변경하고 싶을 때

<p>안녕하세요 저는 <span style="color : red;">뛰어난</span> 개발자입니다.</p>

`<span>` 태그

가끔 글자 일부를 싸매고 싶을 때 사용하는 큰 의미 없는 태그

`<strong>` 태그

글자 일부를 싸매면 간단히 굵게 표현 가능

💫 오늘의 숙제 : 간단한 자기소개 페이지 꾸미기

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>
        <img src="coomang.jpg" style="width: 200px; display:block; margin-left: auto; margin-right:auto;">
        <h3 style="font-size: 16px; color:#888; letter-spacing: 1px; text-align: center">Dozzing World</h3>
        <p style="text-align: center"><span style="color:blue;">Front-end</span> Developer</p>
        <h3 style="text-align: center">쿠키쿠망 블로그 입니다.</h3>
    </body>
</html>

👻Dozzing World👻

[HTML/CSS] 기본적인 웹페이지 스타일링

💫 간단한 스타일 넣는 법

💫 자주 사용하는 글자 스타일들

💫 이미지 정렬과 폭 조정

💫 텍스트의 일부만 스타일을 변경하고 싶을 때

`<span>` 태그

`<strong>` 태그

💫 오늘의 숙제 : 간단한 자기소개 페이지 꾸미기

By Dozzing

Related Post

답글 남기기 응답 취소

[HTML/CSS] 기본적인 웹페이지 스타일링

💫 간단한 스타일 넣는 법

💫 자주 사용하는 글자 스타일들

💫 이미지 정렬과 폭 조정

💫 텍스트의 일부만 스타일을 변경하고 싶을 때

<span> 태그

<strong> 태그

💫 오늘의 숙제 : 간단한 자기소개 페이지 꾸미기

By Dozzing

Related Post

test

[JavaScript] 자바스크립트 타이머

[JavaScript] 자바스크립트 정규표현식(regular expression)

답글 남기기 응답 취소

`<span>` 태그

`<strong>` 태그