Albus
V2EX  ›  问与答

求问自学 CSS/HTML 的话如何入手- -#

  •  1
     
  •   Albus · Jun 13, 2014 · 10918 views
    This topic created in 4527 days ago, the information mentioned may be changed or developed.
    初级就好。。。不求精通TAT
    76 replies  •  2015-07-24 12:30:23 +08:00
    ChiangDi
    ChiangDi
    Jun 13, 2014 via Android
    1
    一本书好像叫《head first html and css》,我觉得很好,第一次就几乎全看懂了。
    另外楼主是女生吗?
    Albus
    Albus
    OP
    Jun 13, 2014
    2
    这样哦~ 谢谢你~
    我去看看
    嗯 怎?
    FEIF
    FEIF
    Jun 13, 2014
    3
    看这里http://www.w3school.com.cn/index.html 我也在学。。。看着都很简单。。。但是东西比较多不知道怎么理清楚 ,写几个简单的站点?
    learnshare
    learnshare
    Jun 13, 2014
    4
    等 LZ 表明性别再说。
    imn1
    imn1
    Jun 13, 2014❤️1
    5
    html 先学 tag
    css 先学 定位(上下左右宽高)和盒模型(宽高内外边距,边框)
    andyliu
    andyliu
    Jun 13, 2014❤️1
    7
    @Albus
    额 ,妹纸 下次 提问时 标题带上“妹纸” 回复会更多。。。
    canesten
    canesten
    Jun 13, 2014
    8
    Chrome浏览器按F12打开面板
    多看看
    然后右键选Edit as HTML试试改一些东西
    配合http://www.w3schools.com/
    就学会了

    那个中文的http://www.w3school.com.cn/index.html
    有些东西写的不对,英语有能力建议不要看中文的
    tangzujun
    tangzujun
    Jun 13, 2014
    9
    被头像吸引进来再看主题 codecademy在线学习入门不错
    Albus
    Albus
    OP
    Jun 13, 2014
    10
    @FEIF
    一个学长也跟我推荐了这个网站
    看了下真心东西太多了感觉脉络不是太清晰呢
    我只求能略懂啦0.0
    Albus
    Albus
    OP
    Jun 13, 2014
    11
    @learnshare
    世界怎么了。。。
    ChiangDi
    ChiangDi
    Jun 13, 2014 via Android
    12
    @learnshare 楼主已经表明性别了,她回复了“嗯,怎?”
    话说最近V2上妹子好像越来越多了,我已经关注5个了...
    Albus
    Albus
    OP
    Jun 13, 2014
    13
    @andyliu
    没事。。。
    有几个人回就行了。。。
    Albus
    Albus
    OP
    Jun 13, 2014
    15
    @tangzujun 锻炼劲椎请歪脑袋~
    tangzujun
    tangzujun
    Jun 13, 2014
    16
    @Albus 嗯 谢谢!好人!
    FEIF
    FEIF
    Jun 13, 2014
    17
    @Albus
    同求略懂。。。我只是为了学 JavaScript 打基础
    这两天刚开始找了一本 《head first html and css》 第 2 版配合中文版一起看。。。加 w3school
    先整个 demo 站点吧- -
    Albus
    Albus
    OP
    Jun 13, 2014
    18
    @FEIF 我是为了学点网页设计打基础- -#
    vansje
    vansje
    Jun 13, 2014
    19
    楼主找个首页psd图 自己切 自己div css 没有多难 切三个psd div css 就算合格了
    learnshare
    learnshare
    Jun 13, 2014❤️7
    20
    我来认真回复:

    新手入门的话,建议先从 w3school.com.cn 上面的资料开始学习。建议的学习顺序为 HTML -> CSS -> CSS3 -> JavaScript -> BOM -> DOM -> HTML5 -> jQuery -> 其他扩展部分。

    学习完整个教程之后,可以找一些书来看,系统地学习所有内容,并掌握其中的应用实例。

    知识简单分为三个部分:HTML CSS,JavaScript BOM DOM,JavaScript 框架。

    学习分为三步:基础(w3school),全面(看书),应用(抄写、模仿实例,自己动手创造)。

    -----------------
    扩展部分还有很多:

    1. 后端编程语言(PHP、Node.js、Python 等);
    2. 数据库(MySQL 等);
    3. LESS/Sass;
    4. Emmet;
    5. 各种 JavaScript 框架(Angular.js、Backbone.js 等)。

    慢慢接触吧。

    -----------------
    资源推荐:

    1. w3school.com.cn 和 w3schools.com 简单而且详细的入门参考资料;
    2. developer.mozilla.org 和 webplatform.org 科学严谨的参考文档,也有不少示例代码;
    3. https://github.com/LearnShare/blog/tree/master/posts/drafts 我自己学习时整理的一些东西,作为文档随时查找(当做教程也是不错的,不过有一些乱了);
    4. 一些看过的书(还算不错的):

    1) HTML5 秘籍 -- 李松峰;
    2) HTML5 与 CSS3 权威指南 -- 陆凌牛;
    3) Web 变成入门经典(第二版)-- 杜静、敖富江;
    4) JavaScript 权威指南(第六版)-- 淘宝前端;

    -----------------
    一开始建议的学习顺序还是很重要的。ps: 别吓坏了。
    FEIF
    FEIF
    Jun 13, 2014
    21
    @Albus
    那你肯定会 PS 吧。
    请问如何入手 只求略懂即可
    learnshare
    learnshare
    Jun 13, 2014
    22
    @FEIF 多媒体方面,建议看视频教程,成套的。
    Albus
    Albus
    OP
    Jun 13, 2014
    23
    @vansje 主要露珠是个白痴。。。TAT
    andyhu
    andyhu
    Jun 13, 2014
    24
    v2上的宅男们如狼似虎啊,楼主要小心了,呵呵
    w3schools就挺不错的,我最初学html的时候就用的是这个站,主要是先要理解DOM树结构,和css box模型,有这个基础的话,会掌握的比较快一点,另外可以加入一个前端群,有问题了可以找群里的人问问。其他就是记一些属性和怎样运用了,可以自己在chrome多尝试,按f12可出调试工具,随便改改各个属性,看看效果之类的,把w3schools的html和css教程都过一遍,就差不多了。先不要管html5和css3,那些都是html和css的扩展,循序渐进来比较靠谱。
    html编辑器的话可以选editplus,可以在编辑器里直接预览,有时候还挺方便的
    andyhu
    andyhu
    Jun 13, 2014
    25
    如果再想深入的话,可适当研究些css3 html5和javascript/jquery的内容,如果有人带一带的话,自己再肯钻研一点耐得住性子去研究,应该还是很快可以掌握一些基础的。不过要熟练掌握的话还需要时间和经验积累
    yangqi
    yangqi
    Jun 13, 2014❤️1
    26
    楼上提供的都是资料类的网站,楼主明显更需要的是教程类的网站

    不知楼主英文水平怎么样, 下面两个网站很适合初学者
    http://www.codecademy.com/tracks/web
    https://www.codeschool.com/paths/html-css
    learnshare
    learnshare
    Jun 13, 2014
    27
    其实有人指导才是最好的学习方式。(不要乱想)
    jsonline
    jsonline
    Jun 13, 2014
    28
    自己做一个页面,然后用一年的时间去思考如果把这个页面做得「更」好。
    jsonline
    jsonline
    Jun 13, 2014
    29
    如果头像即楼主的话,我可以提供无偿指导,啊哈哈
    nagato
    nagato
    Jun 13, 2014
    30
    楼主留个联系方式,我可以手把手的教你
    huwewa
    huwewa
    Jun 13, 2014
    31
    看来又是翻页的节奏。 XD
    Albus
    Albus
    OP
    Jun 13, 2014
    32
    @learnshare
    嗯 谢谢0.0
    好认真的回答昂。。。
    Albus
    Albus
    OP
    Jun 13, 2014
    33
    @FEIF
    PS的话感觉就是先了解工具
    找个基础教程或者是书看一看
    剩下的就是自己发挥想象力啦
    Albus
    Albus
    OP
    Jun 13, 2014
    34
    @andyhu
    唔 只是稍微了解下就好啦0.0
    主要是视觉方向的呢
    大家这么认真回答真是不胜惶恐= =
    tank
    tank
    Jun 13, 2014
    35
    楼主学的什么专业?设计系吗?
    Albus
    Albus
    OP
    Jun 13, 2014
    36
    Albus
    Albus
    OP
    Jun 13, 2014
    37
    @tank
    嗯 平面设计-。-
    但是希望多学点东西拓宽小宇宙- -#
    andyhu
    andyhu
    Jun 13, 2014
    38
    @FEIF 几年以前看一个叫大师之路的教程,感觉挺不错的,浅显易懂,不知现在更新没
    nikolai
    nikolai
    Jun 13, 2014
    39
    http://www.codecademy.com/tracks/web

    如果觉得看书太闷,可以试试这个
    andyhu
    andyhu
    Jun 13, 2014
    40
    @Albus 不错,楼主还是挺有钻研精神的,其实国外的设计大牛好多都是懂代码的,尤其是jquery和一些特效,可以突破只是平面设计的局限,做出一些很漂亮的交互。可以看下
    http://www.smashingmagazine.com/
    http://www.awwwards.com/
    等等
    chairuosen
    chairuosen
    Jun 13, 2014
    41
    找个前端蓝票
    Albus
    Albus
    OP
    Jun 13, 2014
    42
    @andyhu
    我逛https://dribbble.com/shots比较多
    嗯。。。
    交互设计又是另外一块啦
    现在国内的设计教育还是不太完善
    juicy
    juicy
    Jun 13, 2014
    43
    学ios吧。。。前端太苦了,不容易混出头
    7anshuai
    7anshuai
    Jun 13, 2014
    44
    推荐网易云课堂 http://study.163.com/#/index
    有HTML/CSS/PhotoShop、网页设计、平面设计等等各种教程,适合自学入门
    andyhu
    andyhu
    Jun 13, 2014
    45
    其实感觉v2应该做个功能,设计师和程序员组团一起设计一些新鲜有趣的idea,互补彼此的不足
    Albus
    Albus
    OP
    Jun 13, 2014
    46
    @juicy 我只是想熟悉就好啦~
    andyhu
    andyhu
    Jun 13, 2014
    47
    我其实设计方面技术上也都多少懂点皮毛,PS AI都能简单的用两下,但感觉颜色和整体视觉效果搭配太差劲了,小时候美术都没及格过,也希望能多接触些设计方面的内容平衡下
    hitbastank
    hitbastank
    Jun 13, 2014
    48
    1. 到 codecademy 或者 w3school 过一遍基础知识
    2. 到 youtube 或者 Tuts + 上面找个视频教程例子看两遍
    3. 自己动手做个简单的页面

    这样就可以熟悉了,离精通还有距离
    设计师的话熟悉就可以,不然抢了前端的饭碗哈哈
    Albus
    Albus
    OP
    Jun 13, 2014
    49
    @andyhu
    嗯 创意工作者好少昂。。。
    Albus
    Albus
    OP
    Jun 13, 2014
    50
    @hitbastank
    噗
    抢饭碗如果那么容易就好了- -(认真脸!)
    RaymondYip
    RaymondYip
    Jun 13, 2014
    51
    hm 我是由w3c入门的 感觉还不错 看完那个再看点别的深入
    Seita
    Seita
    Jun 13, 2014 via iPhone
    53
    在成都的话来我家一起学吧XD
    P233
    P233
    Jun 13, 2014
    54
    CSS 的话,把这里的每条属性都搞明白 XD

    http://p233.github.io/Emmet-Css-Snippets-for-Sublime-Text-2/
    elvba
    elvba
    Jun 13, 2014❤️1
    55
    还有人推荐www.w3school.com.cn?
    css选择器那部分能看?
    坑了多少人了还推荐。
    coolicer
    coolicer
    Jun 13, 2014
    56
    你们这些人走开,我才是专业的页面仔,楼主加我QQ可好
    cxd2427514
    cxd2427514
    Jun 13, 2014
    57
    撸主 头像好熟 是不是在elya的微信群
    xdazz
    xdazz
    Jun 13, 2014❤️1
    58
    adspe
    adspe
    Jun 13, 2014
    59
    MDN相当全。
    LucasW
    LucasW
    Jun 13, 2014
    60
    唉,看在头像不错的样子就回复下吧,
    直接去看视频跟着自己敲吧,简单直接,不用自己规划课程什么的,一个礼拜就会了。
    记得当时有个传智播客张鹏的视频不错,适合入门(无任何利息相关)
    taobeier
    taobeier
    Jun 13, 2014
    61
    看《head first html and css》这本书就好了。毕竟你说了你只是想打点基础而已 , 不需要太过深入的
    ChiangDi
    ChiangDi
    Jun 13, 2014 via Android
    62
    但是20人收藏是怎么个意思?
    t2doo
    t2doo
    Jun 13, 2014
    63
    @ChiangDi 坐等露珠曝照啊
    6IbA2bj5ip3tK49j
    6IbA2bj5ip3tK49j
    Jun 13, 2014
    64
    这贴怎么这么多人回啊。
    Albus
    Albus
    OP
    Jun 13, 2014
    65
    @cxd2427514
    对!露珠应届毕业啊
    进去看看有木有收实习生的呢- -
    这样都能被认出来- -
    ReSur
    ReSur
    Jun 13, 2014
    66
    自己写一些小作品
    wintr
    wintr
    Jun 14, 2014
    67
    我收实习生,鹅厂北京
    ai0by
    ai0by
    Jun 14, 2014 via Android
    69
    专业课老师让我们用DW,图形界面,PS切片,扔到DW加链接
    Albus
    Albus
    OP
    Jun 14, 2014
    70
    @wintr
    请问是那个方向的实习?
    Albus
    Albus
    OP
    Jun 14, 2014
    71
    @ai0by
    网页设计的专业课老师嘛?
    wintr
    wintr
    Jun 14, 2014
    72
    @Albus 设计 + 前端,跨界
    Albus
    Albus
    OP
    Jun 14, 2014
    73
    @wintr
    前端刚开始自己看基本不会啊。。。
    交互也没接触过
    我是视觉传达专业的呢0.0
    这样也OK么
    wintr
    wintr
    Jun 17, 2014
    74
    @Albus 这些入门都很快的。
    个人建议,先用 2-3 个月自学些基础,做一些小实践,然后再实习
    Albus
    Albus
    OP
    Jun 17, 2014
    75
    @wintr 我今年应届毕业生啦~
    平面是专业- -
    前端是想自己学一点啦~
    waveiron
    waveiron
    Jul 24, 2015
    76
    这有个视频教程,讲的还行
    http://edu.51cto.com/course/course_id-4130.html
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   1388 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 101ms · UTC 20:18 · PVG 04:18 · LAX 12:18 · JFK 15:18
    ♥ Do have faith in what you're doing.