C#学习之css(⼀)1. css:cascading style sheet 层叠样式表
  能让⽹页制作者有效的定制,改善⽹页效果。css是对html的补充,
  css实现了⽹页内容和页⾯效果的彻底分离。
2.css的三种设置⽅式
  1.内联样式表(在标签内设置元素的样式)
    只针对单个标签进⾏重复设置。
  2.嵌⼊样式表(需要在head标签内写<style type="text/css"></style>)
  3.外部样式表 link
1<html>
2<head>
3<title>css写⼊3种⽅式</title>
4<!--<style type="text/css">
5            p{
6                background-color:yellow;
7                font-size:xx-small;
8            }
9        </style>-->
10<link rel="stylesheet" href="new.css" type="text/css"/>
11</head>
12<body>
13<p >你好我也好</p>
14<p>咱俩都不好</p>
15<p>我好你也好</p>
16</body>
17</html>
3.样式规则的选择器(通过怎样的途径来获得页⾯上要设置样式的元素)
  1.HTML selector
  2.class selector 类选择器给元素设置class属性,某些元素显⽰同类样式
    <style> 元素.classname{} </style> 设置
  3.ID selector id选择器给元素设置id属性,保证每个id是唯⼀的
    <style> #id名{}</style>
  4.关联选择器:通过 “元素插⼊元素”拿到标签
  5.组合选择器:列举元素
1<html>
2<head>
3<title>css选择器</title>
4<style type="text/css">
5            p.p1{
6                background-color:red;
7            }
8            #id1{
9                background-color:blue;
10            }
11            p em{
12                background-color:black;
13            }
14            em,td{
15                background-color:pink;
16            }
17            A:active{
18                background-color:green;
20            }
22</style>
23</head>
24<body>
25
26<p class="p1">你好吗?</p>
27<p class="p1">你好吗?</p>
28<p id="id1">你好吗?</p>
29<p><em>你好吗?<em></p>
30<em>你好吗?</em>
31<table border="1px">
32<tr>
33<td>skdklsk</td>
34<td>skdklsk</td>
35<td>skdklsk</td>
36</tr>
37</table>
38<hr/>
39<a href="#">超链接</a>
40<a href="#">超链接</a>
41<a href="#">超链接</a>
42</body>
43</html>
  6.伪元素选择器:指对同⼀个HTML元素的各种状态和其所包括的部分内容的⼀种  定义⽅式。
    超链接:
      A:active 选中超链接时的状态
      A:hover 光标移动到超链接上的状态
      A:link 超链接的正常状态
      A:visited 访问过的超链接状态
    ⽂本:
      P:first-line 段落中的第⼀⾏⽂本
      P:first-letter 段落中的第⼀个字母
1<html>
2<head>
3<title></title>
4<style type="text/css">
5
cssclass属性
6        p.p1:first-letter{
7            color:#FF0000;
8        }
9</style>
10</head>
11<body>
12<p>年是滴哈死哦d</p>
13<p class="p1">收到复合丝</p>
14</body>
15</html>
4.属性
  1.字体
    font-family :设置字体的系列
    font-size:⼤⼩ Xx-small为最⼩ xx-large 最⼤
    font-style:定义字体样式为normal,italic,oblique
    text-decoration:⽂本中条件下划线,上划线,中
    font-weight:设置粗体字的磅值
2.背景
3.⽂本
4.位置
5.布局
6.边缘
7.列表

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。