html如何跟css链接

html-css017

html如何跟css链接,第1张

1、当我们没有引入外部css样式表的时候,一般情况下我们会在html里写样式,而又两种方式使我们常见的,第一种:

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title>time元素</title>

</head>

<body>

<div style="height:300pxwidth:500pxbackground:#999"></div>

</body>

2、第二种写法:

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />

<title>time元素</title>

<style>

.all{

height:300px

width:500px

background:#999}

</style>

</head>

<body>

3、建立一个css样式表文件

4、存储在css文件夹中

5、在html文件中写入链接代码,代码如下:

<link rel="stylesheet" type="text/css" href="css/index.css" />

6、之后可以看到HTML文件的源代码傍边看到我们所连接的css文件,此时就连接成功。

可以通过三种方式引入CSS代码\x0d\x0a外部样式:将网页链接到外部样式表。\x0d\x0a内页样式:在网页上创建嵌入的样式表。\x0d\x0a行内样式:应用内嵌样式到各个网页元素。\x0d\x0a\x0d\x0a链接就是其中的一种\x0d\x0a\x0d\x0a在 head 结束标签上面写链接CSS代码. \x0d\x0a

1、首先打开Dreamweaver CC2018软件新建一个html文件,在右上角点击CSS设计器,并在下方点击加号,然后选择创建新的CSS文件:

2、在创建窗口中,点击浏览按钮。

3、然后选择站点创建好CSS文件夹,然后输入创建的CSS的名字,点击保存插件文件:

4、然后把添加为设置成链接,点击确定按钮:

5、添加完成后就可以在右侧的站点中的CSS文件夹下看到刚创建好的CSS样式表文件了:

6、此时在html文件中的head标签中,就多了一行链接到CSS文件的代码。在顶部tab标签中也可以看到链接的样式表:

7、接下来在html网页编辑页面,在body标签中输入一个div:

8、然后在顶部tab标签中选择刚才创建的CSS样式表,并在样式表中写一个样式,命名为aaa,并按下快捷键Ctrl+S保存样式表:

9、最后回到html编辑页面,在div标签中引入class,输入刚才写的样式的名称aaa并保存网页:

10、最后点击顶部的设计按钮,就可以看到实时效果了,此时css文件就成功链接进去了: