html：web开发入门知识总结 帮你快
1.语义化html
2.更加简洁与深入的CSS
语义化html
人类相互交换有人类的语言和文字；商业有会计这门语言，反应企业经营成果；而html犹如前者一样，是一门展现语言，把设计的图片，通过html，在浏览器展现给人看，和展现给baidu等搜索引擎。
为了更深入的写出更好的页面，和对baidu等更友好，我研究了W3C标准，baiduseo标准，和html发展历史，我发现，未来的html的发展趋势是：html展现内容和结构，css展现布局与显示外表，js显示特殊效果。
未来的html，从html5更是直接由head，nav，article这些标签；说明了，未来的html的发展趋势，犹如写文章一样，有完全的意思，即语义化html，而不但仅是div的堆积，更是赋予html又犹如文章一样，有中心思想（h1），有不同的章节（article），有不同的内容间隔的转折（head，header，nav，footer），不同的分块（div）和表达思想的语义化（h标题，p内容，strong强调）。
国内的主流站，如sina，腾讯，taobao等，现在的写法即便语义HTNL，这些可以从他们用h1来写logo，直接表达中心思想，和后面的陈说看出来。
学习国内最顶尖站，语义化html的写法，我目前的html主要写法总结：
思路：1.全站一个思想，围绕这个中心思想，如写优美文章般，写一个代码优美的页面（h标题，div和dl和ul等给文章分段落，p写段落里的文章，strong写段落文章里的侧重部份；这样的代码，有如文章，有承上启下，使全站具有逻辑感，有主有次；这就是语义化html的真理）
最高关键词，用h1表示，也是logo
h1web前端开发/h1
这在目前是业内最顶级的写法，sina，taobao等都是这样h1写法。
思路：2.规范化，标准化html
1.a,加上title
g加上alt
li，olli1起用
dtdd1起用
思路：3.命名的规范化，统一化（这样即便不同的站，不同的页面，看代码，就能知道对应页面的哪一部份，方便修改）
经常使用的CSS命名规则:
头：header
内容：content/container
尾：footer
导航：nav
侧栏：sidebar
栏目：column
页面外围控制整体布局宽度：wrapper
广告：banner
页面主体：main
菜单：menu
等等；
思路：4.思考更好的html标签
比如：1
张三
张三是好学生
这个可以这样写
h5张三/h5
p张三是好学生/p
也可以这样写
pstrong张三/strong/p
p张三是好学生/p
比如：2,这个框架的写法,左右2个框
div里套div
divid=”main”
divid=”left”/divdivid=”right”/div
/div
ul,li
ulid=”main”
liid=”left”/liliid=”right”/li
/ul
dl,dt,dd
dlid=”main”
dtid=”left”/dtddid=”right”/dd
/dl
思路：5.H1-H6的用法（使页面有逻辑感，和主次）
H1用于logo；
H3用于子块的标题
H5用于板块内文章的标题
H3的写法（如图，h3是子块的标题，如图中方块所示）
h3妇科/h3（后面的图片写作背景，如有链接加a）
H2用于文章页的写法（如下图，标题“广州做人流哪家好”，文章的内容写作p）
h2广州做人流哪家好/h2
H5用于板块内文章的标题的写法（如下图，h5的典型用法，红色方框用h5写）
h5妇产科VIP中心/h5
关于h1-h6的重要性，百度一下，可以知道，如
思路：6.导航的写法
现在的导航有2种主流写法
lia(以sina，腾讯，taobao等站为首)
(百度等页面简洁站的写法)
我们医院的写法，
头部nav，基本都是第一种，由于，这类便于做出各种美丽的背景和效果
底部footer的nav，如果底部导航很简洁，我觉得采取baidu的写法更好
思路：an与h6的常见用法
Span是行元素，常见的用法是套在元素或行元素外面，实现定位，浮动，或并列排序，或实现特别效果，如色彩等变化。
放在行元素或块元素里，实现色彩的变化
实现绝对定位，相对定位，这个会在css里介绍
实现并列排序
思路：rong与b的常见用法
Strong侧重强调
b加粗
更加简洁与深入的CSS样式
Html的发明者timberners对css的发明，这样说，css的产生，使html从蛮横走向文明，从此，html负责结构，css负责布局（页面的展现效果），就像一个人，html构成一个人体，css就是衣服，让人展现不同的风采。
由于涉及到一个站，就会有不同的页面，index，list，article页，最少这3个，那末就有涉及到有共性的css样式，怎样的写法，能够多个页面调用，和同一个页面，多个地方调用共性（class样式），不同的再单独写（id样式）
让css更加深入，与简洁的思路
用class写共性，id写个性
用元素选择器（这个比较高级，具体写法以下，多数用在dl，dt，dd）
如上，差别是下面的字体有横线和色彩变化
这样写法可以这样
dlul{width:px;height:25px;}
dlulli{float:left;width:60px;height:25px;margin-right:6px;}
上面是共性，下面写特性
dldta{color:#;}
dldda{color:#;list-style-type:underline;}
class,id,元素选择器，选择最优组合混用
能够适应多种不同的浏览器，得到和设计一样的效果
css选择器
元素选择器：
html元素做选择器，优点：可以控制全部元素的样式，和减少命名的烦恼；可以后套写法（后代选择器），比如
h3a可以控制h3里面的所有a标签样式
dldtpa可以直接控制到dl里dt的p的a的样式
ID选择器，class选择器
Id用于页面唯一的，只用一次
class用于页面，具有相同的样式，集合写成一起
后代选择器
最经常使用的是在后面嵌套元素
如
id+元素；如（#main1pa）
class+元素;如（.zixunpa）
d.通配选择器
*{padding:0;margin:0;text-decoration:0;}用*标注
s常见问题和最好解决方案
1.有很多常见的问题，可以通过固定格式的代码得以避免
*{padding:0;margin:0;text-decoration:0;}解决各个框架见的间距，使为0.
Img{border:0;}解决ie6下的img自带border问题，使为0.
避免css样式中的中文注释，中文注释，会引发css的失效
2.整体框架的构建
这类外围框架的构建方法，有2种思路
（1）添加外围wrapper
（2）直接里面的小框架margin居中
3.块元素和行元素（实现自然竖向和横向排序）
区分：块元素是竖向的，行元素是横向排列的。
优势：利用块元素和行元素实现竖向和横向的排列
如果上面都是两幅图片组成的面画，
图1是竖向的，这样我们在写代码的时候，就可以用块元素
法1：pimg/p
pimg/p
p是块元素，这样自然就会出现图1的模样。（还有其他的标签可以使用，这里只举p）
图2是横向的，这样就可以用行元素
法1：pimgimg/p
img是行元素，自然横向排序
如需要了解更多行元素，块元素，可以参考一些书籍或baidu.
4.块元素的横向排序（float的用法）
如果都是块元素
pimg/p
pimg/p
按道理，是要竖向排序的，如果是要横向，即用float浮动则可以
写成p{float:left;}或向右浮动，都可以。
5.行元素转化成块元素（display:block;）
有时候，行元素需要块级化，使之具有块级元素的优点
比如如图aimg/a需要用float:right;使之移到右侧，方法，就是
a{display:block;float:right;}
6.横向居中与竖向居中
横向居中：块元素:{margin:0auto;}行元素:在上一级块元素内写{text-align:center;}
竖向居中:行元素：使height和line-height相等{height:20px;line-height:20px;}
块元素：丈量高度，用好padding或margin使块元素，往下移一定的高度，使之居中,或{margin:auto0;}
喜欢博主的文章就打赏ta吧
赞美
人赞美
北京能治白癜风病的地方治疗白癜风好的医生