教你用css3实现图片容器内等比缩放,教你用c3实现图片容器内等比缩放......
2023-03-16 296 CSS
设置css样式的多种方法
来源：互联网
2023-03-16 19:17:35 156
网页页面效果是同过样式设置出来的，那你知道设置样式的方法有哪些吗？css插入样式表的方法有三种:
1.外部样式表；
2.内部样式表；
3.内联样式。
内联样式
新建html页面。
打开Dreamweaver 软件，点击菜单栏的“文件”——“新建”，在弹出的新建文档页面选择页面类型为html，文档类型为html5。如图：
在页面输入一个div标签并在标签里设置样式。
如图：
保存html页面。
点击菜单栏“文件”下的“保存”或者按快捷键Ctrl s。如图：
使用浏览器打开html页面。
点击“浏览器”图标选择打开的浏览器。如图：
所有代码：
!doctype html>
html>
head>
meta charset="utf-8">
title>css设置样式的方法/title>
/head>
body>
div style="background-color:#F63; width:800px; height:50px; margin:20px auto;">
直接把样式设置在标签里面
/div>
/body>
/html>
css内部样式设置
新建html页面。如图：
新建并引用样式。
在页面上输入一个div标签，在title标签后面新建一个style标签，在这个标签里面创建一个class类，并设置一些样式然后在div中引用新建的样式。如图：
浏览器查看效果。
点击浏览器图标，选择打开的浏览器。如图：
所有代码：
!doctype html>
html>
head>
meta charset="utf-8">
title>css设置样式的方法/title>
style type="text/css">
.yang{background-color:#6CC; width:800px; height:50px; margin:20px auto;}
/style>
/head>
body>
div class="yang">
内部样式的设置
/div>
/body>
/html>
css外部样式表
新建html页面，并在页面输入div标签。
新建css文件。
点击“文件”菜单下的新建，页面类型选择css类型，然后点击“创建”。
在css文件里设置class样式，然后点击“文件”下的“保存”，把文件名设置为test。如图：
在html页面引用css文件。
在title标签后输入link rel="stylesheet" href="test.css" />，然后再div里引用class类（注：href=“文件路径”）。如图：
在浏览器上查看效果。
点击“浏览器”图标选择浏览器，即可看到效果。如图：
所有代码：
html页面代码：
!doctype html>
html>
head>
meta charset="utf-8">
title>css设置样式的方法/title>
link rel="stylesheet" href="test.css" />
/head>
body>
div class="ys">
内部样式的设置
/div>
/body>
/html>
css页面代码：
@charset "utf-8";
/* CSS Document */
.ys{background-color:#9FF; width:800px; height:50px; margin:20px auto;}
注意事项
- 如何还是不明白可以把步骤中的所有代码复制到新建的html页面上即可
以上方法由办公区教程网编辑摘抄自百度经验可供大家参考！
标签： CSS
上一篇：css设置内容超出后显示省略号 下一篇：如何自学网络编程
相关文章
- 详细阅读
-
怎么用div布局加css样式做网页详细阅读
怎么用div布局加css样式做网页,怎么做一个网页呢，静态页面的制作是很简单的，我们来看看怎么通过div布局 c样式来制作一个网页吧。......
2023-03-16 447 CSS
-
css基础教程：[1]为网页使用网络字体详细阅读
![css基础教程：[1]为网页使用网络字体](https://exp-picture.cdn.bcebos.com/cca2552c56ee7b7f34c65fc66ef4fcf5ef0d411f.jpg)
css基础教程：[1]为网页使用网络字体,本教程为大家介绍在网页上怎么使用网络字体。1，使用网络字体的好处是所有人看到的效果都是样的，效果统一，2，不依赖于用户电脑上是否安装了该字体。......
2023-03-16 293 CSS