[2016-01-16][CSS][定义样式表(样式选择器)]

  • Class

定义:.classname{ 属性:属性值;}

使用:<p class = "classname"></p>

  • ID
    • 定义: #IDNUM{ 属性:属性值; }
    • 使用:<p id = "IDNUM"></p>
  • 组合选择器
    • 定义:标记1,标记2...标记n{属性:属性值;}
    • 使用:直接正常使用上面存在标记即可
  • 伪选择器

calss的使用

ID的使用

组合选择器h1

h2

h3

伪选择器


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

<html>

    <head>

        <title>[2016-01-16][CSS][定义样式表(样式选择器)]</title>

        <meta charset="utf-8">

        <style type="text/css">

        .class1{

            color:red;

        }

        /*<!--优先级:ID>Class>HTML-->

        

        <!--定义class-->

        <!--定义以.开始-->

        <!--花括号内,属性:属性值;(必须以分尾)-->号结

        <!--ID定义-->

        <!--ID定义以#开头-->*/

        

        #ID1{

            color:blue;

        }

        

       /* <!--组合选择器-->*/

        

        h1,h2,h3{

            color:green;

        }

        

        /*<!--伪元素选择器-->*/

       a:visited { color:red; }

         </style>

    </head>

    <body>

    

        <div class = "class1">

            calss的使用

        </div>

        <div id="ID1">

            ID的使用

        </div>

        <div>

            

            <h1>组合选择器h1</h1>

            <h2>h2</h2>

            <h3>h3</h3>

        </div>

        <div>

        <a href="http://www.baidu.com/">伪选择器 </a>

        </div>

    </body>

</html>

来自为知笔记(Wiz)

时间： 2024-08-02 15:09:46

[2016-01-16][CSS][定义样式表(样式选择器)]的相关文章

css样式表---样式表分类、选择器

一.样式表分三类: 1.内联样式表.——放在元素的开始标记中.——只对当前元素起作用.<input name="txt" style="border:0px; border-bottom:1px solid black;" type="text" /> 例: 结果: 2.内嵌样式表.——放在页面的<head></head>中间.——可以对整个页面. <head> <meta http-equi

HTML基础（五）——-css样式表——样式属性——格式与布局

一.position:fixed 锁定位置(相对于浏览器的位置),例如有些网站的右下角的弹出窗口. 示例: 二.position:absolute     绝对位置: 1.外层没有position:absolute(或relative):那么div相对于浏览器定位,如下图中b(距离浏览器右边框为50像素,距离下边框为20像素). 2.外层有position:absolute(或relative):那么div相对于外层边框定位,如下图中bb(距离d的右边框50像素,距离d的下边框为20像素). 示

css样式表的选择器与分类

css 样式表的作用: 主要用于结构,样式与行为,CSS主要的作用就是美化网页的一个语言,它的特点: 1.结构与样式分离的方式,便于后期维护与改版; 2.样式定义精确到像素的级别; css样式表的结构:CSS 称为层叠样式表 用于给网页设置各种样式 css样式的语法由3部分组成,选择器,属性和值. css的分类:主要分: 内联,内嵌,与外联. 内联: 写在标签里, 控制精准,代码重复性差,优先级最高. 内嵌: 嵌在页面head里面,控制没有内联的精准,代码重复性好. 外联: 单独的样式文件,引入

前端学习(9)~css学习(三)：样式表和选择器

本文主要内容 CSS概述 CSS和HTML结合的三种方式:行内样式表.内嵌样式表.外部样式表 CSS四种基本选择器:标签选择器.类选择器.ID选择器.通用选择器 CSS几种扩展选择器:后代选择器.交集选择器.并集选择器 CSS样式优先级 CSS 概述 CSS:Cascading Style Sheet,层叠样式表.CSS的作用就是给HTML页面标签添加各种样式,定义网页的显示效果.简单一句话:CSS将网页内容和显示样式进行分离,提高了显示功能. css的最新版本是css3,我们目前学习的是css

css样式表----------样式属性（背景与前景、边界和边框、列表与方块、格式与布局）

一.背景与前景 (1).背景 line-height: 1.5 !important;">90; /*背景色(以样式表为主,样式表优先.)*/ background-image:url(路径); /*设置背景图片(默认为平铺.)*/ background-repeat:no-repeat/repeat-x/repeat-y;no-repeat /*不平铺 repeat-x 橫向平铺 repeat-y 纵向平铺 */ background-position:center; /*背景图片居中

CSS基础整理（样式表 样式属性）

样式属性 1· 背景与前景 background-color:#00F; /*背景色,样式表优先级高*/ background-image:url(); /*设置背景图片(默认)*/ word-wrap:break-word; word-break:break-all; /*自动换行*/ background-attachment:fixed; /*背景是固定的,不随字体滚动*/ background-repeat:no-repeat; /*背景图 no-repeat不平铺:repeat平铺:r

0322css样式表，选择器

Css样式表 内联样式表:<p style="font-size:14px;">内联样式表</p> 内嵌样式表:必须写在head标签里面. <style type="text/css"> p   //格式对p标签起作用 { 样式: } </style> 外部样式表: 新建一个CSS文件,用来放置样式表.如果要在HTML文件中调用样式表,需要在HTML文件中点右键→CSS样式表→附加样式表.一般用link连接方式. 例如

HTML_css样式表 样式属性 格式布局

CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确,但是可重用性差,冗余较多. 例:<p style="font-size:14px;">内联样式表</p> 2.内嵌样式表 作为一个独立区域内嵌在网页里,必须写在head标签里面. <style type="text/css"> p  

样式表（选择器））（样式）

一.选择器(样式表用来选取元素的) .标签:根据标签名选取元素 .class(.点)(根据class名来选取元素) .id(#井号)(根据id名来筛选出唯一元素) .复合:(逗号并列div,span)(空格后代#list li)(点筛选div·s) 二.样式 1.大小(width宽度)(height高度) 2.背景(background-color:背景颜色)(background-image:背景图片)(background-repeat:背景图的平铺方式)(background-positi