Learn web development css初步

来源:互联网 发布:调用接口获取json数据 编辑:程序博客网 时间:2024/04/24 18:03

CSS 表示Cascading Style Sheets

CSS Basics takes you through what you need to get started.

Lke HTML, CSS is not really a programming language, it is not a markup language either - it is a style sheet language.that is, it lets you apply styles selectively to elments in HTML documents.

select all the paragraph elements on an HTML on page and turn the text within them red, you'd write this CSS.

p {    color: red;}

Selector
The HTML element name at the start of the rule set. It selects the element(s) to be styled (in this case,p elements). To style a different element, just change the selector.
Declaration
A single rule like color: red; specifying which of the element'sproperties you want to style.
Properties
Ways in which you can style a given HTML element. (In this case, color is a property of thep elements.) In CSS, you choose which properties you want to affect in your rule.
Property value
To the right of the property, after the colon, we have the property value, to choose one out of many possible appearances for a given property (there are manycolor values besides red).
p {  color: red;  width: 500px;  border: 1px solid black;}

选择多个元素

p,li,h1 {  color: red;}

它提供的css文件格式

html {  font-size: 10px;  font-family: 'Open Sans', sans-serif;}h1 {  font-size: 60px;  text-align: center;}p, li {  font-size: 16px;    line-height: 2;  letter-spacing: 1px;}html {  background-color: #00539F;}body {  width: 600px;  margin: 0 auto;  background-color: #FF9500;  padding: 0 20px 20px 20px;  border: 5px solid black;}h1 {  margin: 0;  padding: 20px 0;    color: #00539F;  text-shadow: 3px 3px 1px black;}img {  display: block;  margin: 0 auto;}

最终的显示效果。


0 0