和h3标签的默认外边距*/ } 3、修饰h3中的文字样式 .product p.describe{ font-size:16px ;/*字体大小*/ font-weight...当然里添加的高度也是为了方便看效果,后面我们也会删除。...> 3、实现效果 第八步、添加a超链接,实现页面跳转 添加了超链接之后,页面中的文字就添加了下划线,同时h3中的文字颜色也发生了改变,那下一步我们就来修正下这些细节...(1)清除a标签的默认下划线样式 a{ text-decoration: none;/*去掉下划线*/ } (2)给h3标签中的文字加上颜色 .product .product-text h3...当转换为块级元素后,效果如下,一切正常 2、运行代码 body,p,h3{ margin:0px;
开始标签 结束标签 两者之间时标签的内容 标签是可以嵌套的 一个标签的内容可以使其他一个或者多个标签,这些标签构成了一个“树形结构” 可以在开始标签中,给标签赋予属性。...(这个功能叫做emment快捷键,主流的开发工具都有、WebStorm和idea都有) 二.HTML中的标签 1.注释标签 代码的注释,HTML的注释和一般的语言的注释差别很大。 <!...: 5.格式化标签 格式化标签有变粗,倾斜,删除线,下划线。...-- 下划线 --> 下划线 下划线 效果: 6.图片标签:img 网页上,是可以显示图片的。....jpg"> 7.超链接标签 超链接标签:a “链接”link(快捷方式) “超”链接跳转到的页面,可以使当前网站之外的。
head 和 body 是 html 的子标签(html 就是 head 和 body 的父标签) title 是 head 的子标签. head 是 title 的父标签. head 和 body...p> 2.5 格式化标签 描述 标记 加粗 …… 倾斜 …… 删除线 …… 下划线...1 删除线2 下划线1 下划线2 2.6 图片标签 img 标签 必须带有 src 属性, 表示图片的路径 img...img src="1.jpg"alt="hello" title="鬼灭之刃" width="1000px" hight="1300px" border="5px"> 2.7 超链接标签 a 标签的属性...会居中加粗 thead 表格的头部区域(注意和 th 区分, 范围是比 th 要大的) tbody 表格得到主体区域. 这些属性都要放到 table 标签中.
4、换行标签 5、div 标签 和 span 标签 九、文本格式化标签 ( 加粗 | 斜体 | 下划线 | 删除线 ) 十、标签属性 十一、图像标签 十二、链接标签 十三、注释标签 十四、文件路径...> 展示效果 : 2、段落标签 HTML 中的段落标签使用 p> 表示 , 段落内容在 开始标签 p> 和 结束标签 p> 之间 ; p> 段落内容 p> 将下面的文字分成 2...| 删除线 ) ---- 文本格式化标签 : 对文字设置 粗体 , 斜体 , 下划线 , 删除线 效果 ; 粗体效果 : 下面两种标签都能实现 粗体效果 , 在 XHTML 中推荐使用 当图片无法显示时 , 显示该文本 ; title 属性 : 属性值是 文本字符串 , 作用是 鼠标在图片上悬停时 , 显示该文本 ; width 属性 : 属性值是 像素数值 , 作用是..., 这些文件都需要通过不同的目录层级进行整理存放 ; 访问文件时 , 需要使用 文件路径 进行访问 , 文件路径 分为 相对路径 和 绝对路径 ; 文件准备 : 以 D 盘下的 HTML 目录作为项目的根目录
p> 用来分段用的 空格标签   有几个空格就写几个  标题标签 :#=1~6 1~6个标题,就是大小粗细递减,再写7啊8啊的就没啥区别了,看不出来不同了 图片标签 img...– 注释内容 –> 和备注一样类似于C#的 //注释 , vb中的 ‘注释 效果一样 文档格式标签 水平线 效果就是一条线 拆行 在句子中间出现,它后面的句子就会另起一行...p> 快乐是快乐的方式 快乐是快乐的方式 h3>快乐是快乐的方式h3> 快乐是快乐的方式 快乐是快乐的方式 下划线 / 上下标 删除线 粗体 意大利斜体 打字机文本 下划线的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
学习了一些html的基本用法,代码和效果如下: 1 p>下面是插入链接p> 17 18 p>中间加入了一个水平线p> 19 20 p>这里测试换行符p> 21 22...59 例如这里缩进了,最后输出也是缩进了 60 字体有点小,加大一行 61 62 p>删除标签没事来设置字体样式p> 65 66 这里是网页的名称 这里是h1 这里是h2 这里是h3 这里是h4 这里是h5 这里是h6 下面是插入链接 ---...字体有点小,加大一行 删除标签下划线 ---- 没事来设置字体样式
当text-align设置为"justify",每一行被展开为宽度相等,左,右外边距是对齐(如杂志和报纸)。 的角度看 text-decoration属性主要是用来删除链接的下划线: 的样子p> wwwwwwwwwwwwwwwwww p>去掉下划线p> This is heading 3h3> 注:不建议强调指出不是链接的文本,因为这常常混淆用户。...3. text-transform文本转换 text-transform文本转换属性是用来指定在一个文本中的大写和小写字母。 uppercase:转换为全部大写。
常用取值 center :居中对齐 left :左对齐 riight :右对齐 文本装饰 text-decoration: [值] ; 常用取值 underline 下划线...none 啥都没有,可以给a标签去掉下划线 overline 上划线 line-through 删除线 居右h3> p> Lorem ipsum dolor sit amet consectetur adipisicing elit....>居右h3> p> Lorem ipsum dolor sit amet consectetur adipisicing elit..../> img src="Yuankui_Pagoda.png" alt="Load Fail" width="200px" /> img src="Meizhou.gif
小字 s删除线 u下划线 列表标签 无序列表: ul:type li 有序列表: ol:type start reversed li 列表嵌套: 有序和无序可以任意无限嵌套 图片标签img src:路径...相对路径:访问站内资源时使用 图片和页面在同一目录: 直接写图片名 图片在页面的上级目录时:…/图片名 图片在页面的下级目录时:文件夹名/图片名 。。。...… 绝对路径:访问站外资源时使用, 称为图片盗链,可以节省本站资源,但是有找不到图片的风险 alt: 图片不显示时显示的文本 title: 鼠标在图片上悬停时显示的文本 width/height: 两种赋值方式...: 在单独的css样式文件中写样式代码,通过link标签引入,好处:可以多页面复用,可以将html和css代码分离开 选择器 标签名选择器 格式: 标签名{样式代码} 作用: 选取页面中所有同名标签 id...,共占一行,不能修改宽高 包括:span b i small s u 超链接a inline-block:行内块元素,共占一行,也可以修改宽高: 图片img input 文本和字体相关样式 *水平对齐方式
(以下为示例) 37 p>页面的样式表是非必要的。当有页面样式表时,页面的样式表中的样式规则会层叠覆盖 app.wxss 中的样式规则。...当有页面的配置文件时,配置项在该页面会覆盖 app.json 的 window 中相同的配置项。如果没有指定的页面配置文件,则在该页面直接使用 app.json 中的默认配置。...(以下为示例) 68 p>页面的样式表是非必要的。当有页面样式表时,页面的样式表中的样式规则会层叠覆盖 app.wxss 中的样式规则。...当有页面的配置文件时,配置项在该页面会覆盖 app.json 的 window 中相同的配置项。如果没有指定的页面配置文件,则在该页面直接使用 app.json 中的默认配置。...(以下为示例) 119 p>页面的样式表是非必要的。当有页面样式表时,页面的样式表中的样式规则会层叠覆盖 app.wxss 中的样式规则。
标题二级 h3>...h3> 标题三级 ... 标题四级 ... 标题五级 ...... 标题六级 水平分割线 p>...p> 段落 ... 预格式化 ...... 链接 换行 ... 加粗 ... 加粗 img > 图片 ...... 删除线 ... 下划线 ... 文本框 ...... 下拉列表 ·块级元素 1.总是从新的一行开始 2.高度、宽度都是可控的 3.宽度没有设置时,默认为100% 4.块级元素中可以包含块级元素和行内元素 ·行内元素 1.和其他元素都在一行
DOCTYPE html> head标签用于定义文档的头部。 文档的头部描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等。...body 元素包含文档的所有内容(比如文本、超链接、图像、表格和列表等等。) 它会直接在页面中显示出来,也就是用户可以直观看到的内容。 在标签中添加属性:align="left | center | right" 默认居左 段落 段落是通过p>标签定义的 p>这是一个段落 p> p>这是另一个段落p> 换行...: 一个未访问过的链接显示为蓝色字体并带有下划线。...访问过的链接显示为紫色并带有下划线。 点击链接时,链接显示为红色并带有下划线。
内部样式表 当单个文档需要特殊的样式时,就应该使用内部样式表。...从设计的角度看text-decoration属性主要用来删除链接的下划线: a {text-decoration:none;} 一个例子: 时 */ 常见的链接样式 文本修饰 text-decoration 属性主要用于删除链接中的下划线: a:link {text-decoration...背景颜色添加到链接中显示链接的区域p> p>注意,整个区域是可点击的链接,而不仅仅是文本。...背景颜色添加到链接中显示链接的区域p> p>注意,整个区域是可点击的链接,而不仅仅是文本。
文本 这里是粗体 这里是斜体 what 这里还是斜体 插入字体,下划线 删除线 下标&&上标 H2O2 嗯我飘了 #include...如果只能滋生瞑想和幻想的话,即使再大的才能也只是砂地或盐池,那上面连小草也长不出来的。...-- more --> p>倚天屠龙记p>p>张无忌p>p>这是另一段p> ## 锚点 这是我的个人博客 <...; } 正常字 小号字 短引用,双引号包围 长引用 土地是以它的肥沃和收获而被估价的;才能也是土地,不过它生产的不是粮食,而是真理。...如果只能滋生瞑想和幻想的话,即使再大的才能也只是砂地或盐池,那上面连小草也长不出来的。
学习路线图片HTMLBS架构示意图图片HTML中的基础标签 这是网页的标题 你好,HTML p>这是一个段落p> p>这是第二个段落p> img src = "imgs/girls.jpg...:,是开始标签,是结束标签title表示网页的标题可以在meta中设置编码格式br/表示换行标签,br是一个单标签:开始标签和结束标签是同一个,斜杠放在单词后方...p> 表示段落标签img 标签是图片标签,width和height表示图片的宽和高alt表示图片的提示h1- h6为标题标签列表标签:ol 有序列表 type 表示显示的类型:A a I i 1, start...表示从几开始;ul无序列表,type disc(default),cicle、squareu 下划线,b 粗体,i 斜体上标 sup 下标 sub实体标签span标签,不换行的块标记a 表示超链接href
预期效果 所以今天是实操课,我们一起基于基础的HTML和CSS知识,完成一个博客首页的开发。...先把所有的模块的内容使用html语法,完成编写。 使用到了html的 标题标签、链接标签、段落标签、图像标签和div标签(每个div就对应布局中的一个模块)。 <!...80% */ height: 80%; /* 图片高度为80% */ } 最终效果 最后删除调试时,增加的div 背景色,为文章内容模块和广告栏增加边框阴影,完成最终样式: .items {...*/ } } 完整的代码 最终的代码还包括导航栏的字体显示格式调整,链接标签之间的间距调整等。...nav a { color: black; /* 导航栏内链接的颜色设置为黑色. */ text-decoration: none; /* 导航栏内链接的下划线设置为无
元素是文档结构的根基,在文档表现中元素起分区和修饰等作用。 Html常见元素:p、table、span、a、div等。 2. 元素的种类?...元素对于css来说分为两种类型:置换元素和非置换元素。 置换元素:置换元素内容的部分不由文档内容直接表示,而是尤其它(图片、视频、链接等)文件替代(例:img置换元素)。...块级元素:生成一个填满父级元素内容区域的框,旁边不能有其他元素,换句话说块级元素在元素框的前后都“断行”。例如:p和div元素都是最常见的块级元素。... 链接 换行 ... 加粗 ... 加粗 img > 图片 ...... 删除线 ... 下划线 ... 文本框 ...
定义插入字 定义删除字 上标 下标 p> 定义项目 链接、锚点、图片 This is a Link 这是一个在 div 元素中的标题。...h3> p>这是一个在 div 元素中的文本。p> p>some text....p> 框架 p>您的浏览器不支持 iframe 标签。p>
注释不会再浏览器中显示。 在 VS Code 中,添加 / 删除注释的快捷键:Ctrl + / 的文本格式:加粗、倾斜、下划线、删除线等。 提示:strong、em、ins、del 标签自带强调含义(语义)。...10-图像标签 作用:在网页中插入图片 img src="图片的 URL"> src用于指定图像的位置和名称,是 img> 的必须属性。...p> img src="....另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用(SPA)提供驱动。
删除线 ... 下划线 ... 文本框 ......注意: 段落元素(文字元素)内不能放块元素 例如,p标签里不能放div标签,h1中也不能放div ... ...... 标题二级 h3>...h3> 标题三级 ... 标题四级 ... 标题五级 ...... 3.行内块元素 特点: 和相邻的行内元素(包含行内块)在一行上,它们直接会有空白缝隙; 一行可以显示多个; 默认宽度就是内容的宽度; 高度、宽度、内外边距都可以自定义; 注意了:...img是一个可替换元素。
领取专属 10元无门槛券
手把手带您无忧上云