html 田字格

<!DOCTYPE html>
<html>
<head>
<style>
/*
1.不加doctype 低版本解析不同
2.id 的属性不能为数字
3.文件编码和设置字体相符
*/
div{
height:200px;
background:blue;

}/*每个div独占一行*/

#main{
width:20px;
height:200px;
background:lawngreen;/*背景颜色*/
float:left;/* 向左浮动*/
}
#end{
width:20px;
height:200px;
background:red;
float:right;/*浮动以后，下面的块会上向上移动*/
}
#end2{
height:400px;
background:orange;
/* clear:right; 清除右幅*/
clear:both;

}
</style>
</head>
<body>
<div id="header"> </div>
<div id="main"></div>
<div id="end"></div>
<div id="end2"></div>
</body>
</html>

时间： 2024-08-26 07:58:05

html 田字格的相关文章

前端学习笔记田字格布局

<!DOCTYPE html> <html> <head> <title>test </title> <meta charset="utf-8"> </head> <body> <style> div{ width:100px; height:100px; } #div1{ background: black; } #div2{ background: yellow; } #di

excel制作田字格，excel行高磅，列宽1/10英寸；

打开一个excel表格,发现列宽是行高的4倍: 开始-格式中查看,发现行高14.25磅,列宽8.38*1/10英寸: 网上百度,了解1英寸=72磅: 那么列宽8.38=60.336磅: 60.336英镑/14.25磅=4.234; 与我们肉眼观察到的结果大致一致: 问题来了,那制作田字格,4个正方形的格子,14.25磅等于多长的列宽? 14.25/72*10=1.979,然后你会发现excel中无法调整这个宽度: excel可以通过鼠标放置行线/列线处,变成双箭头时,点击鼠标左键查看长度/像素:

田字格布局

<!!DOCTYPE HTML>页面布局 博客园欢迎你! http://www.cnblogs.com/jiangshaoxia/ 琅琊阁 遍识天下英雄路,俯首江左有梅郎. 张全蛋 我的法文名是Hélodie Jaqucline~ 神辅助在此 代码 <!!DOCTYPE HTML><html> <head> <meta charset="utf-8" /> <title>页面布局</title> <

用css样式和div画出田字格

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN"> <head> <title></title

Latex田字格、米字格

文件源自 LaTeX科技排版 https://www.latexstudio.net/archives/11990 为了让孩子练字,找了一个空白表格,里面有pdf文件可直接打印也可编辑. 在编辑过程中解决问题记录一些. 在hanzibox.sty 中 去掉 RequirePackage{hanpin},并在编辑sandbox.tex中加上 \usepackage{xpinyin}就可以编辑运行了. 原文地址:https://www.cnblogs.com/seenker/p/12411845.h

Fist

今天第一天学习有关网站前端的东西,感觉挺合胃口的,虽然一点基础没有,但是还是很有兴趣的,所以学起来也是很有劲儿.接受起来也比较容易,所以我也做了一些笔记和学习到的代码,希望对自己以后会有帮助!!!! 超文本传输协议<http   hypertext  transfer protocol> URL<uniform resource locaor > html  超文本标记语言<hypertext marked language>一种编程语言   浏览器解释语言 css&l

第一次敲代码

<!DOCTYPE html><html><head>    <meta charset="utf-8">    <title>田字格</title>    <style>        body{            margin: 0px;            padding: 0px;        }        .uni{            width: 200px;        

网站设计之网页制图

在一个空白网页上顶部居中添加一个由四个正方形组成的田字格所用的代码如图一 图一 做出来的效果图如图二 图二

第一天的学习

<!DOCTYPE html><html><head>    <meta charset="utf-8">    <title>田字格</title>    <style>        body{            margin: 0px;            padding:0px;        }        .uni{            width:200px;