CSS学习笔记 一、CSS基础 1、CSS简介 层叠:一层一层的; 样式表:很多的属性和样式 CSS语法: 选择器...{ 属性名:属性值; 属性名:属性值; …… } 2、CSS和HTML的结合方式 在HTML标签中的style属性里添加CSS代码; 在头标签中添加标签;...p> ? 使用HTML标签中的id属性作为选择器: 后加载的优先级越高。... 常用属性: behavior:设定滚动的方式 alternate: 表示在两端之间来回滚动 scroll:表示由一端滚动到另一端,会重复。
app:collapsedTitleGravity : 指定未展开时的标题文字对齐方式。 app:expandedTitleTextAppearance : 指定展开后的标题文字字体。...app:expandedTitleTextColor : 指定展开后的标题文字颜色。 app:expandedTitleGravity : 指定展开后的标题文字对齐方式。...上述属性在代码中的设置方法如下所示: setContentScrim/setContentScrimColor/setContentScrimResource : 设置布局内部未展开时的背景颜色。...setCollapsedTitleGravity : 设置未展开时的标题文字对齐方式。 setExpandedTitleTextAppearance : 设置展开后的标题文字字体。...setExpandedTitleColor : 设置展开后的标题文字颜色。 setExpandedTitleGravity : 设置展开后的标题文字对齐方式。
使用行来创建水平的列组。 内容需要放置在列中,并且只有列可以是行的直接子节点。 预定义的类如 .row 和 .col-* 可用于快速制作栅格布局。 列通过填充创建列内容之间的间隙。...在支持 Page Visibility API 的浏览器中,当网页对用户不可见时,轮播将避免滑动(例如浏览器分页不是启用状态、浏览器视窗最小化时等)。...可以在 标签中使用 dropdown-divider 类用于在下拉式功能表中创建一个水平的分割线 dropdown-header 类用于在下拉式功能表中添加标题 active 类会让下拉式功能表的选项高亮显示...在元素上的 .dropdown-menu 类后添加 .dropdown-menu-right 类,使下拉式功能表右对齐。 dropright类,下拉式功能表向右弹出。...如果你想实现在鼠标移动到元素上显示,移除后消失的效果,可以使用 data-trigger 属性,并设置值为 "hover"。 Scroll滚动监听 例: <!
AppBar 应用栏是各种应用程序中最常用的组件之一。它可用于容纳搜索字段、以及在页面之间导航的按钮,或者只是页面标题。...由于它是一个如此常用的组件,因此 Flutter 为该功能提供了一个名为AppBar的专用小部件。 在本教程中,我们将通过一些实际示例向您展示如何在 Flutter 应用程序中自定义 AppBar。...), Flutter AppBar 中心标题 actions actions是与 AppBar 右侧对齐的小部件列表。我们通常在用作按钮的应用程序中看到它们来触发下拉菜单、个人资料头像等。...工具栏包含文字,图标,按钮,和其他任何公司的前景,除了小部件,如Container和Image。...用来在 Toolbar 标题下面显示一个 Tab 导航栏 this.elevation,//控件的 z 坐标顺序,默认值 4,对于可滚动的 SliverAppBar,当 SliverAppBar
透视视图中的日光路径社区想法: 在“透视”视图中,编辑拖放操作现在处于启用状态。切换自由形式钢筋对齐分布的箍筋方向通过按空格键,可以切换对齐分布的自由形式钢筋的箍筋方向。...REVIT-197985修复了配电盘明细表线路行未应用在配电盘明细表模板中定义的字体设置的问题。...REVIT-187482从 P&ID Modeler 中删除了一些未使用的第三方组件。REVIT-187186修复了“控制系统”命令的默认功能区快捷方式的问题。...REVIT-198738通过使用“与图纸对齐移动”命令或通过项目浏览器在图纸之间拖动配电盘明细表实例,增强了在图纸之间对齐移动放置的配电盘明细表实例的功能;如果将配电盘明细表直接拖动到图纸绘图区域,则仍将使用手动放置方法...REVIT-195418通过使用“与图纸对齐移动”命令或通过项目浏览器在图纸之间拖动明细表实例,增强了在图纸之间对齐移动放置的明细表实例的功能;如果将明细表直接拖动到图纸绘图区域,则仍将使用手动放置方法
警示框按钮的标题要简洁明了、合乎逻辑。最合适的按钮标题由一个或两个词语组成,用于描述选择按钮后的结果。对于所有的按钮标题,使用标题样式的文字且不需要标点符号。...在集合中,插入、删除或重新排序项目,都可以启用动画,并且还支持自定义动画。 当标准行或网格布局足够时,避免创建新的设计。集合应该是用来优化用户体验的,而不是成为关注的焦点。...这种样式的表始终包含至少一组,并且每组始终包含至少一行,并且可以在其后跟一个页眉和一个页脚。插入分组表不包含索引。插入的分组样式在常规宽度的环境中效果最佳。...表单中的行 使用标准表格单元格样式来定义内容在表格行中的显示方式。 基础列表(默认):行的左侧显示图像,其后紧跟左对齐标题。对于不需要显示其他附加信息的项目来说,这是一种很好的选择。...子标题模式:同一行中,包含左对齐标题和标题下面的左对齐文本。这种样式适用于视觉上相似的列表。而加上子标题有利于区分行与行。 ? 右侧子标题:左对齐标题,右对齐子标题,位于同一行。
全局事件属性 onload:在页面加载结束之后触发 onunload:在用户从页面离开时发生,如点击跳转,页面重载,关闭浏览器窗口等。...form表单事件 onblur:当元素失去焦点时触发 onchange:在元素的元素值被改变时触发 onfocus:当元素获得焦点时触发 onreset:当表单中的重置按钮被点击时 onselect:在元素中文本被选中后触发...文本标签 段落标签p>p> 段落标签用来描述一段文字 标题标签 标题标签用来描述一个标题 标签标签总有六级。...什么是逻辑部分,它是页面上相互关联的一组的元素,如网页中的独立的栏目版块,就是一个典型的逻辑部分。...网页由上到下,由内到外 div,header,footer,nav,article,aside等标签多用于模块划分 css全称为层叠样式表,它主要用于定义HTML内容在浏览器内的显示样式,如文字的大小,
Left:左对齐(默认) Right:右对齐 Center:居中 Class:用一个名称来标记标题,标记名称指向在外部定义的样式表 Id:为段落设置一个标记,将来可以在一个超链接中明确的引用这个标记...,以便作为样式表的选择器 Style:创建标题内容的内联样式 Title:给标题加上一个说明性的文字 (2)、标记普通字 属性: Face:字体 ...:yes 出现边框 no 不出现边框 (3)、定义内联框架,在文档中定义一个独立的矩形区域,有独立的滚动条和边框 属性:class id style...) Scrolling的属性值:yes 出现 no不出现 auto自动出现滚动条 16、样式表 (1)、内联样式表:只需在标签内含一个上style属性,style属性后在跟一系列属性和属性值即可...能够在文档样式表或外部样式表中为同一个元素创建不同的样式,在文档后面通过设置class属性来选择特定的样式。
font> 为标题大小 文字加粗 文字加粗 斜体 斜体 斜体 斜体p> 无序列表 .....www.baidu.com" target="_blank"> 邮箱地址 vlink="未访问超链接的颜色..." hspace="水平边距" align="见下表"> align常用属性值 top:文字的中间线在图片上方 middle:文字的中间线在图片中间 bottom:文字的中间线在图片底部...left:图片在文字的左侧 right:图片在文字的右侧 absbottom:文字的底线在图片底部 absmiddle:文字的底线在图片中间 baseline:
表单的构件解析 标签 标签即可以理解为标题的意思,用简洁的文字让用户知道应该输入的内容;根据标签的所属位置,大致可以分为:顶部标签、左对齐标签、右对齐标签、内联标签、图标标签以及浮动标签,下面我们主要介绍前三个...善用开关按钮 允许用户在两个相反的状态之间进行选择,如:有效或无效、是或否、开或关等。...提示信息 根据输入流程将用户输入过程分为输入前、输入中、输入后三个阶段,提示信息在输入前发生的称为引导提示,提示信息在输入中/后发生的叫反馈提示。...弹框loading:确定按钮点击后需有loading。 表格loading:用表格自带的loading属性。 滚动条 表格宽度过长- 滚动条最好出现在表格中,不是在页面级别。...弹框过长-滚动条最好出现在弹框中,不是页面级别滚动。 避免出现滚动条套娃。 好啦以上就是全部啦!还没看表格的可以看看上一篇哦- 一件事让客户成为你的忠实用户!
AngularJS在编译时会将内联模板的id属性值和其内容,分别作为key 和value,存入$templateCache管理的hash表中: ? 使用内联模板 内联模板的使用,常见的有几种情况。...配置状态机 需要指出的是,状态的划分以及每个状态的元信息(比如模板、url等)是在配置 阶段通过$stateProvider完成的: angular.module("ezApp",["ionic"])...,它的内容随导航视图 的状态变化而自动同步变化: ion-nav-bar有以下可选的属性: align-title - 标题对齐方式 允许值为:...默认为center,居中对齐 no-tap-scroll - 点击导航栏时是否将内容滚动到顶部。 允许值为:true | false。...> 当视图切换时,回退按钮会自动出现在导航条中,并显示前一个视图 的标题。
:设置字体(如黑体,楷体等) Size:设置大小(属性值从1——7,从小到大) Color;字体颜色(值为十六进制颜色) (3) :设定显示在浏览器左上方的标题内容 属性: Dir:文本的显示方向...--被注释掉的内容--> 5、文字标记 (1)、(n=1~6)标记标题字 属性: Dir:文字方向 Lang:语言信息 Align:对齐方式 属性值: Left:左对齐(默认) Right:右对齐...Center:居中 Class:用一个名称来标记标题,标记名称指向在外部定义的样式表 Id:为段落设置一个标记,将来可以在一个超链接中明确的引用这个标记,以便作为样式表的选择器 Style:创建标题内容的内联样式...auto自动出现滚动条 16、样式表 (1)、内联样式表:只需在标签内含一个上style属性,style属性后在跟一系列属性和属性值即可。...能够在文档样式表或外部样式表中为同一个元素创建不同的样式,在文档后面通过设置class属性 来选择特定的样式。
表视图 表视图在一个由多行组成的滚动单列清单中显示数据。...在简单风格中,行可以被分到有标题的章节中,并且在视图的右边界可以显示一个可选的垂直索引。在章节的第一个条目之前可以显示页眉,在最后一个条目之后可以显示页脚。 分组风格。...子标题风格包含一个在行左边界可选的图片,跟随的左对齐标题和在其下方的左对齐子标题。 左对齐的文本布局让列表更加易于浏览。...Value 1风格显示一个左对齐的标题和同一行中右对齐的较轻字体的子标题。 Value 2(UITableViewCellStyleValue2)。...Value 2风格以蓝色字体显示右对齐的标题,紧跟着同一行显示左对齐的黑色字体子标题。图片在这种风格中不太适合。 在Value 2的布局中,文本间清爽的垂直边缘帮助用户专注于详细文本的第一个单词。
网站平滑滚动 在元素中添加scroll-behavior: smooth,以实现整个页面的平滑滚动。...控制如何调整替换元素(如 )的内容大小。...p { text-underline-offset: 3px; } 85. 滚动填充块 定义在可滚动块容器周围添加的填充空间,以确保内容在滚动期间保持可见和可访问。...字体功能设置 font-feature-settings 允许您启用或禁用字体中的 OpenType 功能,例如,连字、字距调整和样式替代。...p { font-feature-settings: "liga" on; } 92. 文本导向 此属性控制文本在其包含框中的方向,从而启用垂直或横向文本布局。
GridView及其辅助类能让你在表中来查看集合中的数据项,且可以通过表头来进行交互(表头是个按钮,可以给它加各种交互功能,如排序)。 2.2. GridView是什么?...默认的GridView样式将按钮实现为列标题。 列标题 header 成员1 P1 所谓列标题可以理解为表头。 通过对列标题使用按钮,你能实现用户交互功能。...ItemContainerStyle中的对齐问题 为了防止列标题和单元格之间的对齐问题,不要设置或指定影响ItemContainerStyle中项宽度的属性或模板。...与GridView进行用户交互 当你在程序中使用了GridView时,用户可以与GridView交互并修改其格式。例如,用户可以重新排序列(拖动表头使整列移动)、调整列的大小、选中表中的项和滚动内容。...你还可以定义用户单击列标题时响应的事件处理程序。事件处理程序可以执行类似于根据列内容对显示在GridView中的数据进行排序的操作。
CSS指层叠样式表(Cascading Style Sheets) 样式定义 如何显示 HTML元素 样式通常存储在样式表中 把样式添加到HTML4.0中,是为了解决内容与表分离的问题 外部样式表可以极大提高工作效率...外部样式表通常存储在CSS文件中 多个样式定义可层叠为一 CSS实例 样式解决了一个很大的问题 HTML 标签原本被设计为用于定义文档内容,如下实例: 这是一个标题 p>这是一个段落...多重样式优先级 样式表允许以多种方式规定样式信息。样式可以规定在单个的HTML元素中,在HTML的头元素中,或在一个外部的CSS文件中。甚至可以在同一个HTML文档内部引用多个外部样式表。... 这是一个可见标题 这是一个隐藏标题 p>注意, 实例中的隐藏标题仍然占用空间。...使用 clear 属性往文本中添加图片廊: .text_line { clear:both; } CSS 布局 - 水平 & 垂直对齐 元素居中对齐 要水平居中对齐一个元素(如 div), 可以使用
.text-left 左对齐 .text-right 右对齐 .text-center 居中对齐 .text-justify 两端对齐 .text-nowrap 段落中超出屏幕部分不换行 .text-lowercase...设定文本小写 .text-uppercase 设定文本大写 .text-capitalize 设定单词首字母大写 .initialism 显示在 元素中的文本以小号字体展示,且可以将小写字母转换为大写字....list-unstyled 移除默认的列表样式,列表项中左对齐 ( 和 中)。...将所有列表项放置同一行 .pre-scrollable 使 元素可滚动,代码块区域最大高度为340px,一旦超出这个高度,就会在Y轴出现滚动条 【文字颜色样式】 .text-muted 柔和的文本...默认是左对齐 .dropdown-header 下拉菜单标题 .dropdown-item 下拉菜单列表项目 .dropdown-divider 在下拉菜单中创建一个水平的分割线 .active 启用指定下拉菜单列表项目
一、前言 很多时候需要有一个控件,能够替代容器控件,自动容纳多个widget,自适应宽高,然后提供滚动条功能,这就必然需要用到QScrollArea控件,可设置各个子面板的间距等,也在很多系统中用到,比如温湿度设备面板...,有几百个温湿度设备,需要一个容器放置,自动产生滚动条,可以设置面板的固定宽高或者自适应拉伸,其实就是放了表格布局+弹簧来设置。...在后期的Qt内置控件的研究过程中,发现QListWidget也提供了类似的功能,所以后期有部分应用场景直接采用QListWidget来做。...二、实现的功能 1:可设置标题栏文字/高度/字体/对齐方式/颜色 2:可设置边框宽度/边框圆角角度/边框颜色 3:可设置报警颜色切换间隔/报警加深颜色/报警普通颜色 4:可设置启用状态和禁用状态时文字和边框颜色.../高度/字体/对齐方式/颜色 * 2:可设置边框宽度/边框圆角角度/边框颜色 * 3:可设置报警颜色切换间隔/报警加深颜色/报警普通颜色 * 4:可设置启用状态和禁用状态时文字和边框颜色 */
文章头图 Banner 文章头图可以在文章页最下方自定义字段的第一项:Banner这里设置。 设置后,文章页标题上方将会显示横幅图片。...启用云存储优化后,样式丢失了 / 样式错乱 / 页面错乱 该问题可能因为 云存储回源配置错误。 云存储中,镜像 / 回源的设置应该为博客的地址。...文章主图副标题 字段名:mastheadSubtitle 自定义展示在文章大图内的副标题(展示在标题下方) 文章主图标题颜色 字段名:mastheadTitleColor 设置展示在文章大图内的标题及副标题的颜色...,默认为白色,在文章标题颜色与图片冲突时可以使用 对齐方式 字段名:textAlign 设置文章或独立页面的对齐方式,值有left、center、right、justify,默认为justify(两端对齐...如将标题放置在左下角: #masthead { text-align: left; } .align-middle .inner { vertical-align: bottom; }
属性:定义要修改的样式特性(如颜色、大小等),它就是css的“基础函数”。 值:给属性赋予具体的值。 示例: p>This is a paragraph....作用轴:用于调整 子元素在交叉轴(通常是垂直方向)上的对齐。 使用场景:容器中的子元素在单行/单列的情况下如何对齐。 典型值: flex-start:子元素与交叉轴起点对齐。...align-content 属性 应用场景:align-content 主要用于 Flexbox 和 Grid 布局中,作用是当有多行或多列内容时,定义这些行或列在容器的交叉轴上的对齐方式。...text-align 属性 应用场景:text-align 主要用于文本对齐,它决定了 行内元素 或 块级元素中的文本 如何在水平方向对齐。...示例: p { text-align: center; } 在这个例子中,所有 p> 标签中的文本会在水平方向上居中对齐。