前端基础-01-html标签

来源:互联网 发布:风险加权资产计算法 编辑:程序博客网 时间:2024/06/10 16:01

前端基础-html标签

先来看一个Html模板

<!DOCTYPE html><!--文档类型--><html lang="en"><!--根标签--><head><!--网页头部-->    <meta charset="UTF-8">  <!--编码格式-->    <title>HTML模板</title></head><body><!--可视化区域  网页主体--></body></html>

HTML命名规范

HTML书写规范:1.名字用小写字母2.以英文开头,可以包含英文字符、数字、_、-,不能使用中文3.驼峰命名4.id命名:id只能有一个名字,而且在页面中相同的名字只能出现一次,相当于身份证号码5.class命名:class可以出现多次

Html常用标签学习

# 1. h1-h6标题标签<h1>我是H1标签</h1> <!--一般H1标签只会有一个,有利于搜索--><h2>我是H2标签</h2><h3>我是H3标签</h3><h4>我是H4标签</h4><h5>我是H5标签</h5><h6>我是H6标签</h6>#2.p标签,段落标签<p>Python 的创始人</p>#3.strong标签,加粗标签<strong id="box">我是strong加粗的标签</strong> <!--不仅能加粗,还有力搜索引擎搜索-->#4.b标签,加粗标签<b>我是b标签加粗</b><!--只是物理加粗-->#5.em标签,斜体标签<em>我是斜体的</em><!--强调斜体,还有力搜索引擎搜索-->#6.i标签,斜体标签<i>我是斜体i标签</i><!--斜体作用-->换行标签#7.br标签,换行标签<br/>#8.hr标签,水平线标签<hr/>#9.特殊符号<p>    小于号: &lt; <br/>    大于号:&gt; <br/>    空格符号:12&nbsp;34<br/>    空白位:12&emsp;&emsp;&emsp;&emsp;34<br/>    &字符:&amp;<br/>    版权符号:&copy;<br/></p>#10.a标签<a href="http://www.baidu.com" target="_self" > 百度</a> <br/>  <!--超链接--><a href="#">#刷新当前页面</a> <br/> <!--刷新页面--><a href="javascript:void (0)">死链接</a><br/><!--死链接--><a href="#box">锚点</a> <br/><!--    只有a标签才有name属性    其他标签要使用锚点,需要通过id属性跳转   target属性,_blank新的页面打开   _self当前页面打开-->#锚点跳转的页面,name属性<a href="javascript:void (0)" name="box">我是最前面的a标签</a>#11.img标签<img src="https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=594559231,2167829292&fm=27&gp=0.jpg"     alt="百度图片"     width="100" height="100"><!--src 图片的路径alt 图片的描述width 宽度height 高度-->#12.无序列表<ul type="circle">    <!--    disc  默认:小黑圆点    circle 空心圆    square 小方框    -->    <li>无序列表1</li>    <li>无序列表2</li>    <li>无序列表3</li>    <li>无序列表4</li></ul>#13.有序列表<h2>有序列表</h2><ol type="I" reversed start="2">    <!--    1 1 2 3 4    a a b c d    A A B C D    reversed  降序升序    start 起始位置    -->    <li>有系列表1</li>    <li>有系列表2</li>    <li>有系列表3</li></ol>#14.dl、dt列表<dl >    <dt>列表1</dt>    <dt>列表2</dt>    <dt>列表3</dt></dl>#15.div块元素<div style="display: inline-block">    我是一个块级元素</div>#16.行内元素<span>        我是span元素</span><!--审查元素是块级和行内元素 ,通过google浏览器->F12->Computed(inline和block)块级元素 (div)    独占一行,支持设置宽高    如果没有设置宽高,高度由内容,宽度是浏览器的宽度    没有内容,在网页上是看不到的,元素是高度是0,宽度是浏览器的宽度行内标签:(内联)元素 (span)    可以和其他行内元素位于同一行    不支持设置宽高    内容撑开宽高display:1.inline 行内元素2.inline-block   行内块元素3.block  块级元素4.none  隐藏元素,包含他的子标签,在页面中不占宽高-->
原创粉丝点击