前言
学web前端也学了好几天了，记一次这几天学的基础知识，避免遗忘。
代码
Html：
<!DOCTYPE html>
<html lang="chinese">
<head>
<title>王树宇</title>
<!--下面是从外部文件调用css代码-->
<link rel="stylesheet" type="text/css" href="css/main.css">
<!--下面是定义网站的编码，否则可能会出现乱码-->
<meta charset="utf-8">
<!--下面是适配移动端，做到自适应屏幕尺寸-->
<meta name="viewport" content="width=device-width,initial-scale=1.0 ">
<!--下面是搜索引擎蜘蛛能搜索到的地方-->
<meta name="keyword" content="王树宇，服务器，虚拟主机，web端收录，SEO nb">
<meta name="description" content="这是一个SEO元描述的地方">
<meta name="author" content="Paword by Grant Wang">
<!--link链接到其他css，js文件-->
<link rel="stylesheet" type="text/css" href="css/link.css">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<!--下面是全局基准的URL，其他的链接都会以这个来作为基准链接，只影响相对路径，不影响绝对路径-->
<base href="" target="_blank">
<!--下面是JavaScript语句，已存为独立JS文件-->
<!--<script>
document.write("www.not404.cn")
</script>-->
<!--设置浏览器打印的时候输出的样式-->
<style media="print">
h1{
color: black;
}
p{
color: #000000;
}
</style>
<!--设置单元格的样式-->
<style>
table,td,th{
border: black;
}
</style>
<!--设置列表的样式-->
<style>
ul.no {list-style-type: armenian}
ol.have {list-style-type: circle}
</style>
</head>
<body>
<h1>记Html基础知识</h1>
<h2>自适应页面</h2>
<!--下面是abbr属性，目的是为了解释一个或一段文字-->
<h2>abbr解释文字的使用</h2>
<p><abbr title="这是解释文字哦~~">abbr标签用于解释一串文字</abbr></p>
<!--下面是address标签的使用-->
<h2>address标签的使用</h2>
<address>
<strong>联系我们(这是一个address标签)<br></strong>
<p>姓名：王树宇</p>
<p>地址：地球某处</p>
<p>电话：不是110就对了</p>
</address>
<!--下面是一个ruby标签的使用-->
<h2>ruby拼音注释的使用</h2>
<ruby>魑 <rp>(</rp><rt>chī</rt><rp>)</rp></ruby>
<ruby>魅 <rp>(</rp><rt>mèi </rt><rp>)</rp></ruby>
<ruby>魍 <rp>(</rp><rt>wǎng </rt><rp>)</rp></ruby>
<ruby>魉 <rp>(</rp><rt>liàng </rt><rp>)</rp></ruby>
s
<!--下面是一个bdo标签的使用-->
<h2>bdo顺序样式的使用</h2>
<p><bdo dir="rtl">这是bdo标签在设置成rtl之后的效果</bdo> </p>
<!--下面是del和ins元素的实现-->
<h2>del和ins过时文本和更新文本的使用</h2>
<p>旧的域名:<del>www.wangshuyu.club<br></del>新的域名：<ins>www.not404.cn</ins></p>
<!--下面是u标签的实现，下划线，是指拼写错误的文本-->
<h2>u标签划去错误文本的使用</h2>
<p>古人认为<u>“天圆地方”</u></p>
<!--下面是mark元素的实现，效果像一个荧光笔一样产生标记-->
<h2>mark荧光笔重点标记样式的使用</h2>
<p>这是<mark>重点</mark></p>
<!--下面是sub元素和sup元素的实现,主要目的写一些化学方程式的时候使用，其中sub是下标，sup是上标-->
<h2>sub和sup上标下标样式的使用</h2>
<p>My+ZnSO<sub>4</sub>=MySO<sub>4</sub>+Zn</p>
<p>E=mc<sup>2</sup></p>
<!--下面是smell标签的使用，作用是使得字体被缩小-->
<h2>smell字体样式标签的使用</h2>
<p>XX活动<br><small>本活动解释权归XXX所有</small></p>
<!--下面是ul和li标签的使用，主要是构建一个列表，包含有序列表和无序列表两种,上面定义了列表的css样式-->
<h2>列表的使用</h2>
<h3>无序列表</h3>
<ul class="no">
<li>这是第一条</li>
<li>这是第二条</li>
<li>这是第三条</li>
</ul>
<h2>有序列表</h2>
<ol class="have">
<li>这是第一条</li>
<ul>
<li>这是第一条里嵌套的的一条</li>
</ul>
<li>这是第二条</li>
<li>这是第三条</li>
</ol>
<!--下面是表格（table）的相关代码，使用tr,th和td组成，上面使用了css做了单元格的边框-->
<h2>表格的使用</h2>
<table class="table">
<tr>
<th>生活</th>
<th>美食</th>
<th>一段废话</th>
</tr>
<tr>
<td>骑自行车</td>
<td>捉虾</td>
<td>emm，这算废话吗？</td>
</tr>
<tr>
<td>西红柿鸡蛋</td>
<td>咖喱饭</td>
<td>连吃的都附带有废话的属性</td>
</tr>
</table>
</body>
</html>CSS：
body{
/*background-image: url("../img/text.jpg");*/
}
h1{
color: #ac2d73;
text-align: center;
}
h2{
color: #0395fc;
}
h3{
color: #737373;
}
p{
color: #0032ff;
}
a{
/*设置缩进*/
text-indent: 32px;
/*设置字体尺寸*/
font-size: 16px;
/*设置行高*/
line-height: 32px;
color: #42ff00;
background: #ff2300;
}
img{
position: absolute;
left: 50%;
}body{
text-align: left;
background: #f8f8f8;
}
.scale img{
background-size:cover;
width:100%;
height: auto;
}JavaScript：
/*document的使用*/
document.write("www.not404.cn");要点
知识挺零碎的
退出登录？