首页新闻动态正文

技术贴——css基础【黑马web前端】

更新时间:2019年07月26日 11时16分04秒 来源:黑马程序员论坛

自己学习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
注意:这三个属性属于我们布局的中流砥柱,只要这三个值设置好了,我们书写的网页就很少出现兼容问题;

推荐了解热门学科

java培训 Python人工智能 Web前端培训 PHP培训
区块链培训 影视制作培训 C++培训 产品经理培训
UI设计培训 新媒体培训 产品经理培训 Linux运维
大数据培训 智能机器人软件开发




传智播客是一家致力于培养高素质软件开发人才的科技公司“黑马程序员”是传智播客旗下高端IT教育品牌。自“黑马程序员”成立以来,教学研发团队一直致力于打造精品课程资源,不断在产、学、研3个层面创新自己的执教理念与教学方针,并集中“黑马程序员”的优势力量,针对性地出版了计算机系列教材50多册,制作教学视频数+套,发表各类技术文章数百篇。

传智播客从未停止思考

传智播客副总裁毕向东在2019IT培训行业变革大会提到,“传智播客意识到企业的用人需求已经从初级程序员升级到中高级程序员,具备多领域、多行业项目经验的人才成为企业用人的首选。”

中级程序员和初级程序员的差别在哪里?
项目经验。毕向东表示,“中级程序员和初级程序员最大的差别在于中级程序员比初级程序员多了三四年的工作经验,从而多出了更多的项目经验。“为此,传智播客研究院引进曾在知名IT企业如阿里、IBM就职的高级技术专家,集中研发面向中高级程序员的课程,用以满足企业用人需求,尽快补全IT行业所需的人才缺口。

何为中高级程序员课程?

传智播客进行了定义。中高级程序员课程,是在当前主流的初级程序员课程的基础上,增加多领域多行业的含金量项目,从技术的广度和深度上进行拓展“我们希望用5年的时间,打造上百个高含金量的项目,覆盖主流的32个行业。”传智播客课程研发总监于洋表示。




黑马程序员热门视频教程【点击播放】

Python入门教程完整版(懂中文就能学会) 零起点打开Java世界的大门
C++| 匠心之作 从0到1入门学编程 PHP|零基础入门开发者编程核心技术
Web前端入门教程_Web前端html+css+JavaScript 软件测试入门到精通


在线咨询 我要报名
和我们在线交谈!