文本格式化属性 3.字体样式 1.属性 font-style: 2.取值 1.normal(默认的...overline 上划线 line-through 删除线 #p1{ text-decoration:none;/*正常显示*/ } #p2{ text-decoration...line-through; /*line-through删除线*/ } 正常显示 正常显示的文字 下划线这是展示下划线 上划线 <p id="...background-color: orange; border: 1px solid purple; line-height:320px;/*当行高和<em>元素</em>块<em>的</em>高一致时,<em>元素</em>内文字将居中显示 其他<em>的</em>将会显示在<em>元素</em>块之外...line-height<em>的</em>取值表示在<em>元素</em>块一个宽度满之后,换行后与前一行<em>的</em>距离*/ } 行高和<em>元素</em>块一致<em>的</em>结果图像 ? 行高<em>的</em>作用效果: ?
伪类选择器:hover display:none 隐藏 display:block 显示 placeholder:显示内容点击就会删除 values:显示内容点击不会删除 cursor:pointer(...隐藏内容 display:block(块级元素) inline(行级元素) none(隐藏) inline-block:将行级元素转为一行显示的块级元素 行级元素:没有宽和高 ---- CSS整理版 大小...: underline;}(下划线) overline;(上划线) line-through;(删除线) blink;(闪烁) 常用字体: (font-family) “Courier New”, Courier...:line-through; /加删除线/ text-decoration: overline; /加顶线/ text-decoration:underline; /加下划线/ text-decoration.../ a:link /超链接文字格式/ a:visited /浏览过的链接文字格式/ a:active /按下链接的格式/ a:hover /鼠标转到链接/ 鼠标光标样式: 链接手指 CURSOR: hand
可以给文本添加下划线、删除线、上划线等 语法: 选择器 { text-decoration: 属性值; } 属性值 解释 none 默认。...没有装饰线 underline 下划线 overline 上划线 line-through 删除线 代码 <!...{ text-decoration: overline; } .line-through { text-decoration...语法: 选择器 { text-indent: px; } 通过设置该属性,所有元素的第一行都可以缩进一个给定的长度,甚至该长度可以是负值。 代码: <!...em; } em 是一个相对单位,就是当前元素(font-size) 1 个文字的大小, 如果当前元素没有设置大小,则会按照父元素的 1 个文字大小。
笔记author: 喵雨date: 2022-06-19 09:51:17coverImg:---colordiv { color: red;}text-aligntext-align用于设置元素内文本内容的水平对齐方式...div { text-align: center; center 居中对齐 left 左对齐 right 右对齐}text-decoration装饰文本规定添加到文本的修饰,可以给文本添加下划线...没有装饰线 uderline 下划线,链接a自带下划线overline 上划线 line-through删除线 div...{ text-decoration: underline line-through overline;}a { /*取消下划线*/ text-decoration: none;}文本缩进...;}/*em是一个相对单位,就是当前元素1个文字的大小,比方说,这个段落的文字大小是16px,那么1em就是16px,2em就是32px,这样就自然形成了咱们汉字的首行缩进效果了*/line-height
标题图 Day3:html和css 多类名选择器 样式的显示效果是跟html元素中的类名先后顺序无关,而是跟css样式的书写上下顺序有关. <!...效果 textOdecoration文本的修饰 值 说明 none 默认 underline 文本下的一条线 overline 定义文本上的一条线 line-through 定义穿过文本下的一条线...上划线*/ /*text-decoration: line-through; 删除线*/ font-style: italic; } s {...text-decoration: none; /* 取消删除线*/ } em { font-style: normal; } strong {...行内元素的特点.png ? 块级元素的特点.png 行内块元素(inline-block) ?
删除线可以应用于 span 元素、段落、div、显示内联块或任何其他需要文本修饰的元素。除了下划线、斜体和粗体,CSS 删除线也是通过 HTML 元素传达信息的好方法。...什么是 CSS 删除线?CSS 删除线实际上是指“文本装饰:划线”。但它可以称为罢工,因为它的 HTML 版本是罢工。line-through 是一种文本装饰,它在文本中添加一条线以将其取消。...CSS 中的文本装饰是通过向元素添加 text-decoration 属性来使用的。此属性的可能值如下:• 下划线。在文本下方添加一行。• 上划线。在文本上添加一行。• 直通。在文本中添加一行。...如果你想从你的文本中删除 CSS 删除线,你可以为 text-decoration 属性使用 none 值。这将从您的文本中删除任何删除线。你能在 CSS 中使用多个文本装饰吗?...您想了解更多有关如何使用 CSS 格式设置的信息吗?删除线很棒,但它们只是开始。考虑查看 CSS 的其他元素。
text-decoration属性 .div1 a:nth-of-type(1){ text-decoration: underline; } .div1 a:nth-of-type...(2){ text-decoration: overline; } .div1 a:nth-of-type(3){ text-decoration: line-through; }... 上划线:overline 删除线:line-through 念和业务经营模式得到了社会的广泛 ?...阴影效果在浏览器里是全支持的,可以放心使用。first-line这个伪元素,指的是一行所在的文本,并非一个p或h*标签里面的全部文本。 练习:使用阴影实现首字母索引效果 原效果: ?
, 所有的特定后代标签, 也就是会选中儿子/孙子…, 只要是被放到指定标签中的特定标签都会被选中 | 子元素选择器只会选中指定标签中, 所有的特定的直接标签, 也就是只会选中特定的儿子标签 交集选择器...:only-child 选中父元素中唯一的标签 :nth-child(odd) 选中同级别中的所有奇数 :nth-child(even) 选中同级别中的所有偶数 同类型的第几个 :first-of-type...格式:text-decoration: underline; 取值: underline 下划线 line-through 删除线 overline 上划线 none 什么都没有, 最常见的用途就是用于去掉超链接的下划线...快捷键: td text-decoration: none; tdu text-decoration: underline; tdl text-decoration: line-through; tdo...文本级的标签 span p buis strong em ins del ... 在CSS中CSS也将所有的标签分为两类, 分别是块级元素和行内元素 什么是块级元素, 什么是行内元素?
css知识点范围:常用属性 删除线:text-decoration : line-through 下划线:text-decoration : underline 斜体:font-style : italic...缩进:text-indent : 2em,em是文字的两倍大小; 伪类选择符:a : hover{} 鼠标滑过会有变化; class = “a b” 设置两个样式:.a{}设置颜色; .b{}设置字体...: 50px 块级元素:可以将行内元素设置为块级元素,一个块级元素独占一行。...设置为块级元素就可以设置宽和高等很多值了,默认的宽度为父容器的宽度。...display : block升级为块级,display : inline降级为内联,还有inline-block内联块级元素,这是个介于两者之间的一种类型; 块级元素具有盒子模型特征,有padding
在这些地方换行 和标签 details用来对显示在页面的内容做进一解释里面;接着是标题,这里面的内容一般简短,具有总结性,会展示在页面;细节一开始是隐藏的...pubdate 指示 元素中的日期 / 时间是文档(或 元素)的发布日期。...break-word 在长单词或 URL 地址内部进行换行 @font-face 允许你输入自己的字体出现在网站上,即使在特定的字体在访问者的计算机上没有安装。...文本装饰 none underline overline line-through删除线 text-align 水平对齐方式 left right center text-indent 首行缩进 建议使用...em white-space 空白符处理 normal pre 预格式化 nowrap空格空行无效
css的规范属性,需要组合上面两个属性使用 text-overflow: ellipsis; //可选属性,可以用来多行文本的情况下,用省略号“…”隐藏超出范围的文本。...text-decoration: none 标准的文本 underline 文本下的一条线 overline 文本上的一条线。...line-through 穿过文本下的一条线 blink 闪烁的文本 inherit规定应该从父元素继承 text-indent:length 定义固定的缩进。...默认值:0 % 基于父元素宽度的百分比的缩进 inherit 规定应该从父元素继承 text-indent 属性的值。 white-space:normal 默认。...本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
作用 通过类名,找到页面中所有带有这个类名的标签,设置样式。 注意点 1. 所有标签上都有class属性,class属性的属性值称为类名(类似于名字); 2....(文本的父元素)设置。...文本 ;2. span标签、a标签,3. input标签、img标签 5.3 文本修饰 属性名 text-decoration 取值: underline 下划线line-through 删除线overline...上划线none 无装饰线 注意点 开发中会使用 text-decoration : none ; 清除a标签默认的下划线 underline 下划线 line-through 删除线 overline...上划线 none 无装饰线 注意点 开发中会使用 text-decoration : none ; 清除a标签默认的下划线 若有收获,就点个赞吧
none:无划线 overline:上划线 underline:下划线 line-through:删除线 示例: 没有文本划线...style="text-decoration: line-through;">我有删除划线 效果: 文本对齐 设置文本的水平对齐方式。...pre:保留空白字符,但不合并连续的空白字符,文本按照源代码格式显示。 pre-line:保留换行符,合并连续的空白字符,其他空白字符按照正常规则处理。...hidden:文本溢出时,会被隐藏。 scroll:文本溢出时,会显示滚动条,用户可以滚动文本来查看全部内容。 auto:文本溢出时,会根据元素的宽度和高度来决定是否显示滚动条。...bolder: 相对于父元素更粗的字体。 lighter: 相对于父元素更细的字体。 数字值:使用数字值来设置字体的粗细,数字值范围通常从 100 到 900。
underline 定义文本下的一条线。 overline 定义文本上的一条线。 line-through 定义穿过文本下的一条线。 blink 定义闪烁的文本。...inherit 规定应该从父元素继承 text-decoration 属性的值。...元素最重要的属性是 href 属性,它指示链接的目标。...在所有浏览器中,链接的默认外观是: 未被访问的链接带有下划线而且是蓝色的 已被访问的链接带有下划线而且是紫色的 活动链接带有下划线而且是红色的 那么a标签有href的时候如何去掉下划线呢 a:link...{ text-decoration:none; /* 指正常的未被访问过的链接*/ } a:visited{ text-decoration:none; /*指已经访问过的链接
后代选择器 **选择器1 选择器2{}**会找到选择器1下的选择器1的所有后代 子元素选择器 选择器1>选择器2{}选择器1下的所有子标签符合选择器2的条件 交集选择器 选择器1选择器2{} 相邻兄弟选择器...height 用于设置边框的高度 background-color 用于设置背景的颜色 布局 浮动文档流 格式 选择器{float:属性值} none:元素不浮动 left:元素向左浮动 right...在块结束的时候会自动换行 常见的块级元素有h系列、p、div、ul等 常见的行内元素有span、a等不会自动换行 格式 选择器{display:属性值} 常见属性值: block:将元素显为块状元素(块状元素的默认属性值...) inline:将元素显示为行内元素(行内元素的默认属性值) inline-block:行内块标签 none:此元素将被隐藏,不显示,也不占用页面空间 字体 font-size用于设置字体大小,取值是像素...(下划线) line-through(删除线) overline(上划线) **none(什么都没有)**可以用none去掉a标签的下划线 css盒子模型 所有的html元素,我们都可以看作一个四边形,
当您想将特殊格式应用于段落或标题的初始字符时,它会派上用场。...您可以使用此伪元素将特定样式应用于段落或标题的起始行。...这是一个例子: p::first-line { font-weight: bold; text-decoration: underline; } ::marker 伪::marker元素以列表项的标记为目标...使用此伪元素,您可以自定义标记的外观。...这是一个例子: p::grammar-error { text-decoration: line-through; color: red; } p::spelling-error { text-decoration
CSS样式表的样式主要可以分为大小,背景,字体,对齐方式,边界边框,列表方块,格式布局等。... none;去掉下划线 line-through;删除线 text-indent:首行缩进,特殊情况可以使用负号 文字对齐方式: <!...格式与布局: 格式与布局比较复杂难以理解 position: ?...在原本应该出现的位置偏移。 需注意的是,只要加了position,该元素就和其他元素不在同一层了,原本被挤下去下面的元素就会浮上来。...display:none隐藏 block显示 隐藏不占位置 visibility:hidden 隐藏 visible 显示 隐藏占位置 overflow:hidden; 超出部分隐藏 需要注意的是
: 文字修饰(underline下划线,overline上划线,line-through删除线) text-align:文字对齐方式(left左,right右,center居中,justify两端对齐)...text-indent:段落缩进 line-height:调整行高 text-transform:转换英文大小写(lowercase所有小写,uppercase所有大写,capitalize首个大字母大写...用于把所有用于列表的属性设置于一个声明中 list-style-image 将图象设置为列表项标志。 list-style-position 设置列表中列表项标志的位置。...边框颜色 外边框 outline-color: 颜色 outline-style: 轮廓样式 outline-width: 宽度 隐藏元素 display:none 隐藏的元素不会占用任何空间 visibility...:hidden 隐藏的元素仍需占用与未隐藏之前一样的空间 定位 postion: absolute(绝对定位),其位置相对于最近已定位的父元素,如果元素没有已定位的父元素那么它的位置相对于 static
6 种 font-size 可用取值 像素(pixel) font-size: 20px; em: 相对于父元素的 font-size font-size: 1.2em; rem: 相对于根元素的...font-variant: normal; 还有一个值可选: small-caps font 简写 注意 font 所有属性都是可继承的属性。...4 种可选取值 none: 移除所有装饰线样式。...text-decoration: none; underline: 下划线样式 text-decoration: underline; line-through: 中划线样式 text-decoration...: line-through; overline: 上划线样式 text-decoration: overline; text-overflow text-overflow 属性定义文本溢出时的行为
font 在一个声明中设置所有字体属性。...font-variant font-variant 属性设置小型大写字母的字体显示文本,这意味着所有的小写字母均会被转换为大写,但是所有使用小型大写字体的字母与其余文本相比,其字体尺寸更小。...text-decoration 文本的修饰。....text{ text-decoration: none | underline | overline | line-through | blink | inherit; } text-decoration...inherit 规定应该从父元素继承 text-decoration 属性的值。
领取专属 10元无门槛券
手把手带您无忧上云