为什么文字排版不用HTML而用CSS？【前端吧】_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名：今日本吧第个签到，本吧因你更精彩，明天继续来努力！
本吧签到人数：0成为超级会员，使用一键签到本月漏签0次！成为超级会员，赠送8张补签卡连续签到：天&&累计签到：天超级会员单次开通12个月以上，赠送连续签到卡3张
关注：61,718贴子：
为什么文字排版不用HTML而用CSS？收藏
求职应聘来智联招聘,web前端简历,版式素材任你下载,更有350万好职位等着你,好机会别错过!智联招聘简历中心,提供个人简历,个人简历表格,英文简历及各种行业简历模板下载.
比如文字的大小 颜色 居中等问题
登录百度帐号个回答天前打开Chrome DevTools，在审核可以审核目前的状态或重新加载页面和审核上载然后在网页性能下面有一段说：“删除未使用的CSS规则现在，当我使用它时，我看到它列出了我正在使用的一些css问题，目前状态下它没有被使用，所以如果你正在切换类，那么显然它会显示它，如果类不是目前已应用。顺便说一句，如果没有出现，据我所知它在铬金丝雀工作。此外，我不记得是否为此启用了标志。天前是的，你应该使用Addy Osmani的来清理未使用的CSS。我不太确定你是否可以使用一个工具去除未使用的JS，因为它依赖于应用程序逻辑，JS代码的哪一部分将被调用。优秀设计联盟-SDC-优设网-设计师交流学习平台-听讲座，聊设计，找素材，尽在优设网
下一篇 继续涨姿势
阅读本文需 8 分钟
想做一个开发&设计并行的牛人？却不知道如何开始？欢迎观看本文，说不定会引起你对开发的兴趣
HTML&CSS是网页设计的基本。设计师应该时刻学习，不要仅仅局限于视觉设计的层面。那么该要如何开始HTML&CSS的学习呢？
本文勾勒出了HTML&CSS的基本，即便不学，掌握这些基本知识也是很有必要的。
推荐阅读：
在开始学习HTML&CSS之前，首先要搞清楚两者的区别。两者在整体上有着很明显的差异。
整体看来，HTML是超文本标记语言,是用来构建框架的。
而CSS值得是层叠样式表，统一控制HTML网页的外观属性。
（而JavaScript是行为）
HTML语言的基本
标签、属性、元素是在掌握之前必须要了解的几点基础。
元素是用来定义页面、内容、结构的一种标识符。一些流行的元素包括h1-h6，p,div,a,span,strong以及em.
标签主要有两种形式，开始标签和结束标签(也称为开放标签和闭合标签)。
HTML 元素以开始标签起始
HTML 元素以结束标签终止
&a&……&/a&
HTML 链接由 &a& 标签定义。链接的地址在 href 属性中指定：&a href=”http://www.w3school.com.cn”&This is a link&/a&
&p&…..&/p&
HTML 段落是通过 &p& 标签进行定义的。&p&This is a paragraph.&/p&
属性指的是赋予元素的附加信息。大多数情况下，属性将标题、类、ID分配格元素，用来描述媒体元素的来源，并可作为超链接的参考。
&a href = “http:///www.example.com/”&Example&/a&
HTML 链接由 &a& 标签定义。链接的地址在 href 属性中指定：
CSS语言的基本
除了HTML，你还要了解CSS，这是你第二件必备武器。下面这个案例展示了CSS的几个基本
在这个例子中，h1 是选择器，color 和 font-size 是属性，red 和 14px 是值。
h1 {color: font-size:14}
下面的示意图为您展示了上面这段代码的结构：
选择器能够为确定元素加入指定样式,包括ID、类、标签选择器等等。
属性定义了为元素加入样式的种类，诸如颜色、字体大小等等。（冒号之前）
样式种类的具体数值。（冒号和分号之间）
框模型和定位
另外需要了解的便是框模型。CSS 框模型 (Box Model) 规定了元素框处理元素内容、、 和
关键便是margin和padding属性, 而正确理解这两个属性也是学习用css布局的关键。
border(边框)
margin(外边距)
padding(内边距）
width(宽度）
元素框的最内部分是实际的内容，直接包围内容的是内边距。内边距呈现了元素的背景。内边距的边缘是边框。边框以外是外边距，外边距默认是透明的，因此不会遮挡其后的任何元素。
框模型包括以上几种，可调整大小，框模型便能以这种方式影响内容传递的方式。
HTML框模型
元素的高度和宽度可自行设定，然而整体内容的高度和宽度受内边距以及边框影响。
background: #
border: 6px solid #
height: 100
margin: 20
padding: 20
width: 400
添加图像、音频、视频
文本与多媒体结合能达到更好的传递效果。
图中内含的文本部分便能实现添加图像功能，
不可忽视的两个属性：
src属性：src 属性可设置或返回应当被载入框架中的文档的 URL。
alt属性：alt 属性是一个必需的属性，它规定在图像无法显示时的替代文本。
&img src="/i/eg_tulip.jpg"
alt="上海鲜花港 - 郁金香" /&
如果无法显示图像，浏览器将显示替代文本，就像这样：
此外，当用户把鼠标移到图像上方，最新的浏览器会在一个文本框中显示描述性文本。下面的代码在 alt 属性中为图像添加了描述性文本：
您可以把鼠标移动到下面的照片上，看看相应的效果：
红圈中的文本框是用户把鼠标移动到图像上时，IE7 浏览器所显示的效果：
HTML5提供了一种简易的方式添加音频和视频文件。跟img元素一样，音频元素也需要src属性来提供URL来源
跟添加音频同理，只不过用视频元素来取代音频元素。
希望这份入门指导能让你对HTML&CSS产生兴趣，同时教会你HTML&CSS的基本，其实它们学起来很简单。
原文地址：
特别感谢：
优设网翻译:@MartinRGB
================关于优设网================
“优设网“是一个分享网页设计、无线端设计以及PS教程的干货网站。
【特色推荐】
PS礼仪手册：网页设计师必须修炼的内功技法，更是不可或缺的WEB设计指南。
设计微博：拥有粉丝量60万的人气微博 ，欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航：全球顶尖设计网站推荐，设计师必备导航：
———————————————————–
想在手机上、被窝里获取设计教程、经验分享和各种意想不到的”福利”吗？
添加 优秀网页设计 微信号：【youshege】优设哥的全拼
您也可以通过扫描下方二维码快速添加：
海底世界：超赞鱼儿图案免费下载如果你正好有一个海洋主题的设计项目，那这些资源非常适合你，鱼儿有复古风格的、刻画精致的、简明轻快的，风格各异，你可以利用它们搭建背景...
background是用来设置背景的元素，从最早的纯色填充发展到现在，不仅支持渐变，甚至能用上混合模式！今天@不到布这篇好文将一一为你阐释这些子属性的用法，...今天的资源是完全免费的 WebApp，这些 WebApp 能够为模板，渐变，甚至浏览器属性的前缀生成 CSS3 代码。如果你是前端开发者，这些资源可以帮助你...栅格系统这种东西和许多同类工具/素材一样，“系统”二字让它看起来无比高大上，而实际上大多数的栅格系统只是一系列纵横交错的细线构成。很简单？看起来确实如此。不...记得小时候刚学计算机时还是使用 MS-DOS 操作系统，家人帮我买了一本厚重的参考书，里头收录所有 DOS 指令，非常详尽，而这本书也对我产生不小影响，我知...@糖糖糖就是糖 ：本篇内容教大家如何自制手工水彩本。 往期回顾： 《自学水彩没你想的那么难，说说我是怎么自学的》 《水彩自学第二集：水彩纸常见问题及测评》 ...转眼负责火影手游的创意设计工作一年多了，在这段时间里从《鸣人雏田婚礼》到《重返木叶村》沙盘项目，我们为火影手游尝试了很多风格的H 5和互动站，春节期间我们又...如果你曾仔细观察过当今的网页设计，你会发现有一部分网站的画质已经相当惊艳了。从图片、背景到界面元素，无一不是高清画质，它们几乎是为高分辨率甚至视网膜屏幕的笔...没套路！这个功能真的可以有效地提高工作效率！！ 作品作者：来源网络 教程作者：@杨洋-XHM 效果图： 练习重点： 这次主要分享一个智能对象功能的使用，其...编者按：今天推荐两款神器，一个是可以帮我们节省很多的调试图像效果时间的CSS 滤镜，一个是提高设计师工作效率的音乐网站，可以模拟出咖啡馆的噪声，帮你更有效率...
我们的团队
大家在关注
一扫"掌"握！
把好文章收藏到微信
打开微信，扫码分享学设计 优设网 在这里在 SegmentFault，学习技能、解决问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
问题对人有帮助，内容完整，我也想知道答案
问题没有实际价值，缺少关键内容，没有改进余地
就好比这是我的common.html,然后其他的HTML文件就不需要在进行引入了，求方法。。。。。
&meta name="description" content="Dashboard" /&
&meta name="viewport" content="width=device-width, initial-scale=1.0" /&
&meta http-equiv="Content-Type" content="text/ charset=utf-8" /&
&!--Basic Styles--&
&link href="assets/css/bootstrap.min.css" rel="stylesheet" /&
&link id="bootstrap-rtl-link" href="" rel="stylesheet" /&
&link href="assets/css/font-awesome.min.css" rel="stylesheet" /&
&link href="assets/css/weather-icons.min.css" rel="stylesheet" /&
&!--Fonts--&
&link href="assets/css/fonts-google.css" type="text/css" rel="stylesheet"&
&!--Beyond styles--&
&link id="beyond-link" href="assets/css/beyond.min.css" rel="stylesheet" type="text/css" /&
&link href="assets/css/demo.min.css" rel="stylesheet" /&
&link href="assets/css/typicons.min.css" rel="stylesheet" /&
&link href="assets/css/animate.min.css" rel="stylesheet" /&
&link id="skin-link" href="" rel="stylesheet" type="text/css" /&
&!--Page Related styles--&
&link href="assets/css/dataTables.bootstrap.css" rel="stylesheet" /&
&!--Skin Script: Place this script in head to load scripts for skins and rtl support--&
&script src="assets/js/skins.min.js"&&/script&
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
建议使用打包工具,前短时间弄了个 脚手架，里面有这个功能，可以试试。
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
下面一个简单的例子，仅供参考
&!DOCTYPE html&
&html lang="en"&
&meta charset="UTF-8"&
&title&测试页面&/title&
&script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"&&/script&
&script type="text/javascript"&
var headHTML = $('head').html();//保存原来的head内容
$("head").load("common.html",function(){
$(this).prepend(headHTML); //common.html载入到head后将原来head内容添加回去
分享到微博？
关闭理由：
删除理由：
忽略理由：
推广（招聘、广告、SEO 等）方面的内容
与已有问题重复（请编辑该提问指向已有相同问题）
答非所问，不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因（请补充说明）
我要该，理由是：
在 SegmentFault，学习技能、解决问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。不用css和div，直接用html，网页的界面代码怎么写，长宽，间距之类的_百度知道
不用css和div，直接用html，网页的界面代码怎么写，长宽，间距之类的
我有更好的答案
这个问题本身就是错误的，div本身就是属于html.而html又必须和css配套使用，因为html只是在搭建框架，而css还是赋予框架内容的因素。而题目的长宽。间距都是有css决定的。
采纳率：76%
来自团队：
DOCTYPE&HTML&&html&&head& &/body&&/html&
background-
margin:auto:300/div& &span&测试页内容&lt:#EFEFEF;&/& &&#CCC;
} &/style&&/head&meta&&class=&http-equiv=&Content-Type&&content=&text/&charset=UTF-8&/span& & &div&nbsp:1px&solid&
&title&测试页标题&
test&/title& &style&gt。最简单的也是需要三者结合才能有效果啊。例如HTML DIV CSS是一体的嘛 都是最基础的，并不是最新的思想;body&gt：&
本回答被提问者采纳
直接在表格上设尺寸，里面打表格，按快捷键，表格神器不过貌似一点不用css不现实，起码你得定义下默认的字体，不然就太丑了还是学学吧，不要因为不会就抗拒或不学，css、js以后都是主流技术.下个dw
用table也可以定义
就是有点麻烦
不过table可以用可视化界面
我就是想了解最先网页设计，不用现在流行的ps啊，div+css啊去设计网页，先了解最基础的那个在去使用最新的思想
啊？不至于吧。我晕
其他1条回答
为您推荐：
其他类似问题
您可能关注的内容
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。