1. 程式人生 > >CSS中常用的屬性,彙總,練習出一套試卷,簡單版

CSS中常用的屬性,彙總,練習出一套試卷,簡單版

CSS常用屬性的介紹?



顏色屬性

可以通過取色器來取色值


例子:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>	
	<style type="text/css">
		*{background: black;}
		p{color:#FF0000}
		
	</style>
    </head>
	<body>
		<p>上課要好好學習,才能找到好工作</p>
	</body>
</html>

字型屬性

	<style type="text/css">
		*{background: black;}
		p{color:#FF0000;
		font-size: 21px;
		font-family:楷體;
		font-weight: bold; /*字型加粗*/
		}


背景屬性


	<style type="text/css">
		body{background-image: url(timg.jpg);
		background-repeat: repeat-x;
		background-position: center;}
	}
文字屬性

 

p{color:#FF0000;
		font-size: 21px;
		font-family:楷體;
		font-weight: bold; 
		line-height:300%;
		text-indent: 80px;
		letter-spacing: 10px;  
		}


邊框屬性

.d1{
			width: 500px;
			height: 400px;
			background: beige;
			border-style: dashed;
			border-color:red;
			border
		}
<div class="d1">
</div>

輸出:


虛線邊框

下面在來練習一個試題?

	.input{
			border: 0;
			border-bottom:#000 solid 1px;
			width: 200px;
		}
	題目一:html 叫做 <input type="text" class="input" /><br />
		題目二:css 叫做 <input type="text" class="input" /><br />
		題目二:java 叫做 <input type="text" class="input"  /><br />
		題目二:python 叫做 <input type="text" class="input"  /><br />
		題目二:js 叫做 <input type="text" class="input"  /><br />

輸出: