HTML5项⽬实战(⼀)——PC端固定布局全页⾯——
dayeight
⼀、分离CSS
把css重复的部分移植到新的页⾯⽽减少代码冗余,单独创建⼀个 CSS,以便后续的页⾯重复调⽤。
多观察页⾯,总结出相同的样式,注意取名,⽅便调⽤。
⼆、html页⾯切换
不同的html页⾯通过链接实现跳转,常⽤class="active",设置当前页⾯导航栏样式。
三、通过添加背景渐变过渡,避免⽂字与背景颜⾊融合看不清
asp概念background: linear-gradient(to bottom right, rgba(0,0,0,0.7), rgba(0,0,0,0.0)) no-repeat center, url(../img/headline.jpg) no-repeat center ;
四、a标签通常不单独设置样式,⼀般都将超链接归类到 UL ⾥。若单独使⽤:
orientations翻译1.从语义不明确,如果外部包含 UL 可以理解为标签列表;
2.从 CSS 布局排版上,UL 作为⼀个整体,更容易统⼀排版;
3.从 SEO ⾓度考虑,⼤量 a 标签有可能会被判定堆积关键字嫌疑,从⽽导致⽹站降权, ⽤ UL 包含判断则让搜索引擎判定为有条例的列表,对搜索引擎更加友好。session的缺点
五、CSS代码简洁
如⼦元素都有text-align: center; 等相同样式,可将其写在⽗元素样式⾥,个别不同的⼦元素可单独设置样式。
六、HTML代码简洁
如:把除了标题和其他图⽚有关的简要信息都归于 <figcaption>可以达到更好的排版效果。
html个人网页完整代码顺序七、输⼊框间距设置
⽤p标签包含,再设置⾏⾼来控制jian。
<div class="form left">
<p>
<label for="from_city">出发城市</label>
<input type="text" name="from_city" id="from_city" placeholder="城市名">
</p>
数据存储类型有几种<p>
<label for="to_city">返回城市</label>
<input type="text" name="to_city" id="to_city" placeholder="城市名">
</p>basic语言是谁发明的
</div>
⼋、设置表格间隔样式
table tr:nth-child(2n) { background-color: #fafafa; } 偶数⾏背景颜⾊加深。
九、注意设置样式的先后顺序,优先级权重(⽐如前⾯写了a标签样式,后⾯直接⽤a⾥⾯⼀个class名设置样式是不⾏的,必须a.class名,不然上⾯的a权重更⼤),避免样式覆盖。
⼗、统⼀页⾯字体
font-family: "Helvetica Neue", Helvetica, Arial, "Microsoft Yahei UI", "Microsoft YaHei", SimHei, "\5B8B\4F53", simsun, sans-serif;
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论