博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
css基础选择器
阅读量:6346 次
发布时间:2019-06-22

本文共 973 字,大约阅读时间需要 3 分钟。

CSS 概述

  • CSS 指层叠样式表 (Cascading Style Sheets)
  • 样式定义如何显示 HTML 元素
  • 样式通常存储在样式表中
  • 把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题
  • 外部样式表可以极大提高工作效率
  • 外部样式表通常存储在 CSS 文件中
  • 多个样式定义可层叠为一

CSS 类选择器

类选择器允许以一种独立于文档元素的方式来指定样式。

该选择器可以单独使用,也可以与其他元素结合使用。

提示:只有适当地标记文档后,才能使用这些选择器,所以使用这两种选择器通常需要先做一些构想和计划。

要应用样式而不考虑具体设计的元素,最常用的方法就是使用类选择器。

 

CSS ID 选择器

在某些方面,ID 选择器类似于类选择器,不过也有一些重要差别。首先,ID 选择器前面有一个 # 号 - 也称为棋盘号或井号。

提示:ID属性不要以数字开头,数字开头的ID在 Mozilla/Firefox 浏览器中不起作用。

实例:

<head>

<style type="text/css">

        #样式名

                 { 

                 height:50px;

                 width:100%;

                  border:5px solid blue;/*四边框: 5像素宽,实线,蓝色*/

                  }|

                 </style>

                 <body>

                <div id="样式名"></div>

class 选择器

class 选择器用于描述一组元素的样式,class 选择器有别于id选择器,class可以在多个元素中使用。

class 选择器在HTML中以class属性表示, 在 CSS 中,类选择器以一个点"."号显示:

在以下的例子中,所有拥有 center 类的 HTML 元素均为居中。

提示:类名的第一个字符不能使用数字!它无法在 Mozilla 或 Firefox 中起作用。

实例:

<head>

<style type="text/css">

           .样式名

                { 

                 height:50px;

                 width:100%;

                  border:5px solid blue;/*四边框: 5像素宽,实线,蓝色*/

                  }|

                 </style>

                 <body>

                <div class="样式名"></div>

 

转载于:https://www.cnblogs.com/zixuan0028/p/6587053.html

你可能感兴趣的文章
Android开发Intent应用概述
查看>>
【Go】并发编程
查看>>
VMware虚拟化NSX-Manager命令行更改admin用户密码
查看>>
悦纳自己
查看>>
python字符串函数
查看>>
ORM框架Hibernate (四)MyEclipse Hibernate Tool 逆向生成实体类
查看>>
js中substr与substring的区别
查看>>
去掉iphone连接电脑时会出现的弹出窗口
查看>>
【python】-- web开发之HTML
查看>>
vs2015 去除 git 源代码 绑定
查看>>
解决firefox的button按钮文字不能垂直居中
查看>>
网络协议端口号详解
查看>>
大话数据结构读后感——第一章
查看>>
各种排序
查看>>
ts 格式化日期输出
查看>>
Optional
查看>>
sed 命令编辑文本
查看>>
LRUCache 具体解释
查看>>
Activity调用isDestroyed()方法报出,java.lang.NoSuchMethodError
查看>>
使用AFNetworking第三方下载类
查看>>