css基础

最新推荐文章于 2025-08-17 15:24:04 发布

原创最新推荐文章于 2025-08-17 15:24:04 发布 · 385 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#css #stylesheet #html #xhtml #浏览器 #存储

J2EE基础之html+css+javascript 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了CSS（层叠样式表）的基本概念及其作用，包括样式优先级、选择器类型（标记选择器、类别选择器和ID选择器）以及一个完整的HTML页面示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

CSS 指层叠样式表（Cascading Style Sheets），层叠的意思是：多重样式定义被层叠为一。
CSS 是标准的布局语言，用来控制元素的尺寸、颜色、排版。
CSS 非常精确，功能强大，易于编写。
CSS 由 W3C 发明，用来取代基于表格的布局、框架以及其他非标准的表现方法。
样式 (style) 定义如何显示 HTML 元素；样式通常存储于样式表中；外部样式表存储于 CSS 文件中。
外部样式表 (External Style Sheet) 可以极大地提升你的工作效率，并且极大地节约服务器的带宽。
纯 CSS 的布局与 XHTML 的结合，可使表现与结构分离，并使站点更易维护，易用性更好。

一般而言，所有的样式会根据下面的规则层叠于一个新的虚拟样式表中，其中数字 4 拥有最高的优先权。

1浏览器缺省设置
2外部样式表 (将这样的语句<link href="1.css" type="text/css" rel="stylesheet">放在head中)
3内部样式表（位于 <head> 标签内部）
4内联样式（在 HTML 元素内部如<h2><font color="#0033CC">标记文字</font></h2>）
因此，内联样式（在 HTML 元素内部）拥有最高的优先权，这意味着它将优先于以下的样式声明：<head> 标签中的样式声明，外部样式表中的样式声明，或者浏览器中的样式声明（缺省值）。

css当中最终要的概念就是选择器，选择器主要有以下三种：

1,标记选择器：

p{   /* 标记名称 */
color:purple;    /* 属性及值 */
font-size:14px;    /* 属性及值 */
}

2，类别选择器：可用在不同的标记当中

比如在正文当中有这样依据html代码

<p class="special">类别选择器</p>

.special{ /*. 类别选择器名称 */
text-decoration:underline; /* 下划线 */
}

3，id选择器：一般只能对一个特定的元素进行应用

在正文当中有如下代码

<p id="one">选择器集体声明p3</p>

那么可以使用css控制方式是：

#one{ /* id选择器 */
text-decoration:underline; /* 下划线 */
}

那么给出一个用css控制的完整页面。

<html>
<head>
<title>按钮超链接</title>
<style>

</style>
</head>
<body>
<a href="#">首页</a>
<a href="#">一起走到</a>
<a href="#">从明天起</a>
<a href="#">纸飞机</a>
<a href="#">下一站</a>
<a href="#">门</a>
<a href="#">其它</a>
</body>
</html>