zoukankan      html  css  js  c++  java
  • HTML总结

    几个知识点:  

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

    HTML框架结构:

    <!DOCTYPE html>

    <html>

      <head> 

      </head>

      <body>

      此处为标签内容

      </body>

    </html>

    HTML属性:

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

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

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

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

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

    HTML常用标签:

    <h1 align=“center”>文字内容</h1>:标题居中显示

    <p style="font-size:10px“>文字内容</p>:段落显示

    <a href=“https://www.baidu.com/” title=“这是链接“>百度</a>:链接标签

    <img src=“./picture.jpg” alt="图片加载错误"/>:图片显示标签

    一些独立标签:

    <br/>:换行

    <hr/>:创建水平线

    <!– 注释内容-->:注释

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

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

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

    无序列表:

    <ul>

    <li>第一项</li>

    <li>第二项</li>

    </ul> 

    有序列表:

    <ol>

    <li>第一项</li>

    <li>第二项</li>

    </ol>

    表格:

      <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>

    运行样式如下:

    表格的一些属性:

    表单:

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

    <form>表单元素</form>:表单标签

    <textarea></textarea>:文本域,可输入文字

    <input type=“text” name=“firstname” />:输入框元素

    <input type=“radio” name=“sex”/>:单选按钮元素

    <input type=“checkbox” name=“car” />:复选按钮

    <select name=“cars”>:下拉列表

    <option value="volvo">Volvo</option>

    <option value="fiat" selected="selected">Fiat</option>

    </select>

    <button type=“button”>Click Me!</button>:按钮

    <input type=“submit” value=“Submit” />:提交按钮

    HTML一些高级特性:

    <frameset cols="25%,75%">

       <frame src="./frame_a.htm">

       <frame src="./frame_b.htm">

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

    <iframe src=“https://www.baidu.com/”></iframe>:内联框架,将一个页面内联

    <link rel=“stylesheet” type=“text/css” href=“theme.css” />:外部文件引入,放在head标签内

    <title></title>:定义文档的标题,位于head内

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

    <base href=“https://www.baidu.com/” />:定义整篇文档的默认链接指向

    <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>
    

      

  • 相关阅读:
    每日总结2021.9.14
    jar包下载mvn
    每日总结EL表达语言 JSTL标签
    每日学习总结之数据中台概述
    Server Tomcat v9.0 Server at localhost failed to start
    Server Tomcat v9.0 Server at localhost failed to start(2)
    链表 java
    MVC 中用JS跳转窗体Window.Location.href
    Oracle 关键字
    MVC 配置路由 反复走控制其中的action (int?)
  • 原文地址:https://www.cnblogs.com/feichangnice/p/5401919.html
Copyright © 2011-2022 走看看