分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 代码编程

html+css

发布时间:2023-09-06 02:14责任编辑:熊小新关键词:暂无标签
1. 什么是html

hyper 超级 text 文本 markup 标记 language 语言
超文本标记语言,俗称网页

2. html 文件结构

.html 或 .htm 结尾的文本文件

1) 标签一般成对出现:<标签名> </标签名>
2) 最外层的标签<html></html> 其它标签必须在它之内
3) doctype 用来说明html的版本 如:<!DOCTYPE html>

###1 .格式

<html> ???<head> ???????<meta charset="utf-8"> ???????<title>网页标题</titie> ???</head> ???<body> ???????要显示的内容 ???</body></html>

head标签主要用来引入外部的样式和脚本文件, 还可以用来定义编码和标题
主要的是网页中与内容无关的部分

body标签里放的是要显示的内容部分

3. 常用标签

3.1 标题标签
<h1>...<h6> ?标题从1到6,字号依次减小

3.2 段落标签(正文)
<p> 可以起到内容换行的作用, 普通文本是不会自动换行的

3.3
分隔符 <hr> ?不需要结束标签, 加一道横线
换行符 <br> ?不需要结束标签, 起到换行的作用

3.4 标签的属性: ?格式 : ?属性名="属性值"
可以用来定义标签的宽、高、颜色等等

3.5 图片标签 img
src 属性代表图片路径
更多注释内容
alt 是图片访问不到时的提示文字
width 表示宽度(单位是像素)
height 表示高度(单位是像素)

3.6 超链接 a 【重点】
href 属性 表示跳转的目标
方式1:两个网页之间跳转:

<a href="目标网页的地址">超链接提示文字</a>

方式2:网页内跳转 (锚点)

<a href="#另一个标签的id值">超链接提示文字</a>

方式3:图片作为超链接
<a href=""> <img src="图片路径"> </a>

3.7 列表
有序列表 (order)

<ol> ??<li>列表项</li></ol>

无序列表 (unorder)

<ul> ??<li>列表项</li></ul>

3.8表格

<table> ???<thead></thead> ?头 ???<tbody></tbody> ?体 ???<tfoot></tfoot> ?脚</table>

其中 thead, tbody, tfoot 里又可以分为行与列
&lt;tr&gt; 表示行 ‘<td>‘ 表示列
例:
<table border="1" width="100%">

??? ??? ??????? ???????????编号姓名 ??????? ??? ??? ??? ??????? ???????????1张三 ??????? ??????? ???????????2李四 ??????? ???与``类似的‘‘,他们都是代表一列,但‘‘其中的文本默认是居中并加粗简写 table[border=1] [width=100%]>tbody>tr*2>td*2同时生成thead和tbody 需要用() 把他们分组,平级的用+连在一起table>(thead>tr>td*3)+(tbody>tr*4>td*3) ???行1列1 ?conlspan用来合并行 2:代表合并2行 ???行1列1 ?rowspan用来合并列## 表单标签``` ?文本框 ?密码框 ?单选, name取值相同的为一组 checked表示默认值为 ?复选, name取值相同的为一组 ? ???普通按钮 ? ???重置按钮 ? ???提交按钮