css3 nth-child 公式

2024-09-05

CSS3 nth-child的使用，详解css中nth的作用，以及nth-child的兼容写法

:nth-child是css3的一个比较常用的选择器.它用于匹配属于其父元素中的子元素,不论元素的类型. 它的参数可以是数字.关键词或公式.下面讲介绍它的使用方法, nth-child的使用 html结构如下: <div class="demo"> <p></p> <p></p> <p></p> <p></p> </div> 只选取第2个元素 .demo p:nth-

CSS3 nth 伪类选择器

考察下面的 HTML 代码片段: <div> <section>section 1</section> <section>section 2</section> <ul> <li>item 1</li> <li> <ul> <li>sub item 1</li> <li>sub item 2</li> <li>sub item

var easingMap = { "linear": [0.250, 0.250, 0.750, 0.750], "ease": [0.250, 0.100, 0.250, 1.000], "easeIn": [0.420, 0.000, 1.000, 1.000], "easeOut": [0.000, 0.000, 0.580, 1.000], "easeInOut": [0.420, 0.000,

前端开发面试题总结之——CSS3

____________________________________________________________________________________________ 相关知识点布局. 浮动. 盒子模型. 弹性和模型. 选择器优先级. 居中定位. 兼容性. hack写法...... 题目&答案如何理解CSS的盒子模型? 每个HTML元素都是长方形盒子. (1)盒子模型有两种:IE盒子模型.标准W3C盒子模型:IE的content部分包含了border和pading. (2)

HTML5 CSS3面试题

一.CSS3有哪些新特性? 1. CSS3实现圆角(border-radius),阴影(box-shadow), 2. 对文字加特效(text-shadow.),线性渐变(gradient),旋转(transform) 3.transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);// 旋转,缩放,定位,倾斜 4. 增加了更多的CSS选择器多背景 rgba 5. 在CSS3中唯一引入的伪元素是

CSS/CSS3语法新特性笔记

CSS层叠样式表三大特性层叠性:相同的样式会覆盖继承性:属性可向下继承优先级:范围越小权重越高选择器基础选择器标签选择器 1 body { 2 color:#fff; 3 } 类选择器 1 .people‐first { 2 color:green; 3 } id选择器 1 #laowang { 2 color:yello; 3 } 通配符选择器 * { 2 margin: 0 ; 3 padding: 0 ; 4 } 高级选择器后代选择器 1 ul li { 2 list‐st

web前端面试题总结

HTML Doctype作用? 严格模式与混杂模式如何区分?它们有何意义? (1).<!DOCTYPE> 声明位于文档中的最前面,处于 <html> 标签之前.告知浏览器的解析器, 用什么文档类型规范来解析这个文档. (2).严格模式的排版和 JS 运作模式是以该浏览器支持的最高标准运行. (3).在混杂模式中,页面以宽松的向后兼容的方式显示.模拟老式浏览器的行为以防止站点无法工作. (4).DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现. 行内元素有哪

前端开发面试知识点大纲--摘自jackyWHJ

前端开发面试知识点大纲:HTML&CSS: 对Web标准的理解.浏览器内核差异.兼容性.hack.CSS基本功:布局.盒子模型.选择器优先级及使用.HTML5.CSS3.移动端适应 JavaScript: 数据类型.面向对象.继承.闭包.插件.作用域.跨域.原型链.模块化.自定义事件.内存泄漏.事件机制.异步装载回调.模板引擎.Nodejs.JSON.ajax等.其他: HTTP.安全.正则.优化.重构.响应式.移动端.团队协作.可维护.SEO.UED.架构.职业生涯作为一

HTML、CSS部分

要点:对Web标准的理解.浏览器差异.CSS基本功:布局.盒子模型.选择器优先级及使用.HTML5.CSS3.移动端开发技术等 1.Doctype作用? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义? (1).<!DOCTYPE> 声明位于文档中的最前面,处于 <html> 标签之前.告知浏览器的解析器,用什么文档类型规范来解析这个文档. (2).严格模式的排版和 JS 运作模式是以该浏览器支持的最高标准运行. (3).在混杂模式中,页面以宽松的向后兼容的方式显

HTML5面试题-备

万不可投机取巧.只求当时过关,非长久之计也!(感谢大神分享) 面试有几点需要注意: 面试题目: 根据你的等级和职位变化,入门级到专家级:范围↑.深度↑.方向↑. 题目类型: 技术视野.项目细节.理论知识型题,算法题,开放性题,案例题. 进行追问: 可以确保问到你开始不懂或者面试官开始不懂为止,这样可以大大延展题目的区分度和深度,知道你的实际能力.因为这种关联知识是长时期的学习,绝对不是临时记得住. 回答问题再棒,面试官(一般是你的直接领导面试),会考虑我要不要这个人做我的同事?所以态度很重要.(

CSS 基础总结

CSS基础 Doctype 声明位于文档中的最前面,处于标签之前.告知浏览器的解析器,用什么文档类型规范来解析这个文档. 在标准模式中,浏览器根据规范呈现页面: 在混杂模式中,页面以一种比较宽松的向后兼容的方式显示. DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现.(影响样式) 最简单的Doctype头 <meta charset="UTF-8"> 代替了 < meta http-equiv="Content-Type" conten

在TextBox里面仅仅允许数字，按Enter键进入下一个TextBox

<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="../Scripts/jquery-1.10.2.js"></script> <style type="text/css"> body { font-size: 9pt; font-family: Aria

史上最全前端面试题(含答案)-B篇

面试有几点需要注意面试题目: 根据你的等级和职位变化,入门级到专家级:范围↑.深度↑.方向↑.题目类型: 技术视野.项目细节.理论知识型题,算法题,开放性题,案例题.进行追问: 可以确保问到你开始不懂或者面试官开始不懂为止,这样可以大大延展题目的区分度和深度,知道你的实际能力.因为这种关联知识是长时期的学习,绝对不是临时记得住.回答问题再棒,面试官(一般是你的直接领导面试),会考虑我要不要这个人做我的同事?所以态度很重要.(感觉像是相亲一样)资深的工程师能把absolute和relative弄混

【理论面试篇】收集整理来自网络上的一些常见的经典前端、H5面试题 Web前端开发面试题

##2017.10.30收集面试技巧 5.1 面试形式 1) 一般而言,小公司做笔试题:大公司面谈项目经验:做地图的一定考算法 2) 面试官喜欢什么样的人 ü 技术好.自信.谦虚.善于沟通.表达. ü 喜欢追究原理 5.2 面试内容 1.2.1简历上的项目 ü 介绍下你的项目吧? 1) 第一步:介绍你项目是干嘛的 2) 第二步:介绍下你负责的是哪块 3) 第三步:介绍下里面都有什么功能,你是怎么实现的,怎么分层的? 1

js自己总结的小东西（打印出来方便学习）

1.你对angular有哪些认识? 属于mvvm框架,现在非常的火,由谷歌开发出来并维护的框架,为了解决负责业务中ajax的开发痛苦,刚开始结果angular的时候,确实让我有一种耳目一些,原来代码还可以这样写的感觉,他的model层和view进行双向数据绑定,当一个改变的时候,框架帮我接听并且触发另一个的改变,这为我们的敏捷快速开发带来不少的便利,他的依赖注入,$scope自动带来的数据的继承.最重要的他还是单页面应用,和vue一样,有良好的路由.优点:1. 模板功能强大丰富,并且是声明式的,

html/css杂题

1.css选择器:详细(http://www.ruanyifeng.com/blog/2009/03/css_selectors.html) 派生选择器:按标签类别选择器:按class ID选择器:按ID 通用选择器:* 匹配所有属性选择器:按属性,属于css2,IE6不支持以上五个为基本选择器后代选择器[div span]:子元素选择器[div > span]:群组选择器[div,p,#my]:相邻元素选择器[div + span] 伪类选择器:[div:first-child][a:

CSS的引入方式及CSS选择器

一 CSS介绍现在的互联网前端分三层: a.HTML:超文本标记语言.从语义的角度描述页面结构. b.CSS:层叠样式表.从审美的角度负责页面样式. c.JS:JavaScript .从交互的角度描述页面行为 CSS:Cascading Style Sheet,层叠样式表.CSS的作用就是给HTML页面标签添加各种样式,定义网页的显示效果.简单一句话:CSS将网页内容和显示样式进行分离,提高了显示功能. css的最新版本是css3,我们目前学习的是css2.1 接下来我们要讲一下为什么要使用C

一行代码轻松搞定各种IE兼容问题,IE6,IE7,IE8,IE9,IE10

在网站开发中不免因为各种兼容问题苦恼,针对兼容问题,其实IE给出了解决方案Google也给出了解决方案百度也应用了这种方案去解决IE的兼容问题? 百度源代码如下: <!Doctype html> <html xmlns=http://www.w3.org/1999/xhtml xmlns:bd=http://www.baidu.com/2010/xbdml> <head> <meta http-equiv=Content-Type content=“text/ht

Html5 面试题汇总

1.HTML5 为什么只需要写 <!DOCTYPE HTML>? 答案解析: Html5不基于SGML,因此不需要对DTD进行引用,但是需要DOCTYPE来规范浏览器的行为(让浏览器按照他们应该的方式来运行)而HTML4.01基于SGML,所以需要对DTD进行引用,才能告知浏览器文档所使用的文档类型. 2.行内元素有哪些?块级元素有哪些?空(void)元素有那些? 答案解析: 行内元素:a b span img input select strong 块级元素:div ul o

web前端总结面试问题<CSS&HTML问题>

一个父元素div,一个未知宽度.高度的子元素div [上下左右居中方法总结] //1.position布局,position设为absolute,其他同情景一 2.display:table 父级元素:{ display:table;} 子级元素: { display:table-cell;vertical-align:middle } 3.flex布局父级元素:{ display:flex;flex-direction:row;justify-content:center;align-ite

最基础的CSS面试题

1.Doctype作用是什么?严格模式与混杂模式分别是如何触发这两种模式的,区分它们有何意义? (1)<!DOCTYPE>声明位于文档中的最前面,处于<html>标签之前.告知浏览器的解析器,用什么文档类型规范来解析这个文档. (2)严格模式的排版和JavaScript运作模式是以该浏览器支持的最高标准运行. (3)在混杂模式中,页面以宽松的向后兼容的方式显示.模拟老式浏览器的行为以防止站点无法工作. (4)DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现. 2. 行内元素