网站首页 > 基础教程正文

CSS 基本语法 css基本语法是什么

ccvgpt 2024-10-12 14:22:42 基础教程 9 ℃

CSS样式表是不区分大小写, 建议全部小写

注释: /* 注释内容 */

CSS 基本语法 css基本语法是什么

单位问题：CSS 建议都写上单位

如何将样式表加入您的网页：

内联定义即是在对象的标记内使用对象的style属性定义适用其的样式表属性。

示例代码：

<p style="color:#f00">这一行的字体颜色将显示为红色</p>

内部样式块对象 Embedding a Style Block

你可以在你的HTML文档的<head>标记里插入一个<style>块对象。

示例代码：

<style type="text/css">
body{background:#fff;color:#000;}
p{font-size:14px;}
</style>

外部样式表 Linking to a Style Sheet

你可以先建立外部样式表文件*.css，然后使用HTML的link对象。

示例代码：

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

rel="stylesheet" 是指在HTML文件中使用的是外部样式表;

type="text/css" 指明该文件的类型是样式表文件;

使用@import命令导入外部CSS文件(兼容性差,有些浏览器不支持)

<style type="text/css">
@import url("*.css");
</style>

使用解决兼容性

对于不支持CSS样式的浏览器, 将会把编写的CSS代码当成普通的字符串显示在网页中。

<style type="text/css">
<!--
h4{ /* 标记选择器 */
color:red;
font-size:18px;
}
-->
</style>
<style type="text/css">
div{width:200px;}
img{float:right}
</style>

花括号(})前的分号可以省略,推荐还是加上

防止外部样式乱码

@charset "utf-8"

CSS样式涉及到图片的路径格式:

background-image: url('/i/eg_bg_03.gif')
list-style-image:url("/i/arrow.gif");

W3C提供的CSS语法检测网页的网址如下：

http://jigsaw.w3.org/css-validator/

同义词：

内联元素：行内元素

CSS样式遵循的原则：

先设置全局的; 从大往小写

常用的全局样式：

实例1：

body,ul,li,a,img{margin:0px;padding:0px;}
ul li{list-style:none;}
img{border:none;} /* 解决不同浏览器下图片有无边框问题 */
a:link,a:visited{text-decoration:none;color:#444;}
a:hover{color:#f00;}
.floatL{float:left;}
.floatR{float:right;}
.clear{clear:both;}

实例2：

/*重置css*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td {
margin: 0;
padding: 0;
}
body {
background: #fff;
color: #444866;
font-size: 12px;
font-family: "Arial", "Microsoft YaHei", "黑体", "宋体", sans-serif;
}
h1, h2, h3, h4, h5, h6 {
font-weight: normal;
font-size: 100%;
}
a {/*去掉默认的下划线*/
color: #444866;
text-decoration: none;
}
img {/*去掉图片的间隙*/
border: none;
vertical-align: middle;
}
ol, ul, li {/*去掉默认的小圆点*/
list-style: none;
}
table {/*表格样式美化*/
border-collapse: collapse;
}
body{font-size:12px; color:#444; background-color:#f1f1f1;}
.weight{font-weight:bold;}

常用中文字体 Unicode 编码

字体名称英文名称 Unicode 编码

宋体 SimSun \5B8B\4F53

新宋体 NSimSun \65B0\5B8B\4F53

黑体 SimHei \9ED1\4F53

微软雅黑 Microsoft YaHei \5FAE\8F6F\96C5\9ED1

楷体_GB2312 KaiTi_GB2312 \6977\4F53_GB2312

隶书 LiSu \96B6\4E66

幼园 YouYuan \5E7C\5706

华文细黑 STXihei \534E\6587\7EC6\9ED1

细明体 MingLiU \7EC6\660E\4F53

新细明体 PMingLiU \65B0\7EC6\660E\4F53

任意字体转Unicode编码

事实上任何字体都能够转换为Unicode编码

上一篇： css概念以及语法规则 css的语法构成
下一篇： CSS语法规范 css基本语法格式

网站首页 > 基础教程 正文

CSS 基本语法 css基本语法是什么

猜你喜欢

网站首页 > 基础教程正文