在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文本域和按钮等. 在Bootstrap框架中,通过定制了一个类名`form-control`,也就是说,如果这几个元素使用了类名“form-control”,将会实现一些设计上的定制效果. 1.宽度变成了100% 2.设置了一个浅灰色(#ccc)的边框 3.具有4px的圆角 4.设置阴影效果,并且元素…
标题.样式:class="h1"~class="h6" bootstrap中重新定义了h1~h6标签,具体差别如下: 在bootstrap中其他任何标签使用class="h1"~class="h6"都可以实现h1~h6的标题效果. <!--Bootstrap中的标题--> <h1>Bootstrap标题一</h1> <h2>Bootstrap标题二</h2> <…
bootstrap中的排版: 标题(h1~h6/.h1~.h6) h1:36px;h2:30px;h3:24px;h4:18px;h5:14px;h6:12px; 副标题(small) 小练习(标题大小和副标题的使用): <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>标题</title> <link rel="styleshe…
学习新标签,标题 <html> <head> <title>tags</title> </head> <body> <h1>大</h1> <h2>大</h2> <h3>大</h3> <h4>大</h4> <h5>大</h5> <h6>大</h6> <h7>大</h7>…
为导航条添加标题.二级菜单及状态 加入导航条标题 在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过"navbar-header"和"navbar-brand"来实现,示例查看代码编辑器(11-22). 原理分析: 此功能主要起一个提醒功能,当然改良一下可以当作是logo(此处不做过多阐述).其样式主要是加大了字体设置,并且设置了最大宽度: /*源码查看bootstrap.css…
amazeui学习笔记二(进阶开发3)--HTML/CSS规范Rules 一.总结 1.am:以 am 为命名空间 2.模块状态: {命名空间}-{模块名}-{状态描述} 3.子模块: {命名空间}-{模块名}-{子模块名},如果不继承父级的类名,很容易造成命名冲突 二.Amaze UI HTML/CSS 规范 Amaze UI HTML/CSS 规范 目录 基本规范 HTML/CSS 编写注意事项 基本原则 模块化编写实践 命名注意事项 CSS 编写注意事项 参考链接 基本规范 AllMobi…
amazeui学习笔记--css(基本样式3)--文字排版Typography 一.总结 1.字体:amaze默认非 衬线字体(sans-serif) 2.引用块blockquote和定义列表:引用块blockquote和定义列表(dl dt)注意一下 3.样式不能正常显示:拷贝过来的很多样式在博客中都不能正常显示 二.文字排版Typography 目录 字体 字体定义 字体辅助 Class Webkit 反锯齿 字体相关链接 元素基本样式 标题 <h1> - <h6> 段落 &l…
标签的重点 标签的用途 标签在浏览器中的默认样式 <body>标签: 在网页上显示的内容 <p>标签: 添加段落 <hx>标签: 添加标题 标签一共有6个,h1.h2.h3.h4.h5.h6分别为一级标题.二级标题.三级标题.四级标题.五级标题.六级标题.并且依据重要性递减.<h1>是最高的等级. <string>和<em>标签: 强调 <em> 表示强调,<strong> 表示更强烈的强调.并且在浏览器中&l…
amazeui学习笔记二(进阶开发5)--Web 组件开发规范Rules 一.总结 1.见名知意:见那些class名字知意,见函数名知意,见文件名知意 例如(HISTORY.md Web 组件更新历史记录.) 二.Web 组件开发规范Rules 目录 Web 组件样式组织 目录结构及说明 package.json README.md HISTORY.md src 目录 开发脚手架 调试预览 Web 组件基于 Amaze UI 基础库(CSS / JS)开发,在基础库已有样式.功能的基础上做更多扩…
amazeui学习笔记--css(基本样式3)--打印样式Print 一.总结 1.打印显示url方法: 利用 CSS3 content 属性,将 <a> 和 <abbr> 的标题.链接显示在后面. <a href="http://www.amazeui.org">Amaze UI</a> 2.am-print-hide类: 浏览器可见,打印机隐藏. 二.打印样式Print 目录 显示 URL 链接 辅助 Class 参考链接 打印样式组…