一个最基本的CSS文件处理

原创 2016年06月01日 08:27:46

敲入如下代码

#layout {
font-family: Arial, Helvetica, sans-serif;
font-size: medium;
font-style: italic;
font-weight: bold;
height: 300px;
width: 400px;
background-color: #66CCFF;
}

这段代码是通过DW生成的。打开DW,新建html网页,建立CSS样式。保存。


DW生成的代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<link href="css.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="layout">此处显示  id "layout" 的内容</div>
</body>
</html>


下面我打开记事本,写入如下代码,并生成html文件:(这里不再像上面的文件那样,指定css文件路径,而是将样式文件写在代码中。)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 


"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type = "text/css">
#layout1{font-family: Arial, Helvetica, sans-serif;
font-size: medium;
font-style: italic;
font-weight: bold;
height: 600px;
width: 300px;
margin:auto;
background-color: #66CCFF;}
</style>
</head>
<body>
<div id="layout1">此处显示  id "layout" 的内容</div>
</body>
</html>

下面我再调整一下html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 


"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type = "text/css">
#layout1{font-family: Arial, Helvetica, sans-serif;
font-size: medium;
font-style: italic;
font-weight: bold;
height: 300px;
width: 300px;
margin:auto;
background-color: #66CCFF;}


#layout2{font-family: Arial, Helvetica, sans-serif;
font-size: medium;
font-style: italic;
font-weight: bold;
height: 300px;
width: 300px;
background-color: #66CCFF;}
</style>
</head>


<body>
<div id="layout1">此处显示  id "layout1" 的内容</div>
<div id="layout2">此处显示  id "layout2" 的内容</div>
</body>
</html>


相关文章推荐

写一个Sublime Text 2插件(CSS文件里px单位替换成rem单位)

写这个文章就是想大家知道sublime text 插件开发还是很简单的,学会如何从设置文件里获取设置。...

多个css文件合并到一个css中

问题: 在HTML中引入css的其中的两个方法:   导入式和链接式的目的都是将一个独立的css文件引入一个文件中,二者的区别不大,事实上,二者最大的区别在于链接式使用html的标记引入外部css文件...

org css文件

  • 2012年08月02日 00:06
  • 37KB
  • 下载

最基本的HTML表格格式,border,再加一点简单的css

对于很多初学HTML的人来说,表格是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解。 一般我们用表格的时候总会给它个border属性,比如:, 其效果如下: 可以发现...

Js Css文件压缩工具源码

  • 2012年05月08日 08:54
  • 300KB
  • 下载

ngTable js和css文件

  • 2016年12月23日 08:03
  • 20KB
  • 下载

ASP.NET在主题中添加CSS文件

ASP.NET在主题中添加CSS文件 在ASP.NET中,可以使用CSS来控制页面上HTML元素和ASP.NET控件的皮肤。如果在主题文件夹中添加了CSS文件,则在页面应用主题时也会自动应用CS...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:一个最基本的CSS文件处理
举报原因:
原因补充:

(最多只允许输入30个字)