这篇文章讲述了,前端的基础知识,包括HTML,CSS,测试的同学或者前端入门的同学可以看看此文
HTML是超文本标记语言,它不是一种编程语言,而是一种标记语言,标记语言是一套标记标签,使用标记标签来描述网页,HTML文档也叫做Web页面
来解析一下这段代码的意思
<!DOCTYPE html> 声明为 HTML5 文档 <html> 元素是 HTML 页面的根元素 <head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。 <title> 元素描述了文档的标题 <body> 元素包含了可见的页面内容 <h1> 元素定义一个大标题 <p> 元素定义一个段落HTML标题
<h1>这是一个标题</h1> <h2>这是一个标题</h2> <h3>这是一个标题</h3>HTML段落
<p>这是一个段落。</p> <p>这是另外一个段落。</p>HTML链接
<a href="https://www.baidu.com">这是一个链接</a>HTML图像
<img src="/images/tt.png" width="258" height="39" />HTML表格
<table border="1"> <tr> <td>row 1, cell 1</td> 第一行第一列 <td>row 1, cell 2</td> 第一行第二列 </tr> <tr> <td>row 2, cell 1</td> 第二行第一列 <td>row 2, cell 2</td> 第二行第二列 </tr> </table>HTML列表
<dl> <dt>咖啡</dt> <dd>拿铁</dd> <dt>牛奶</dt> <dd>奶昔</dd> </dl>HTML区块
HTMl区块元素,<div>,它属于块级元素,下面一个div写的简单页面 <!DOCTYPE html> <html> <head> <meta charset="gb1323"> <title>我的第一个Web页面</title>* </head> <body> <div id="container" style="width:500px"> <div id="header" style="background-color:yellow;width:400px;"> <h1 style="margin-bottom:0;">网页标题</h1> </div> <div id="menu" style="height:100px;width:100px;float:left;"> <b>菜单</b> <br> HTML<br> CSS<br> JavaScript</div> <div id="content" style="background-color:#EEEEEE;height:200px;width:300px;float:left;"> 主要写内容</div> </body> </html> 后续我会把这部分的基础代码陆续的写下来HTML表单
<form> name: <input type="text" name="name"><br> password: <input type="text" name="password"> </form>HTML单选按钮
<form> <input type="radio" name="sex" value="male">男<br> <input type="radio" name="sex" value="female">女 </form>HTML复选框
<form> <input type="checkbox" name="1" value="Bike">牛奶<br> <input type="checkbox" name="2" value="Car">咖啡 </form>样式定义如何显示 HTML 元素 如果你要在HTML元素中设置CSS样式,你需要在元素中设置"id" 和 "class"选择器。 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式,HTML元素以id属性来设置id选择器,CSS 中 id 选择器以 “#” 来定义。 CSS id选择器 #para1 { text-align:center; color:blue; } CSS背景色 div {background-color:#b0c4de;} CSS字体 p{font-family:"Times New Roman", Times, serif;}
后面我将会继续记录下来我以前的学习过程,包括CSS,JS,希望我的内容可以帮助到所有热爱互联网,入门的你