반응형

˙ 이미지의 가로, 세로 크기를 지정 

img{
	width : 100px;
	height : 200px;
}

 

˙ div 태그의 테두리를 지정 

div{
	border : 2px solid red;
}

 

˙ p태그의  글자크기와 글자색을 지정 

p{
	font-size : 1.5em;
	color : red;
}

 

˙ a링크 태그의 밑줄이 나타나지 않도록 설정 

a{
	text-decoration: none;
}

 

˙ 여러개의 div 옆으로 배치 

div{
	display : inline-block;
}

 

˙ id가 aa 인 요소의 글자 정렬을 가운데 로 지정 

#aa{
	text-align : center;
}

 

˙ pre 태그의 위쪽과, 아래쪽 테두리를 지정 

pre{
	border-top : 2px solid blue;	
	border-bottom : 2px solid red;
}

 

˙ span 태그를 검정색 배경에 하얀색 글자로 지정 

span{
	background : black;
	color : white;
}

 

˙ table의  안쪽 각 셀의 테두리를 합치기 

table{
	border-collapse : collapse;
}

 

˙ table의 각 셀간의 여백(공백)을 지정 

table{
	border-spacing : 10px;
}

 

˙ div의 안쪽여백과 줄간격을 지정 

div{
	padding : 10px;
	line-height : 1em;
}

 

˙ div와 div사이의 여백을 지정 

div{
	margin : 20px;
}

 

˙ button의 배경색과 둥근 테두리를 지정 

button{
	background : red;
	border : 3px solid gray; 
	border-radius : 55%;
}

 

˙ p태그의 글자를 굵게 지정 

p{
	font-weight : bold;
}

 

˙ 아이디가 tab1인 table 의  후손 td의 문자열를 가운데로 정렬 

#tab1 td{
	text-align : center;
}

 

˙ 클래스가 tta인 요소의 테두리의 폭은 10px  테두리의 색상은 green 으로 지정 

.tta {
	border : 10px solid green;
}

 

˙ div의 안쪽여백과 바깥쪽여백을 지정, 내용이 테두리 밖으로 벗어났을때 scrollbar가 생기도록 설정 

div{
	margin : 10%;
	padding : 10%;
	overflow : auto;
}

 

˙ p태그와 span태그를 동시에  글자크기 지정 

p,span{
	font-size : 2.0em;
}

 

˙ ul  리스트 스타일을 검정 사각형으로 변경 

ul{
	list-style-type : square;
}

 

˙ a 태그의 글자간격을 지정 

a{
	 letter-spacing : 10px;
}
반응형

+ Recent posts