A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

WMC1996

初级黑马

  • 黑马币:18

  • 帖子:6

  • 精华:0

© WMC1996 初级黑马   /  2019-6-9 21:34  /  824 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

自己学习css的时间还很短,只是整理了一些笔记和自己的心得
Css属性书写语法
属性:属性值; 这其实对于初学者来说很重要,因为是新手的问题往往很容易书写错误,检查了很长时间最后发现是自己 的书写不规范或者标点符号问题导致的,那感觉真是没谁了。。

直接在标签的开始标签身上添加一个 style=“”属性,然后在引号里面书写css属性和属性值即可、。
注意:行内样式没有实现结构和样式分离,尽量不用:
例如:<div style=“color:pink; font-size:16px;”>我是行内样式</div>;
如果有一个两个样式需要更改,其他的东西很多的情况下,是可以用一下之下书写样式的  这样相对来说权重也会高一些


Css选择器的分类
Css选择器分为两类:基础选择器和高级选择器(复合选择器)
基础选择器:标签选择器(html选择器)、类选择器、ID选择器
复合选择器:后代选择器、并集选择器、指定标签选择器
类选择器(重点)类选择器定义
类选择器使用有一个过程:
01 定义 css里面用“  .  ”   +  类名称 +{ css键值对 } 进行样式定义;
02 调用:在html里面哪个标签需要,就在开始标签敲空格class=“类名称”进行调用;
类选择器的命名规则:
不能用纯数字、数字开头的、中文命名;
但是可以用数字结束。
类选择器特殊用法(多类名)
一个标签身上只能使用一个class,如果想要调用多个类名我们可以在一个class里面直接以空格隔开直接书写另一个类名称即可;
例如:<div class=“red  font100”>一个元素调用多个类名</div>
ID选择器(了解)id选择器的定义使用
id选择器使用有一个过程:
01 定义 css里面用 “  #  ”   +  id名称 +{ css键值对 } 进行样式定义;
02 调用:在html里面哪个标签需要,就在开始标签敲空格id=“id名称”进行调用;
id选择器的命名规则:
不能用纯数字、数字开头的、中文命名;
类选择器和id选择器的区别:
类选择可以重复使用,只要样式一致就可以重复的使用同一个类名称;
id选择器是唯一的不能重复使用,一个id名称一个页面只能出现一次;
通配符选择器*
一个*表示选中所有标签,匹配页面的所有标签,降低页面得到响应时间,不建议使用;
*{
        margin:0;
        padding:0;
}
以上代码表示清空所有的默认边距;

1、复合选择器
复合选择器就是把基础选择器组合起来使用
后代选择器(重点工作中常使用)子元素选择器
交集选择器(指定标签选择器)(了解)
并集选择器(重点)

需要根据情况来决定用什么样的选择器

链接的伪类四种状态:
     a:link        未访问的链接(访问前)
     a:visited    已访问的链接(访问后)
     a:hover      鼠标移动到连接上(鼠标经过)
     a:active      选定的链接(按下鼠标的时候)
其中hover用的最多,最常见  也要熟练掌握


3、标签显示模式(重点要理解)
实际开发的时候有的需要独占一行,有的需要一行放多个,所以把标签的显示模式分为以下三种:
    块级元素:自己独占一行; --- 代表标签 div、h标签
     行内元素:一行可以共存多个;--- 代表标签  span a
     行内块元素:一行可以共存多个; --- 代表标签 img input
此处非常重要 ,布局的时候弄不清元素的样式就会出现很大问题。 要了解并且熟练转换

4、实体化三属性(重要滴很)
width
height
背景 background
注意:这三个属性属于我们布局的中流砥柱,只要这三个值设置好了,我们书写的网页就很少出现兼容问题;

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马