曲曲的秘密学术基地

纯化欲望、坚持严肃性

欢迎!我是曲泽慧(@zququ),目前在深圳(ICBI,BCBDI,SIAT)任职助理研究员。


病毒学、免疫学及结构生物学背景,可以在 RG 上找到我已发表的论文

本站自2019年7月已访问web counter

HTML5 基础

什么是HTML

  • HyperText Markup Language (超文本标记语言

  • 不是编程语言

  • 告诉浏览器如何构造网页

HTML 的模式如图所示,

figure1

关于Taq可以在这里找到

基础语法

<!DOCTYPE html> <!--解释文档的类型-->
<html>
	<head>
		<title>This is a page title</title>
	</head>

	<body>
		<h1>This is a heading</hl>
		<p>This is a paragraph</p>
		<p>This is a paragraph</p>
	</body>
</html

实例

<!DOCTYPE html>
<html>

<head>
	<title>HTML Crash Course For Beginners</title>
</head>

<body>
	<!--Headings-->
	<h1>Heading One</h1>
	<h2>Heading Two</h2>
	<h3>Heading Three</h3>
	<h4>Heading Four</h4>
	<h5>Heading Five</h5>
	<h6>Heading Six</h6>

	<!--Paragraph-->
	<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Nostrum, ipsum.</p>
	<p>Lorem ipsum
		<strong>dolor, sit amet consecteturs</strong> adipisicing elit. Nisi expedita accusantium nulla.
		<em>Numquam eaque id voluptas</em> ratione officia, voluptatibus dolore ullam quis repellat blanditiis ipsam
		excepturi sint vero perspiciatis ad.</p>
	<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Cum a provident iusto optio dolores quaerat, excepturi
		voluptatibus, recusandae laboriosam perspiciatis nulla et aperiam
		<a href="https://google.com" target="_blank">ex totam</a> fugiat doloribus pariatur enim iure.</p>

	<!--Lists-->
	<ul>
		<li>List Item 1</li>
		<li>List Item 2</li>
		<li>List Item 3</li>
		<li>List Item 4</li>
		<li>List Item 5</li>
	</ul>

	<ol>
		<li>List Item 1</li>
		<li>List Item 2</li>
		<li>List Item 3</li>
		<li>List Item 4</li>
		<li>List Item 5</li>
	</ol>

	<!--Table-->
	<table>
		<thead>
			<tr>
				<th>First Name</th>
				<th>Last Name</th>
				<th>Age</th>
				<th>Email</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>Leonard</td>
				<td>Chan</td>
				<td>99</td>
				<td>abc@abc.com</td>
			</tr>
			<tr>
				<td>Leonard</td>
				<td>Chan</td>
				<td>99</td>
				<td>abc@abc.com</td>
			</tr>
			<tr>
				<td>Leonard</td>
				<td>Chan</td>
				<td>99</td>
				<td>abc@abc.com</td>
			</tr>
		</tbody>
	</table>

	<br>
	<br>
	<br>
	<br>

	<!--Forms-->
	<form action="form.js" method="" POST>
		<div>
			<label>First Name</label>
			<input type="text" name="firstname" placeholder="Enter First Name">
		</div>
		<div>
			<label>Last Name</label>
			<input type="text" name="lastname" placeholder="Enter Last Name">
		</div>
		<div>
			<label>Email</label>
			<input type="email" name="email" placeholder="Enter Email">
		</div>
		<input type="submit" name="submit" value="Submit">
	</form>
	<br>

	<!--Button-->
	<button>This is a Button</button>

	<!--Image-->
	<img style="width: 100vw" src="img/pic.jpg" alt="This is a img tag">

	<!--Quotation-->
	<blockquote>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quas quibusdam ipsam rerum, voluptas quasi
		dolorem exercitationem natus ipsa voluptatum enim, ad voluptates nihil ratione eligendi totam doloribus nesciunt
		earum corrupti, cupiditate distinctio excepturi nobis praesentium. Sequi, delectus? Autem aspernatur fugiat,
		consequuntur tempora magni excepturi deleniti, esse quia, temporibus explicabo optio?</blockquote>

	<p><abbr title="Massachusetts Institute of Technology">MIT</abbr> is a presitigious college</p>

	<p><cite>MIT is a prestigious college</cite> by DasAuto</p>

	<div style="margin-top:1000px"></div>
</body>

</html>

最终网页效果

生成以后的网页渲染效果,请点击这里

Last One

CSS 基础

什么是 CSS 三种方式添加CSS CSS 的选择器 CSS 里的颜色 CSS 中的字体 盒子模型(框模型) Position in CSS 代码汇总 HTML 代码 CSS 代码 最终网页效果 更多什么是 CSS Cascading Sytlesheets 层叠样式表 不是变成语言 高速浏览器如何指定样式、布局等首先介绍一下代码样式,如下图所示:三种方式添加CSS 外部样式表 (最常见) CSS 保存...…

blogMore
Next One

python 魔法方法 (9) 生成器

整理自小甲鱼鱼C论坛 什么是生成器 协同程序 生成器表达式 列表推导式 ( list comprehensions ) 字典推导式 ( dictionary comprehension ) 结合推导式 ( set comprehension ) 作业 关于 yield 与 Generator 提高篇 协同(协同程序)与子例程 next()和send()用法 总结什么是生成器生成器( iterato...…

pythonMore