文章列表
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>导航菜单</title>
<style type="text/css">
* {
margin: 0px;
padding: 0px;
...
左宽固定，右宽自适应一：
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>左宽固定，右宽自适应</title>
<style type="text/css">
* {
margin: 0px;
...
1、document.domain+iframe
www.a.com上的a.html
document.domain = 'a.com';
var ifr = document.createElement('iframe');
ifr.src = 'http://script.a.com/b.html';
ifr.style.display = 'none';
document.body.appendChild(ifr);
ifr.onload = function(){
var doc = ifr.contentDocument || ifr.contentWi ...
块状box自由添加且自适应屏幕
- 博客分类：
- css
例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
<style type="text/css">
body{
margin: 0px;
padding: 0px;
text-align: center;
}
.box1 {
width: 19.5%;
height: 150px;
background-color: red;
dis ...
两个按钮将屏幕对半，且适应屏幕的缩放
- 博客分类：
- css
例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
<style type="text/css">
body{
margin: 0px;
padding: 5px;
}
.box {
text-align: center;
}
.left {
display: inline-block;
width: 49.5%;
margin-ri ...
javascript的加载
- 博客分类：
- javascript
1.在</body>前放置<script type="text/javascript"></script>标签；
2.非阻塞脚本；
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>xxx</title> </head> <body> <script type="text/ ...
1.浮动的标签：脱离文档流的标签元素；
2.css的float属性和position属性都可以让标签元素浮动起来；
3.示例：
float示例一：
具有float属性的标签脱离文档流，其原本的位置被紧接着的元素占有
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>xxx</title> <style type="text/css"> ...
阴影效果：
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>xxx</title> <style type="text/css"> .box { width: 400px; height: 400px; background: pink; ...
css的居中问题有好几种，第一种是水平居中，其实现代码如下：
<!DOCTYPE html>
<html>
<head>
<title>xxx</title>
<style type="text/css">
.parent {
width: 400px;
height: 400px;
background-color: red ...
html的表单标签form用于包含要提交到服务器的表单域信息，它常以如下的形式出现：
<form action="xxx" method="xxx">
<label for="xxx"></label><input type="text" name="xxx" id="xxx" />
</form>
需要注意的有：
需要发送到服务器的字段必须有name="xxx";
fo ...