多选框其他，css基础，选择器基础

Posted 2022-12-17 really-insist

多选框

　　在多选框中如果想默认选中时，可以加入 checked 属性，属性值也为 checked

　　在选择时，如果想要达到，点击文字也能选中的效果，要利用  label  标签，

　　要在选项标签的 id  和  label  之间建立联系 　　

　　<input id="app" type="checkbox"/>　　

　　<label   for=“app”>这里写可以点击的文字</label>    <!-- input 选项标签的 id  作为 for 的属性值-->

CSS 概念

　　css： cascading style sheets ，层叠式样式表，规定了 html 标签在网页上的显示样式

　　html4 的时候，w3c 组织将html的结构和样式做了分离

　　前端三层：

　　　　html　　结构层，打造网页的整体架构

　　　　css　　 样式层，装饰页面

　　　　javascript　　 行为层，一些页面交互效果

CSS 作用

　　css两个重要的概念：层叠式，样式。

　　样式：html标签在页面的显示效果

　　某一个标签有什么样式，直接将对应的属性及属性值罗列出来

　　css样式设置的时候，有两个关键：选择器，样式表

　　css作用细化：

　　　　1.给文本添加文字显示样式

　　　　2.给盒子添加属性进行结构布局

css小属性：

　　1.文本样式：字体，颜色，大小

　　　　大小：font-size。本身是一个复合属性 font，里面的单一属性，需要用 font- 单一属性名。---属性值，以像素为单位

　　　　颜色：color：red

　　　　字体：font-family，常用英文字体有：Arial，consolas，中文字体：“宋体”

　　　　font-family："Arial","consolas","宋体"------------字体用引号包裹，字体之间用逗号隔开。

　　　　为了追求加载速度，将一些中文字体名字写成英文表示法　

　　　　微软雅黑：Microsoft Yahei

　　　　宋体：SimSun

　　2.盒子实体化基本属性

　　　　实体化：给盒子指定，高，宽，边框，背景色

　　　　宽：width  单位，像素

　　　　高：heigth  单位，像素

　　　　背景色：background-color

　　　　边框：border，复合属性，有多个属性值，属性值之间用空格隔开，边框的宽，颜色，线的类型

　　　　实线边框：solid

　　　　将代码上传到网上，为了提高加载速度，需要将所有的空格，缩进，换行等删除，压缩代码。

选择器

　　　　类选择器多用于样式，id多用于行为

高级选择器

　　基础选择器并不能满足所有的需求，所以就有了以下三种：

　　　　1.后代选择器 ----空格 左侧 是右侧的祖先元素

　　　　　　通过标签之间的嵌套关系，层级关系，限定我们大体范围，在范围内具体查找相关元素

　　　　 2.交集选择器

　　　　　　 交际使用的基础选择器，可以都是类选择器，可以使标签和类的混写

　　　　　　IE6 不支持类的连续交集

　　　　 3.并集选择器

　　　　　　很多元素可能都有相同 css 样式，可以通过并集选择器将这些标签写在一起，同意设置 css 样式。

　　　　　　前面所有选择器都可以作为并集里的一项，在选择器中间用逗号隔开。

　　　　　　也就是多个选择器选中的元素使用同一个样式。