css学习笔记

css

一.简介

层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。 CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。

二.四种引入 CSS 的方式:

1.直接在标签里面定义style的属性(也叫内联样式),这样的标签很长,不利于维护如:

<body style="background-color: red;">

<h1 style="text-align: center;clolr: red;">xxx</h1>

2.style 标签 一般写在head里面(也可以写在其他地方)如:

<style>

body{

background-color: red;

}

</style>

3.外部文件css link标签引入的方法 用link标签的方式引入一个stylesheet,新建一个.css的文档用link标签进行链接,为外部样式如:

<link rel="stylesheet" href=./a.css>

:这个link与当前文档关系为stylesheet,

4.css import 在css里面引入另一个css如:
在执行body前先执行b.css文件

@ import URL(./.b.css)

注:()里面可以是相对路径也可以是绝对路径

body{

  background-color: red;

  }

三.css选择器

1.元素选择器

使用时这个元素都会被修饰

2.Id选择器

唯一单独的使用属性

3.Class选择器

处理多个标签的使用
如:

<!DO<!DOCTYPE html> 
<html lang="en">     
           <head>         
                        <meta charset="UTF-8">         
                        <title>css选择器</title>              
                        <style type="text/css">
             /*派生选择器 通过依据元素在其位置的上下文关系来定义样式,你可以使标记更加简洁*/
              li strong {     
                          font-style: italic;     
                          font-weight: normal;     
                          color: red;
               } 
              /*id选择器。id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。id 选择器以 "#" 来定义。*/ 
              #red{     
                  color: red; } 
              #orange{     
                   color: orange; }
              /*类选择器 。在 CSS 中,类选择器以一个点号显示*/
               .center{     
               text-align: center;     
               color: blue; } 
               /*属性选择器。对带有指定属性的 HTML元素设置样式。*/ 
               [title]{     
               color: aqua; }
                            </style>     
                </head> 
                <body>         
                         <p><strong>我是斜体字</strong></p> 
                         <ol> 
                         <li><strong>我会变成粗体字,原本我是斜体字</strong></li>
                          </ol> 
                 <h1 id="red">我是id选择器</h1> 
                 <h2 id="orange">我也是id选择器</h2>
                  <h3 class="center">我是类选择器</h3> 
                  <h5 title="">我是属性选择器</h5>     
                  </body>     
</html>

在这里插入图片描述


  Reprint please specify: clam css学习笔记

 Previous
常见的加密与解密 常见的加密与解密
加密与解密一.Base编码系列1.Base16Base16编码使用16个ASCII可打印字符(数字0-9和字母A-F)对任意字节数据进行编码。注: Base16不可能用到填充符号“=”。 2.Base32Base32编码是使用32个可打印字
2019-03-31 yxld
Next 
html学习笔记 html学习笔记
html了解htmlhtml承载的是一个网页上最原始的元素,包括文字、图片、视频等。但是有了这些内容是不够的,它还要以一定的形式呈现出来,才能吸引到人。这就要用到css了,通过css可以改变这些元素呈现的样式,包括字体、颜色、背景、边框等,
2019-03-27 yxld
  TOC