您的位置：首页 > Web前端 > CSS

css

2015-09-13 23:05 561 查看

1. 编辑文字样式，在head的style里定义，body中直接调用即可

<html>

<head>

<style>

body {background-color:lightgrey}

h1 {color:blue}

p {color:green}

</style>

</head>

<body>

<h1>This is a heading</h1>

<p>This is a paragraph.</p>

</body>

</html>

2. Styling HTML with CSS 三种方式

Inline, Internal, External

3. Inline

<body>

<h1 style="color:blue">This is a Blue Heading</h1>

</body>

4. Internal

<head>

<style>

body {background-color:lightgrey}

h1 {color:blue}

p {color:green}

</style>

</head>

<body>

<h1>This is a heading</h1>

<p>This is a paragraph.</p>

</body>

5. External

<head>

<link rel="stylesheet" href="styles.css">

</head>

<body>

<h1>This is a heading</h1>

<p>This is a paragraph.</p>

</body>

6.
color, font-family, font-size

h1
{

color:blue;

font-family:verdana;

font-size:300%;

}

p {

color:red;

font-family:courier;

font-size:160%;

}

7.
box

border:1px
solid grey 框的粗细，填充程度和颜色

8.
box里的空间大小

border:1px
solid grey;

padding:10px;

9. box外的空间大小

border:1px
solid grey;

padding:10px;

margin:30px;

10.
id 定义一句话

<head>

<style>

p#p01 {

color: blue;

}

</style>

</head>

<body>

<p>This is a paragraph.</p>

<p id="p01">I am different.</p>

</body>

11.
class 定义多句话

<head>

<style>

p.error {

color:red;

}

</style>

</head>

<body>

<p>This is a paragraph.</p>

<p>This is a paragraph.</p>

<p class="error">I am different.</p>

<p>This is a paragraph.</p>

<p class="error">I am different too.</p>

</body>

12. Use id to
address single elements. Use class to address groups of
elements. (未理解)

13. Deprecated
Tags and Attributes in HTML5 （未理解）

In older HTML versions, several tags and attributes were used to style documents.
These tags and attributes are not supported in HTML5!
Avoid using the <font>, <center>, and <strike> elements.
Avoid using the color and bgcolor attributes.

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航