码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2019-10-03 14:39:47      阅读:121      评论:0      收藏:0      [点我收藏+]

标签:删除   交互效果   cas   --   html4   很多   布局   字体   样式   

多选框

  在多选框中如果想默认选中时,可以加入 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 样式。

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

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

  

   

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

标签:删除   交互效果   cas   --   html4   很多   布局   字体   样式   

原文地址:https://www.cnblogs.com/really-insist/p/11617837.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!