HTML基本理解day8 | 青训营笔记
教程管理员 发布于2023-09-27 13:31 HTML教程 132
1.5.2 行内样式表
行内样式表(内联样式表 是在元素标签内部的 style 属性中设定CSS 样式 适合于修改简单样式
<div style="color: red; font-size:12px;">青春不常在,抓紧谈恋爱</div> 复制代码
style其实就是标签的属性,在双引号中间,写法要符合CSS规范,可以控制当前的标签设置样式
由于书写繁琐,并且没有体现出结构与样式相分离的思想,所以不推荐大量使用,只有对当前元素添加简单样式的时候,可以考虑使用行内样式表设定CSS,通常也被称为行内式引入
1.5.3外部样式表
实际开发都是外部样式表.适合于样式比较多的情况.核心是样式单独写到CSS文件中,之后把CSS文件引入到HTML页面中使用
引入外部样式表分为两步:
1.新建一个后缀名为css的样式文件,把所有CSS代码都放入此文件中 2.在HTML页面中,使用标签引入这个文件。<link rel="stylesheet" href="css文件路径">
1.生成标签直接输入标签名按tab键即可 比如 div然后tab键,就可以生成<div></div>
2.如果想要生成多个相同标签 加上就可以了比如div3就可以快速生成3个div
3.如果有父子级关系的标签,可以用>比如u>li就可以了
4.如果有兄弟关系的标签,用+就可以了比如div+p
5.如果生成带有类名或者id名字的,直接写demo或者#twotab键就可以了
6.如果生成的div类名是有顺序的,可以用自增符号$
7.如果想要在生成的标签内部写内容可以用{)表示
CSS的复合选择器
在CSS中,可以根据选择器的类型把选择器分为基础选择器和复合选择器,复合选择器是建立在基础选择器之上基本选择器进行组合形成的。
复合选择器可以更准确、更高效的选择目标元素(标签)
复合选择器是由两个或多个基础选择器,通过不同的方式组合而成的
常用的复合选择器包括:后代选择器、子选择器、并集选择器、伪类选择器等等
1.1后代选择器(重要)
后代选择器又称为包含选择器 可以选择父元素里面子元素。其写法就是把外层标签写在前面,内层标签写在 后面,中间用空格分隔。当标签发生嵌套时,内层标签就成为外层标签的后代。语法:元素1元素2{样式声明}
上述语法表示选择元素1里面的所有元素2(后代元素)。 例如:ul li { 样式声明 } /* 选择 ul 里面所有的li标签元素*/
元素1和元素2中间用空格隔开
元素1是父级,元素2是子级,最终选择的是元素2
元素2可以是儿子,也可以是孙子等
只要是元素1的后代即可,元素1和元素2可以是任意基础选择器
相关推荐
- 10-04 在HTML中取得请求中的参数
- 10-04 SharePoint 2013 母版页取消和HTML页关联
- 10-04 29行代码使用HTML5 Canvas API绘制一颗红心
- 10-04 浏览器加载和渲染html的顺序,Div和Table的区别
- 10-04 《HTML5完美游戏开发》——2.6 Processing.js实例和整合
- 10-04 如何关闭Struts2的webconsole.html
- 10-04 《HTML5 开发实例大全》——1.4 使用CSS修饰HTML 5页面
- 10-04 《HTML5游戏编程核心技术与实战》——2.8 小结
- 10-04 腾讯视频生成的Html代码
- 10-04 ie下tbody的innerhtml属性只读
- 控制面板
- 友情链接
- 最近发表
-
- 涂鸦而不乱简约艺术主题Office PPT免费模板背景素材下载
- 有创意的情人表白动态贺卡Office PPT免费模板背景素材下载
- 绿色简约技能竞赛电力Office PPT免费模板背景素材下载
- 极简几何商务蓝年终总结汇报Office PPT免费模板背景素材下载
- 蓝橙简约商务年终总结汇报Office PPT免费模板背景素材下载
- 绿色清新教育风课堂教学通用Office PPT免费模板背景素材下载
- 潮流复古艺术感年终总结Office PPT免费模板背景素材下载
- 浅绿商务风工作总结报告Office PPT免费模板背景素材下载
- 大气简约时尚年终总结汇报Office PPT免费模板背景素材下载
- 喜庆春节风公司年终誓师表彰大会Office PPT免费模板背景素材下载
- 最新留言
-