css选择器

李洪强和你一起学习前端之(8)CSS复习

阅读更多关于李洪强和你一起学习前端之(8)CSS复习

今天是2017年3月24日周五每一天都是余生当中最好的一天,珍惜当下. 　　　　　　　　CSS基础复习 1 复习 1.1Css第一天　　css层叠样式表基础选择器　　　标签选择器　　　　p{属性: 值;} 　　　类选择器　　　　.自定义类名{} 　　　　通过class调用　　　 id选择器　　　　#自定义名{}　　　　　通配符选择器　　　　*{}　　所有元素选中复合选择器　　　标签指定式选择器　　　　　标签名.(#)选择器{} 　　　后代选择器　　　　选择器选择器 {} 　　　　　标签关系包含嵌套关系　　　并集选择器　　　　　选择器选择器 {} 　　　属性选择器　　　　　/*属性选择器*/ 　　　　　input[type][id]{ 　　　　　color: red; 　　　　　} 　　　子代选择器　　　　　/*子代选择器*/ 　　　　 div > span{ 　　　　color : red; 　　　　} 注意: 子代选择器,直接选择父元素中的直接子元素　　　<div> 　　　　　　<p> 　　　　　　　　<span>p中的span</span> 　　　　　　</p> 　　　　　　<span> 　　　　　　　　div中的span 　　　　　　</span> 　　 </div> 注意: div中的span元素会被选中 1

web前端开发——css

阅读更多关于 web前端开发——css

一、css介绍 1、css是什么？ Cascading Style Sheets缩写，层叠样式表。样式定义如何显示HTML元素，样式通常又会存在于样式表中。 2、为什么需要css？使HTML页面变得美观；将HTML页面的内容与样式分离；提高web开发的工作效率。 3、css的优势内容与表现分离网页的表现统一，容易修改丰富的样式，使页面布局更加灵活减少网页的代码量，增加网页浏览器速度，节省网络带宽运用独立页面的css,有利于网页被搜索引擎收录二、css语法 css语法分为两部分：选择器和声明。如： h3{ width: 300px; color: red; } h3为选择器，{ }内的内容就是声明，它包含了属性与属性值。三、css引入方式 1、引入方式有三种：　　1.行内样式（内联样式）　　2.内接样式（内嵌方式）　　3.外接样式　　　　　　3.1 链接式　　　　3.2 导入式 2、行内样式：直接在标签头里面定义样式。 <!doctype html> <html> <head> <meta charset="utf8"> </head> <body> <p style="color: blue;">这是一个p标签！</p> </body> </html> 3、内接样式：使用<style>标签在<head>标签里面定义内容的样式。 <!doctype

Java进阶-3.jquery

阅读更多关于 Java进阶-3.jquery

一、jquery 将对原生js常见的方法和对象进行封装，方便使用。以前通过js获取对象的时候：var obj=document.getElementById("id"); 其实可以整合为一个函数，例如： funtion getId(id){ return document.getElementById("id"); } 1.jquery和html的整合 jquery是单独的js文件，通过script标签的src属性导入即可。例如： <script src="../js/jquery-1.11.0.min.js"></script> 2.获取一个jquery对象 $(" 选择器 ") 或者 jQuery(" 选择器 ") 3.dom和jquery的转换 dom 对象 ---->jquery 对象： $(dom 对象 ) //1.获取dom对象 var obj=document.getElementById("username"); //2.转化 var $user=$(obj); jquery 对象 --->dom 对象方式1：jquery对象[index]，因为jQuery可能是个数组方式2:：jquery对象.get(index) //1.获取jquery对象 var $u=$("#username2"); //2.转换 //2.1 方式1 var obj=$u.get

CSS基础

阅读更多关于 CSS基础

css语法:选择器{声明}; 声明由 css属性:属性值; 组成 p{background-color: #ccc;} css属性 width 宽度(单位：px) height 高度（单位:px） background-color 背景颜色(颜色的英文或者十六进制颜色) color 字体颜色 font-size 字体大小 …… css注释 /*h3{width:300px;}*/ 单行注释 /* p{ width:300px; height: 300px; } */多行注释 css样式表 1.内部样式表：将css语法写在style标签里面，而style标签写在head里面。作用域是本页面上。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> <style> h3{ width:300px; height:300px; background-color:red; } </style> </head> <body> <h3>内部样式表</h3> </body> </html> 2.外部样式表：新建一个css文件，在css文件里写css语法.接着在html文件里通过link标签（写在head里面）的href属性链接到该css文件

CSS快速入门

阅读更多关于 CSS快速入门

一.概述层叠样式表;可以对HTML的元素,进行控制,使HTML的元素展现的效果和位置更好; 二.基本语法 css规则由两个部分构成:选择器和语句语句规则: 1.css选择器的名称区分大小写;属性名和属性值区分大小写; 2.每条语句的结尾都要使用;,最后一行可以省略; 3.注释格式:/**/ 4.css在html中写的代码需要使用style标签包裹起来; 5.如果单独写一个css文件,则不需要使用style标签,所有的语句需要使用大括号包裹起来; 6.如果属性值中包含空格,必须使用双引号包裹起来; 7.如果一个属性名对应多个属性值,多个属性值用空格隔开; 8.css文件的后缀名.css; 三.格式: 选择器{ 属性名: 属性值; 属性名: 属性值; 属性名: 属性值; ........... } 四.选择器 1.ID选择器 #id的属性值{ 属性名: 属性值; 属性名: 属性值; ..... } 2.类选择器 .class属性的属性值{ 属性名: 属性值; 属性名: 属性值; ..... } 3.元素选择器(标签选择器) 标签名{ 属性名: 属性值; 属性名: 属性值; ..... } 4.属性选择器标签名[属性名=属性值]{ 属性名: 属性值; .... } 5.包含选择器基本选择器标签名{ 属性名: 属性值; .... } 四.与html整合的方式 1

CSS 样式书写规范

阅读更多关于 CSS 样式书写规范

原文: CSS 样式书写规范可能不同团队都有各自的规范，又或者很多人在写 CSS 的时候还是想到什么就写什么，不存在太多的约束。我觉得 CSS 代码规范还是有存在的必要的，尤其是在团队配合，多人协作下，规范就显得尤为重要。本文的所列是实践当中得出的一套比较不错的 CSS 书写规范，并不希望大家完全采用，而是希望可以结合自己的团队需要，发展出一套适合自己的 CSS 代码规范。也希望可以有更多的建议，共同的完善。本规范也可以在我的 Github 上看到，欢迎留言或者提 PR。我觉得不同的规范都有各自的长处与缺陷，对待所谓的规范最好的方式不是人云亦云，拿来就用，而是应该结合实际情况及需求，取长补短，取其精华去其糟粕。编码设置采用 UTF-8 编码，在 CSS 代码头部使用： @charset "utf-8"; 注意，必须要定义在 CSS 文件所有字符的前面（包括编码注释）， @charset 才会生效。例如，下面的例子都会使得 @charset 失效： /* 字符编码 */ @charset "utf-8"; html, body { height: 100%; } @charset "utf-8"; 命名空间规范布局：以 g 为命名空间，例如：.g-wrap 、.g-header、.g-content。状态：以 s 为命名空间，表示动态的、具有交互性质的状态，例如：

阅读更多关于 css选择器

选择器选择器：帮助你精准的选中想要的元素简单选择器 ID选择器元素选择器类选择器通配符选择器 *，选中所有元素属性选择器根据属性名和属性值选中元素伪类选择器选中某些元素的某种状态 1）link: 超链接未访问时的状态 2）visited: 超链接访问过后的状态 3）hover: 鼠标悬停状态 4）active：激活状态，鼠标按下状态爱恨法则：love hate 伪元素选择器 before after 选择器的组合并且后代元素 —— 空格子元素 —— > 相邻兄弟元素 —— + 后面出现的所有兄弟元素 —— ~ 选择器的并列多个选择器, 用逗号分隔语法糖来源： CSDN 作者：城南没有城北链接： https://blog.csdn.net/weixin_42380289/article/details/103690459

python | HTML 笔记2

阅读更多关于 python | HTML 笔记2

HTML --css笔记: 一.css引入方式 1.行内式(不推荐使用): 直接在标签里面加style-css样式,这样是可以添加,但是会出现很同样标签,所以一般不推荐和使用这样的方式去添加css样式. 使用方法: <p style="color:green">这里放设置文本</p> 直接在标签属性添加style-css样式 2.内接样式(页面较小的时候使用哟 ***): 内接样式是针对页面比较小的情况,才会使用. 使用方法:就可以直接在head 标签里面添加:<style> 直接在这里写cass样式</style> 3.外接样式: (1) 链接式 *** 这个是常用的方式,链接式一般都是会另外写一个文件,然后通过link 样式文件进来. 使用方法:<link rel="stylesheet" href="这里放cass文件"> (2) 导入式同样也是另外写css文件然后导入,不建议使用,因为页面css加载不出来时候,会显示 html 的页面,有加载延迟导入式是使用方法: @import url("这里放css文件") 二.选择器 *** 注意点: css优先级,指的是浏览器加载 cass 样式的先后顺序 *** 1.基本选择器 (1) 标签选择器直接使用标签名来做选择器,而不是在另外设置属性,调用属性的( 值 ) 使用方法:直接标签来写在里面,任何标签都是可以找到的.

CSS基础

阅读更多关于 CSS基础

CSS介绍给HTML设置样式，让它更加美观。加皮肤当浏览器读到一个样式表，它就会按照这个样式表来对文档进行格式化（渲染）。 CSS语法选择器{css样式:样式对应的值} CSS实例　　　　每个CSS样式由两个组成部分：选择器和声明。声明又包括属性和属性值。每个声明之后用分号结束。　　　　　　 CSS的几种引入方式行内样式行内式是在标记的style属性中设定CSS样式。不推荐大规模使用。 <p style="color: red">Hello world.</p> 内部样式嵌入式是将CSS样式集中写在网页的 <head></head> 标签对的 <style></style> 标签对中。格式如下： <head> <meta charset="UTF-8"> <title>Title</title> <style> p{ background-color: #2b99ff; } </style> </head> 外部样式推荐方式3:(常用) 外部样式第一步:创建一个css文件第二步:在html文件中引入: <link href="mystyle.css" rel="stylesheet" type="text/css"/> 第三步:css文件中样式的写法 div{color:green;xx:xx;...} #现在写的这个

CSS基础

阅读更多关于 CSS基础

CSS基础语法：例如 p{ color:red; background-color: green; } css的四种引入方式: 1 行内式是在标记的style属性中设定CSS样式。这种方式没有体现出CSS的优势，不推荐使用。 <p style="color:red;background-color:green">hello liuliu</p> 2 嵌入式是将CSS样式集中写在网页的<head></head>标签对的<style></style>标签对中。格式如下 <style> p{ color:red; background-color: green; } </style> 3 将一个.css文件引入到HTML文件中 <link rel="stylesheet" href="first.css"> 4 将一个独立的.css文件引入HTML文件中，导入式使用CSS规则引入外部CSS文件，<style>标记也是写在<head>标记中，使用的语法如下： <style> @import 'first.css'; </style> 注意：导入式会在整个网页装载完后再装载CSS文件，因此这就导致了一个问题，如果网页比较大则会儿出现先显示无样式的页面，闪烁一下之后，再出现网页的样式。这是导入式固有的一个缺陷。使用链接式时与导入式不同的是它会以网页文件主体装载前装载CSS文件

订阅 css选择器