标签:code 完整 分离 背景颜色 分行 样式表 规则 标准 1.2
1.1 CSS基本介绍
一、web 标准
所谓的web标准指的就是一系列规范网页书写的要求,它是由W3C组织制定,在它里面要求网页的结构、样式、行为三者相分离。
二、名词解释
1.结构:就是通过HTML标签搭建的网页的结构。
2.样式:就是通过CSS对当前的网页结构进行修饰和美化
3.行为:通过Js让网页可以理解用户的一些操作。从而用户与网页之间产生交互。
1.2 CSS基本使用
一、定义
Css在国内被称之为级联样式表、层叠样式表、样式表,它的作用就是修饰当前网页中的HTML元素。
二、基本使用步骤
1.CSS与HTML可以看做是二门互相独立的语言,此时如果想用CSS来操作HTML那么就需要先将二者建立关系。
2.此时在HTML当中就准备了一个叫style的标签(它是一个双标签).在这个标签对之间就可以用来书写我们的CSS代码。常见的存放位置可以是head 标签里title标签下。
3.通过CSS的选择器找到我们想要操作的元素然给它设置样式(写在style标签之中)
1.3 体验CSS
1.常见的CSS元素属性:width定义元素宽度单位是px,height定义高度,background-color 设置背景颜色。
2.CSS代码书写的固定语法:
选择器{CSS代码}
3.建议大家在开发阶段将CSS样式分行写,且每行的结尾用;结束。
1.4 CSS选择器
一、定义
所谓的CSS选择器就是CSS中已经定义好的用来选中某些元素的固定语法。它的作用
就是选中我们想要设置样式的元素。
二、CS5选择器的分类
在CSS中有很多种选择器。我们人为的分成二大类:简单选择器+复合选择器。
三、简单选择器:
1.标签名选择器:通过具体的HTML标签名称来选择元素。【会将当前网页中所有叫该名字的标签都选中】
2.类名选择器:通过标签类名来选择元素
3.id 选择器:通过id名称选择元素。
1.5 类名选择器
一、为什么需要类名选择器
一个完整的网页需要很多标签组合在一起进行编写实现,因为HTML标签的种类有限,所以同名的一个标签有可以会在一个网页中出现多次。此时如果想对这些同名的标签分别设置不相同的样式。那么直接使用标签名选择器就没有办法实现。这种情况下我们就可以使用类名选择器。
二、类名选择器的基本使用步骤
1.定义HTML网页结构.然后在我们想选中的元素身上设置class 属性。
2.将我们想要一起选中的元素们身上设置相同的class 属性值(类名)
3.此时我们只需要在style标签中按着固定的语法来调用我们的类名:类名
1.6 ld 选择器
一、为什么需要id选择器
如果我们只想从一堆元素当中选中其中的某一个元素,那么就可以使用id选择器。这个id就和人的身份证号是一样的。
二、Id 选择器使用
1.在我们想要选中的元素身上设置一个id属性。
2.给这个id属性设置一个值,我称为d名。
3.在style当中通过固定的语法来进行调用:#id名0
4.注:要求在一个网页当中不能出现同名的id值【虽然有效果但也不能这么做】
1.7 简单选择器总结
1.标签名选择器和类名选择器默认可以一次性选中多个元素,id名选择器一次只能选中一个元素。
2.一个标签的身上可以既具有类名又具有id名,且这二个属性值是可以相同的。
3.允许一个标签的身上同时设置多个类名,要求多个类名之间用空格隔开。
4.关于id选择器要求一个页面当中同一个id名称只能出现一次。
1.8 id名与类名命名规则
1.名称不能是纯数字或者以数字开头(但是我们经常会以数字结尾)
2.名称不能使用中文
3.名称包含特殊字符()
4.起名字时要做到见名知意
标签:code 完整 分离 背景颜色 分行 样式表 规则 标准 1.2
原文地址:https://www.cnblogs.com/zhuifeng-mayi/p/9797245.html