Heim  >  Artikel  >  Web-Frontend  >  HTML总结_html/css_WEB-ITnose

HTML总结_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:20:411217Durchsuche

几个知识点:  

HTML 指的是超文本标记语言 (Hyper Text Markup Language)

HTML框架结构:

 

 

 

 

  此处为标签内容

 

 

HTML属性:

class=“XXX”  :元素类名,CSS定位用

id=“XXX”  :元素id,CSS定位用

style=“XXX”:定于元素颜色、是否居中、粗细、边界等

title=“XXX”:鼠标悬停时提示信息

Alt=“XXX”:图片加载错误提示信息

HTML常用标签:

文字内容

:标题居中显示

:图片显示标签

 

一些独立标签:


:换行


:创建水平线

:注释

 显示空格(一种HTML实体符号)

 

此处可嵌套其他标签
:块级元素,他的内容会另起一行开始。

此处可嵌套其他标签:内联元素,不换行

 

无序列表:

  • 第一项
  • 第二项
 

 

有序列表:

  1. 第一项
  2. 第二项

 

表格:

  

 

 

 

 

 

 

 

 

 

 

跨行 row 1, cell 1 row 1, cell 2
row 2, cell 1 row 2, cell 2

 

运行样式如下:

 

表格的一些属性:

 

表单:

表单是一个包含表单元素的区域,表单元素是允许用户在表单中(比如:文本域、下拉列表、单选框、复选框等等)输入信息的元素

表单元素
:表单标签

:文本域,可输入文字

:输入框元素

:单选按钮元素

:复选按钮

:按钮

:提交按钮

 

HTML一些高级特性:

  

  

  框架,将屏幕分为两半,分别填充两个页面

:内联框架,将一个页面内联

 

:外部文件引入,放在head标签内

:定义文档的标题,位于head内

:定义关键字、文档描述,位于文档head之内

:定义整篇文档的默认链接指向

<script></script>:插入script语句

 

HTML完整例子如下:

<html><head>	<link rel="stylesheet" type="text/css" href="theme.css" />	<meta name="description" content="Free Web tutorials on HTML, CSS, XML" />	<meta name="keywords" content="HTML, CSS, XML" />	<base href="https://www.baidu.com/" />	<base target="_blank" /></head>	<body>	<h1 align="center">标题1</h1>	<p style="font-size:10px" >黄色段落</p>	<a href="https://www.baidu.com/" title="这是链接">百度</a>	<img src="./picture.jpg" alt="图片加载错误"/>		 <div class="news">	  <h2>News headline 1</h2>	  <p>some text. some text. some text...</p>	  ...	 </div>	<span>提示:</span>		<table border="1">	<tr>	<td rowspan="2">跨行</td>	<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>		<ul>	<li>第一项</li>	<li>第二项</li>	</ul>	<ol>	<li>第一项</li>	<li>第二项</li>	</ol>		<form name="input" action="html_form_action.asp" method="get">		<textarea rows="10" cols="5">文本域</textarea>		姓名:<input type="text" name="firstname"/>		<input type="radio" name="sex"/>男性		<input type="checkbox" name="car" />我有汽车		<button type="button">Click Me!</button>				<select name="cars">		<option value="volvo">Volvo</option>		<option value="saab">Saab</option>		<option value="fiat" selected="selected">Fiat</option>		<option value="audi">Audi</option>		</select>		<input type="submit" value="Submit" />	</form>		<frameset cols="75%,25%">   <frame src="./frame_a.htm">   <frame src="./frame_b.htm">	</frameset>		<iframe src="https://www.baidu.com/"></iframe>	</body></html>

  

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn