HTML-->CSS-CSDN博客

本文链接：https://blog.csdn.net/iteye_13300/article/details/82411228

HTML-->CSS

《CSS学习网站》：http://www.w3school.com.cn/css/index.asp

Cascading style Sheets 级联样式表
CSS控制页面的样式，如字体，大小等，JS则负责动作。

<style type="text/css">
    .mycss {
             color:#ff0000;
     }

</style>

<body>
        <p class="mycss">这个段落运用了mycss样式</p>
        <p style="color:red">这个是行内样式</p>
</body>

-行内样式：<p style="color:red" font-size："36px">行内样式</p>,直接使用style属性的样式。缺点：内容与显示耦合，而且不利于复用。不推荐使用行内样式。

-内部样式：在html页面中包含的样式，可以简单实现复用。

-外部样式：

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

命名规范划分

----类选择器：名字前面点号，使用控件的class属性调用；

例如：要把表格中的字体改成25px，则可以定义一个css样式如下，

.tablecss{
      font-size="25px";
}
<table class="tablecss">
</>

但是如果有多个表格，则每个table都要加入class属性，过于繁琐，则使用上下文样式。

----上下文样式（覆盖样式），名称，有限，与html标签名称相同，不用使用class关键字，默认家在样式。

body{
     background-color:#FF0000;
}

-----链接样式：有4中链接样式。

—>没有访问过的：

a:link{
     color:#0000FF;
}

—>访问过的：

a:visited{
       color:#FF0000;
}

—>鼠标放上去：

a:hover{
        color:#66FF00;
}

—>鼠标按下去：

a:active{
        color:#000000;
}

id选择器：基本上与类选择器一样，通过#，id属性主要是为了后期客户端编程服务，一般只有层使用id选择器。