基础系列(2)--- css1
时间:2019-06-18
本文章向大家介绍基础系列(2)--- css1,主要包括基础系列(2)--- css1使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
css组成
1 css语法组成 2 选择器 和 声明 (多个声明用分号隔开) 3 声明包括 属性和属性值(多个属性值用空格隔开) 4 5 语法: 6 选择器{ 7 属性: 属性值; 8 属性: 属性值1 属性值2; 9 }
css样式表
1.内部样式表 通常放在head标签内 2.外部样式表 a: <link rel="stylesheet" href="url" type="text/css"> rel:连接css和html href: css样式表的路径 type: 定义文档类型,h5通常省略不写 b. <style> @import url("") </style> 通常不用这种方式 3.内联样式表(行内样式表) link 和 @import区别 (1)本质差别: link属于html语言,@import是css定义的方式 (2)加载顺序: link导入的css是和结构一起加载,@import是结构加载完再执行的 (3)兼容: link无兼容问题,@import 低版本IE不兼容 (4)js控制DOM样式的区别
权重关系
内联样式表 > 内部样式表 和 外部样式表(具体权重看在html中的顺序,后面覆盖前面的相同属性)
内联样式表只作用在当前元素上
css选择器
1.类型选择符(标签选择符)
html中所有标签都可以直接对元素选择
特点:对页面中所有当前类型元素有效
应用:清除某个元素默认样式、统一某个元素样式
2.id选择符
特点:id名字在一个页面中唯一
应用:用来划分网页外围结构!
3.类选择符
特点:一个元素可以有多个class名称
应用:可以定义一类样式
4.包含选择符
语法:符元素选择符 子元素选择符{css语法}(中间用空格隔开)
5.群组选择符
语法: 选择符1,选择符2, 选择符3{css语法} (中间用逗号隔开)
6.伪类选择符
a:link、a:visited、a:hover(常用)、a:active
7.通配符
*
选择符权重
内联样式表 > id > class、伪类 > 标签
(1000) (100) (10) (1)
包含选择符权重等于各个权重之和
群组选择符权重各自不变
命名规范
1.不能是关键字
2.字母开头,后面可接 字母、数字、下划线、连字符
连字符:
box-left box-right box-center
下划线
box_left box_right box_center
驼峰式
boxLeft boxRight boxCenter
原文地址:https://www.cnblogs.com/pxdi/p/11039227.html
- HTML 教程
- HTML 简介
- html div 标签介绍
- html span 标签介绍
- html a 超链接标签
- HTML Br换行标签介绍
- HTML P段落标签介绍
- HTML br与p标签区别
- Html H 标题标签
- html px em pt长度单位
- HTML form 标签
- HTML radio 单选框
- HTML B 加粗标签
- HTML strong加粗粗体标签
- HTML em 强调标签
- HTML i 斜体标签
- HTML u下划线标签
- HTML s 删除线标签
- Html img 图片标签
- Html上标注sup与下标注sub标签
- HTML nobr 禁止换行标签
- HTML hr 水平线标签
- HTML label 标签
- HTML input 标签
- HTML textarea 标签
- HTML select下拉列表标签
- HTML checkbox 多选框
- HTML font color 标签
- HTML iframe 框架标签
- HTML Table 表格
- HTML dl dt dd 标签
- HTML ol li有序列表标签
- HTML ul li 无序列表标签
- HTML 注释
- CSS 教程
- CSS 简介
- CSS 语法
- CSS Id 和 Class选择器
- CSS 样式的创建
- CSS background 背景介绍
- CSS 文本样式
- CSS font 字体
- CSS A 链接
- CSS ul ol列表样式
- CSS TABLE 样式
- CSS 框模型
- CSS border 边框
- CSS Outlines 轮廓
- CSS 外边距 Margin
- CSS Padding 内边距
- CSS 分组和嵌套选择器
- CSS 尺寸 (Dimension)
- CSS Display 属性
- CSS Position 定位
- CSS Float 浮动
- CSS 水平对齐(Horizontal Align)
- CSS 组合选择符
- CSS 伪类
- CSS 伪元素
- CSS 导航栏
- CSS 下拉菜单
- CSS 图片廊
- CSS 图像透明/不透明
- CSS sprite 图像拼合技术
- CSS 媒体类型
- CSS 属性选择器
- CSS 实例
- flink教程-flink 1.11 使用sql将流式数据写入hive
- flink实战-使用广播实现报警阈值动态更新
- 浅谈MVC设计模式(示例)
- flink实战-聊一聊flink中的聚合算子
- 浙大版《C语言程序设计(第3版)》题目集 习题11-2 查找星期
- flink实战-模拟简易双11实时统计大屏
- Android Studio首次运行指南
- PAT (Basic Level) Practice (中文)1047 编程团体赛
- 聊聊AWK命令的那些事
- Flink实战-定时器实现已完成订单自动五星好评
- 树状数组-HDU3015 Disharmony Trees
- 放弃fastjson,拥抱Jackson
- Spring入门
- 贪心-HDU1789 Doing Homework again(活动安排问题)
- flink实战-实时计算平台通过api停止流任务