其他分享
首页 > 其他分享> > CSS3基础

CSS3基础

作者:互联网

一、CSS的发展历程

​ 从HTML被发明开始,样式就以各种形式存在。不同的浏览器结合它们各自的样式语言为用户提供页面效果的控制。最初的HTML只包含很少的显示属性。
​ 随着HTML的成长,为了满足页面设计者的要求,HTML添加了很多显示功能。但是随着这些功能的增加,HTML变的越来越杂乱,而且HTML页面也越来越臃肿。于是CSS便诞生了。CSS版本有2.0和3.0的版本,我们都会讲到,CSS3因为有兼容性问题,所以讲到CSS3样式的时候,这里会特殊标明。

二、CSS概述

CSS(Cascading Style Sheets)

CSS通常称为CSS样式表或层叠样式表(级联样式表),主要用于设置HTML页面中的文本内容(字体、大小、对齐方式等)、图片的外形(宽高、边框样式、边距等)以及版面的布局等外观显示样式。

CSS以HTML为基础,提供了丰富的功能,如字体、颜色、背景的控制及整体排版等,而且还可以针对不同的浏览器设置不同的样式。

三、CSS样式规则

使用HTML时,需要遵从一定的规范。CSS亦如此,要想熟练地使用CSS对网页进行修饰,首先需要了解CSS样式规则。

在上面的样式规则中:

1.器用于指定CSS样式作用的HTML对象,花括号内是对该对象设置的具体样式。
2.属性和属性值以键值对"的形式出现。
3.属性是对指定的对象设置的样式属性,例如字体大小、文本颈色等。
4.属性和属性值之间用英文":"连接。
5.多个“键值对”之间用英文";"进行区分。
可以用段落和表格的对济的演示。
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CSS初试</title>
   <style>
      h1 {
         color:#ff445566;
         font-size: 40px;
      }
      p {
         color:darkolivegreen;
      }
   </style>
 </head>
 <body>
    <h1>Lorem</h1>
   <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nihil natus aperiam cumque repudiandae numquam illo magnam quaerat saepe inventore recusandae?</p>
   <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Consequuntur dolorem quia corrupti accusamus molestias delectus alias cum reprehenderit, repellat impedit officiis ab ipsa est eius asperiores ut eveniet sapiente dolorum soluta hic corporis. Necessitatibus aut asperiores ipsa assumenda tempore tenetur provident quasi. Sunt delectus rem, totam odit omnis eum cupiditate.</p>
   <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Recusandae atque possimus non tempora nobis quis quas, aperiam ullam voluptas iste!</p>
 </body>
 </html>

标签:CSS3,样式,基础,HTML,样式表,Lorem,CSS,属性
来源: https://www.cnblogs.com/yemoleng/p/16483163.html